JSFiddle - React, Tailwind, and code Playground
HTML
<canvas id="myCanvas" width="320" height="240" style="width:640px;"></canvas>
JavaScript
window.requestAnimFrame = (function(callback) {
return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame ||
function(callback) {
window.setTimeout(callback, 1000 / 60);
};
})();
var canvas = document.getElementById('myCanvas');
var ctx = canvas.getContext("2d");
ctx.fillStyle = "#000000";
ctx.fillRect(0,0,canvas.width,canvas.height);
var cw = canvas.width, ch = canvas.height;
var p = ctx.getImageData(0,0,cw,ch);
var pm = p.data;
var o = new Array(200);
var aa=Math.round(cw/2);
var ab=5;
function resetStar(i){
o[i] = [aa*1000,Math.round(ch*.9)*1000,Math.round(Math.random()*3000)-1500,Math.round(Math.random()*-3500)-1000];
}
for (var i = 0; i < o.length; i++)
resetStar(i);
var m;
var l=1;
function draw() {
aa = aa +ab;
if (aa>cw-1){
aa=cw-1;
ab *=-1;
}
if (aa<1){
aa=1;
ab*=-1;
}
for (var i = 4; i < (cw-1) * 4; i=i+4){
for (var n = 0; n < ch-1; n++){
m = 0;
pm[i + n * cw * 4 + m] = Math.round(pm[i + n * cw * 4 + m]*.20)+Math.round(pm[i + (n+1) * cw * 4 + m]*.30)+Math.round(pm[i + (n+1) * cw * 4 + m-4]*.25)+Math.round(pm[i + (n+1) * cw * 4 + m+4]*.25);
m = 1;
pm[i + n * cw * 4 + m] = Math.round(pm[i + n * cw * 4 + m]*.20)+Math.round(pm[i + (n+1) * cw * 4 + m]*.29)+Math.round(pm[i + (n+1) * cw * 4 + m-4]*.24)+Math.round(pm[i + (n+1) * cw * 4 + m+4]*.24);
m = 2;
pm[i + n * cw * 4 + m] = Math.round(pm[i + n * cw * 4 + m]*.15)+Math.round(pm[i + (n+1) * cw * 4 + m]*.25)+Math.round(pm[i + (n+1) * cw * 4 + m-4]*.22)+Math.round(pm[i + (n+1) * cw * 4 + m+4]*.22);
}}
for (var qq= 0; qq < o.length; qq++){
o[qq][3]=o[qq][3]+40;
o[qq][0]+=o[qq][2];
o[qq][1]+=o[qq][3];
if (o[qq][0]<1000){
o[qq][0] = 1000;
o[qq][2] *= -1;
}
if (Math.round(o[qq][0]/1000)>(cw-2)){
o[qq][0] = (cw-2)*1000;
o[qq][2] *= -1;
}
if (Math.round(o[qq][1]/1000)<ch-1){
if (o[qq][1]>1000)
for (var yy = 0; yy...