Viewing Program

Program Data

Program thumbnail for "{props.program.title}"

Title	webgl2 is the best
ID	6075740885270528
Created	3 months ago, 1727635557090
Updated	3 months ago, 1727636544321
Code	<!DOCTYPE html><html><!-- a much faster(haha im better) recreation of webgl2fundamental's background uses the best webgl library to ever exist(3.js sucks haha) lol 5,000 shapes at 60 fps my fps starts to drop at 20,000 --> <title>webgl2 is the best</title> <canvas id='gl-canvas'></canvas> <canvas id='ui-canvas'></canvas> <style> body{ margin:0; overflow:hidden; } </style> <script src='https://cdnjs.cloudflare.com/ajax/libs/gl-matrix/2.8.1/gl-matrix-min.js'></script> <script src='https://cdn.jsdelivr.net/gh/Dddatt/D.js@v2.1.0/index.js'></script> <script type='application/javascript'> function main(){ let width=window.innerWidth,height=window.innerHeight,aspect=width/height let glCanvas=document.getElementById('gl-canvas') let uiCanvas=document.getElementById('ui-canvas') glCanvas.width=width glCanvas.height=height uiCanvas.width=width uiCanvas.height=height let ctx=uiCanvas.getContext('2d') let _gl=D.getContext(glCanvas,'webgl2',{antialias:1}) glCanvas.style.display='none' D.viewport(0,0,width,height) D.enable3D() let program=D.createProgram( `#version 300 es precision lowp float; in vec3 vertPos; in vec3 vertNormal; in vec3 instancePos; in vec3 instanceRot; uniform mat4 viewMatrix; out vec3 pixPos; out float section; out vec3 pixNormal; vec3 rotateVector(vec3 v,vec3 euler){ mat3 rotMat=mat3( cos(euler.y)cos(euler.z), sin(euler.x)sin(euler.y)cos(euler.z)-cos(euler.x)sin(euler.z), cos(euler.x)sin(euler.y)cos(euler.z)+sin(euler.x)sin(euler.z), cos(euler.y)sin(euler.z), sin(euler.x)sin(euler.y)sin(euler.z)+cos(euler.x)cos(euler.z), cos(euler.x)sin(euler.y)sin(euler.z)-sin(euler.x)cos(euler.z), -sin(euler.y), sin(euler.x)cos(euler.y), cos(euler.x)cos(euler.y) ); return rotMatv; } void main(){ vec3 vp=rotateVector(vertPos5.,instanceRot)+instancePos; vec3 vn=rotateVector(vertNormal,instanceRot); vec4 pos=viewMatrixvec4(vp,1); section=vertPos.x3.; pixPos=vp; pixNormal=vn; gl_Position=pos; } `, `#version 300 es precision lowp float; uniform vec3 camPos; in vec3 pixNormal; in vec3 pixPos; in float section; out vec4 FragColor; void main(){ vec3 normal=normalize(pixNormal); float diffuse=dot(normalize(vec3(50,250,50)-pixPos),normal)0.3+0.7; vec3 toLight=normalize(vec3(0,25000,500)-pixPos); vec3 toCam=normalize(camPos-pixPos); vec3 halfVec=normalize(toCam+toLight); float specular=dot(halfVec,normal)0.5+0.5; specular=specular; specular=specular; specular=specular; specular=specular; vec3 col=vec3(254, 203, 0)/255.0; if(section<-0.33333)col=vec3(0, 38, 100)/255.0; if(section>0.33333)col=vec3(198, 12, 48)/255.0; FragColor=vec4(coldiffuse+specular0.75,1); } `) D.useProgram(program) let m let mesh=D.createMesh( D.createMeshData({meshes:[{type:'box',x:0,y:0,z:0,w:0.5,h:0.01,l:0.52/3,r:1,g:1,b:1}],order:['x','y','z','nx','ny','nz']}), [ ['vertPos',3,24,0], ['vertNormal',3,24,12], ], [ ['instancePos',3,24,0], ['instanceRot',3,24,12], ] ) for(let i=0,amount=5000,srm=Math.sqrt(amount)0.6;i<amount;i++){ D.addInstance(mesh,[D.random(-srm,srm),D.random(-srm,srm),D.random(-srm,srm),Math.random()6.2,Math.random()6.2,Math.random()6.2]) } let proj=D.prespectiveMatrix(80,aspect,0.1,1000),mat=mat4.identity(new Float32Array(16)) let TIME=0,then,dt function loop(now){ if(!then){now=window.performance.now();then=now} dt=(now-then)0.001 TIME+=dt D.clear(1,1,1,1) let view=D.setViewMatrix(mat,proj,0,0,0,TIME0.15,TIME0.07,10) D.setUniform('camPos',view.camPos) D.setUniform('viewMatrix',mat) for(let i=0;i<mesh.instanceData.length;i+=6){ mesh.instanceData[i+3]+=dt0.5 mesh.instanceData[i+4]+=dt0.3 mesh.instanceData[i+5]+=dt*0.1 } D.renderMesh(mesh) ctx.drawImage(glCanvas,0,0) then=now window.parent.raf=window.requestAnimationFrame(loop) } if(window.parent.raf){ window.cancelAnimationFrame(window.parent.raf) } loop() } main() </script> <!--For restart button--> <script></script> </html>
Folds
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIXCxIKU2NyYXRjaHBhZBiAgNvJqrvlCgw
Votes	1
Spin-Offs	0
Type	WEBPAGE
Width	400
Height	400
User Flagged	false
Origin Scratchpad	{"id":"5621539531046912","title":"chadtober","deleted":"false","official":"false"}
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	Dat
Author Name	Dddatt
Author ID	kaid_4164356982737975081215128
Author Profile Access	COACH

Archive Data

Added	3 months ago, 1727635563879
Updated	3 months ago, 1727636546759
Source Deleted	unknown