JSFiddle - React, Tailwind, and code Playground
HTML
<canvas id='cv'></canvas>
JavaScript
var canvas=document.getElementById('cv');
var context=canvas.getContext('2d');
var imgd, pix;
var img = new Image();
// пикрандом
img.src = "https://2ch.hk/sn/src/354491/14578821003050.jpg";
img.onload = function(){
canvas.width = img.width;
canvas.height = img.height;
context.drawImage(img, 0, 0);
// дальше не идет :(
imgd = context.getImageData(0, 0, canvas.width, canvas.height);
pix = imgd.data;
window.requestAnimationFrame(test);
}
function test() {
for (var i=0; i<pix.length; i+=4) {
if (pix[i]==255) pix[i]=0;
if (Math.random()>0.1) pix[i] += 1;
if (pix[i+1]==0) pix[i+1]=255;
if (Math.random()>0.2) pix[i+1] -= 1;
if (pix[i+2]==255) pix[i+2]=0;
if (Math.random()>0.3) pix[i+2] += 1;
}
context.putImageData(imgd, 0, 0);
window.requestAnimationFrame(test);
}