В Chorme все работает, а IE 11 тормозит причем сильно.
Как победить это программно не прибегая к созданию градиента через картинку.
Только программно.
About IE:
вот код (
ссылка на fiddle):
<html><head></head><body><script>
let sz = 80;
let cnv = createCanvasSize(sz,sz);
createGragientSL(cnv.ctx, sz, sz);
document.body.appendChild(cnv);
function createGragientSL(ctx, w, h) {
const accur = w;
const wCol = w / accur;
let grd = ctx.createLinearGradient(0, 0, 0, h);
for (let i = 0; i <= accur - 1; i++) {
let alpha = 1 - 1 / accur * i;
let colorA = 'rgba(255,255,255,' + alpha + ')';
grd.addColorStop(0, colorA);
let colorB = 'rgba(0,0,0,' + alpha + ')';
grd.addColorStop(1, colorB);
ctx.fillStyle = grd;
ctx.fillRect(wCol * i, 0, (wCol), h);
}
}
function createCanvasSize(width, height, className) {
let node = document.createElement('canvas');
if (className) node.classList.add(className);
node.width = width;
node.height = height;
node.ctx = node.getContext('2d');
return node;
}
</script></body></html>
