WebGL 3d sample WITHOUT shaders. 演算効率無視すれば３Ｄ入門にシェーダって邪魔じゃん？というコード。

WebGL3D.html

<canvas width="256" height="256"></canvas><hr/>
<script>"use strict";
let opt={preserveDrawingBuffer:true};
let cx=document.querySelector("canvas").getContext("webgl",opt);
const cos=Math.cos,π=Math.PI,rnd=Math.random;
let roty=([x,y,z],θ)=>[x*cos(θ+0)+z*cos(θ+π/2),y,x*cos(θ-π/2)+z*cos(θ+0)];
let pers=([x,y,z])=>{let w=1+z*0.5;return [x/w,y/w,z/w]};
let ab=new Float32Array(3000);
for(let i=0;i<3000;i+=3)ab.set([rnd()-.5,rnd(),rnd()],i)
function draw(now){
	let time=now/1000;
	cx.disable(cx.SCISSOR_TEST);cx.clearColor(0,0,1,1);	cx.clear(0x4000);
	cx.enable(cx.SCISSOR_TEST);
	for(let i=0; i<1000;i++){
		let [x,y,z,w]=[ab[i*3+0],ab[i*3+1],0,1], c=ab[i*3+2];
		[x,y,z]=roty([x,y,z],time);
		[x,y,z]=pers([x,y,z]);
		cx.scissor(128+x*128,64+y*128,4,4);
		cx.clearColor(c,c,c,1);	cx.clear(0x4000);
	}
	requestAnimationFrame(draw);
};	requestAnimationFrame(draw);
</script>