From 817f49cb4d6bbb348a8d4df5b39ad815f1d956c1 Mon Sep 17 00:00:00 2001 From: Noelle Calliope <1581674+mekanoe@users.noreply.github.com> Date: Sun, 8 Oct 2023 00:33:26 -0400 Subject: [PATCH] optimize Behavior automounting --- html/002-webgpu-instead/main.js | 2 +- src/renderer/mesh-renderer.ts | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/html/002-webgpu-instead/main.js b/html/002-webgpu-instead/main.js index 518db8d..218dc7d 100644 --- a/html/002-webgpu-instead/main.js +++ b/html/002-webgpu-instead/main.js @@ -1 +1 @@ -import{a as D,b as z} from"../chunk-818093f0cbbefec3.js";class _{v;canvas;_adapter;_device;_context;telemetry;registry={onBeforeUpdate:[],onAfterUpdate:[],onUpdate:[],onStart:[]};constructor(v={}){this.config=v;this.config={fov:45,...v},this.canvas=document.querySelector("canvas"),this.canvas.width=window.innerWidth,this.canvas.height=window.innerHeight,this.telemetry=new z(this),this.init().catch((x)=>{const C=document.querySelector("main");if(C)C.innerHTML="
your browser didn't let me set up webgpu. firefox nightly or enable dom.webgpu.enable.
";throw new Error("Unable to initialize WebGPU. Your browser or machine may not support it.",x)})}async init(){if(!navigator.gpu)throw new Error("WebGPU not supported");if(this._adapter=await navigator.gpu.requestAdapter(),!this._adapter)throw new Error("No GPU adapter found");if(this._device=await this.adapter.requestDevice(),!this._device)throw new Error("No GPU device found");this._context=this.canvas.getContext("webgpu"),this.context.configure({device:this.device,format:"bgra8unorm",alphaMode:"premultiplied",...this.config.context})}get context(){if(!this._context)throw new Error("WebGPU context not initialized");return this._context}get adapter(){if(!this._adapter)throw new Error("WebGPU adapter not initialized");return this._adapter}get device(){if(!this._device)throw new Error("WebGPU device not initialized");return this._device}onBeforeUpdate(v){this.registry.onBeforeUpdate.push(v)}onAfterUpdate(v){this.registry.onAfterUpdate.push(v)}onUpdate(v){this.registry.onUpdate.push(v)}onStart(v){this.registry.onStart.push(v)}doUpdate(v){this.registry.onBeforeUpdate.forEach((x)=>x(v,this)),this.registry.onUpdate.forEach((x)=>x(v,this)),this.registry.onAfterUpdate.forEach((x)=>x(v,this))}doStart(v=0){this.registry.onStart.forEach((x)=>x(v,this))}async oneShot(v=0){this.doStart(v),this.doUpdate(v)}start(){this.doStart();const v=(x)=>{this.doUpdate(x),requestAnimationFrame(v)};requestAnimationFrame(v)}}class j extends D{v;x;depthTexture;uniformBuffer;texture;sampler;uniformBindGroup;renderPassDescriptor;constructor(v,x){super(v);this.app=v;this.mesh=x}onStart(){console.log("hello from meshrenderer!"),console.log(`i've got a ${this.mesh.constructor.name}`)}onUpdate(v){}}class k{v;constructor(v){this.config=v}buffer(v){const x=v.device.createBuffer({size:this.config.mesh.byteLength,usage:GPUBufferUsage.VERTEX,mappedAtCreation:!0});return new Float32Array(x.getMappedRange()).set(this.config.mesh),x.unmap(),x}pipeline(v,x,C){const q=x.module(v);return v.device.createRenderPipeline({layout:"auto",vertex:{module:q,entryPoint:"main",buffers:[{arrayStride:4,attributes:[{shaderLocation:0,offset:0,format:"float32x4"},{shaderLocation:2,offset:this.config.positionSize,format:"float32x4"},{shaderLocation:1,offset:this.config.positionSize+this.config.colorSize,format:"float32x4"}]}]},fragment:{module:q,entryPoint:"main",targets:[{format:"rgba8unorm"}]},primitive:{topology:"triangle-list",cullMode:C.cullMode??"back"},depthStencil:C.stencil&&{depthWriteEnabled:!0,depthCompare:"less",format:"depth24plus"}})}}var J=new Float32Array([-1,-1,0,1,1,1,1,1,0,0,1,-1,0,1,1,1,1,1,1,0,-1,1,0,1,1,1,1,1,0,1,1,1,0,1,1,1,1,1,1,1]),E=new k({mesh:J,positionSize:16,colorSize:16,uvSize:8});var F="fn rgb2hsv(vec3f c)->vec3f{vec4f K=vec4f(0.0,-1.0/3.0,2.0/3.0,-1.0);vec4f p=mix(vec4f(c.bg,K.wz),vec4f(c.gb,K.xy),step(c.b,c.g));vec4f q=mix(vec4f(p.xyw,c.r),vec4f(c.r,p.yzx),step(p.x,c.r));f32 d=q.x-min(q.w,q.y);f32 e=1.0e-10;return vec3f(abs(q.z+(q.w-q.y)/(6.0*d+e)),d/(q.x+e),q.x);}fn hsv2rgb(vec3f c)->vec3f{vec4f K=vec4f(1.0,2.0/3.0,1.0/3.0,3.0);vec3f p=abs(fract(c.xxx+K.xyz)*6.0-K.www);return c.z*mix(K.xxx,clamp(p-K.xxx,0.0,1.0),c.y);}struct Uniforms{modelViewProjectionMatrix:mat4x4,time:f32,}@group(0)@binding(0)var uniforms:Uniforms;struct v2f{@builtin(position)position:vec4f,@location(0)color:vec4f,@location(1)uv:vec2f,}@vertex fn main(@builtin(position)position:vec4f,@location(0)color:vec4f,@location(1)uv:vec2f,)->v2f{return v2f(uniforms.modelViewProjectionMatrix*position,color,uv);}@fragment fn main(@location(0)uv:vec2f,)->@location(0)vec4f{f32 z=sin(uniforms.time)*0.001*0.5+0.5;vec3f hsv=vec3f(uv.x,uv.y,z);hsv.x+=uniforms.time*0.0001;hsv.y=1.0;hsv.z=1.0;vec3f rgb=hsv2rgb(hsv);return saturate(vec4f(rgb,1.0));}";var H="struct Uniforms{modelViewProjectionMatrix:mat4x4,time:f32,}@group(0)@binding(0)var uniforms:Uniforms;struct v2f{@builtin(position)position:vec4f,@location(0)uv:vec2f,}@vertex fn vertex_main(@builtin(position)position:vec4f,@location(0)uv:vec2f,)->v2f{return v2f(uniforms.modelViewProjectionMatrix*position,uv);}@fragment fn fragment_main(@location(0)uv:vec2f,)->vec4f{return vec4f(1.0,0.0,1.0,1.0);}";var N=new RegExp("#pragma ([a-z]+) ([a-zA-Z_0-9]+)","g");class P{_module=null;vertexMain="main";fragmentMain="main";code;constructor(...v){this.code=v.join("\n");const x=this.code.matchAll(N);for(let C of x||[])switch(C[1]){case"fragment":this.fragmentMain=C[2];break;case"vertex":this.vertexMain=C[2];break}}module(v){return this._module=this._module||(this._module=v.device.createShaderModule({code:this.code}))}}var S=new P(H);var I=new _({fov:20}),R=new j(I,E),s=new P(F);I.start(); +import{a as D,b as z} from"../chunk-818093f0cbbefec3.js";class _{v;canvas;_adapter;_device;_context;telemetry;registry={onBeforeUpdate:[],onAfterUpdate:[],onUpdate:[],onStart:[]};constructor(v={}){this.config=v;this.config={fov:45,...v},this.canvas=document.querySelector("canvas"),this.canvas.width=window.innerWidth,this.canvas.height=window.innerHeight,this.telemetry=new z(this),this.init().catch((x)=>{const C=document.querySelector("main");if(C)C.innerHTML="
your browser didn't let me set up webgpu. firefox nightly or enable dom.webgpu.enable.
";throw new Error("Unable to initialize WebGPU. Your browser or machine may not support it.",x)})}async init(){if(!navigator.gpu)throw new Error("WebGPU not supported");if(this._adapter=await navigator.gpu.requestAdapter(),!this._adapter)throw new Error("No GPU adapter found");if(this._device=await this.adapter.requestDevice(),!this._device)throw new Error("No GPU device found");this._context=this.canvas.getContext("webgpu"),this.context.configure({device:this.device,format:"bgra8unorm",alphaMode:"premultiplied",...this.config.context})}get context(){if(!this._context)throw new Error("WebGPU context not initialized");return this._context}get adapter(){if(!this._adapter)throw new Error("WebGPU adapter not initialized");return this._adapter}get device(){if(!this._device)throw new Error("WebGPU device not initialized");return this._device}onBeforeUpdate(v){this.registry.onBeforeUpdate.push(v)}onAfterUpdate(v){this.registry.onAfterUpdate.push(v)}onUpdate(v){this.registry.onUpdate.push(v)}onStart(v){this.registry.onStart.push(v)}doUpdate(v){this.registry.onBeforeUpdate.forEach((x)=>x(v,this)),this.registry.onUpdate.forEach((x)=>x(v,this)),this.registry.onAfterUpdate.forEach((x)=>x(v,this))}doStart(v=0){this.registry.onStart.forEach((x)=>x(v,this))}async oneShot(v=0){this.doStart(v),this.doUpdate(v)}start(){this.doStart();const v=(x)=>{this.doUpdate(x),requestAnimationFrame(v)};requestAnimationFrame(v)}}class j extends D{v;x;depthTexture;uniformBuffer;texture;sampler;uniformBindGroup;renderPassDescriptor;constructor(v,x){super(v);this.app=v;this.mesh=x}onStart(){console.log("hello from meshrenderer!"),console.log(`i've got a ${this.mesh.constructor.name}`)}onUpdate(v){}}class k{v;constructor(v){this.config=v}buffer(v){const x=v.device.createBuffer({size:this.config.mesh.byteLength,usage:GPUBufferUsage.VERTEX,mappedAtCreation:!0});return new Float32Array(x.getMappedRange()).set(this.config.mesh),x.unmap(),x}pipeline(v,x,C){const q=x.module(v);return v.device.createRenderPipeline({layout:"auto",vertex:{module:q,entryPoint:"main",buffers:[{arrayStride:4,attributes:[{shaderLocation:0,offset:0,format:"float32x4"},{shaderLocation:2,offset:this.config.positionSize,format:"float32x4"},{shaderLocation:1,offset:this.config.positionSize+this.config.colorSize,format:"float32x4"}]}]},fragment:{module:q,entryPoint:"main",targets:[{format:"rgba8unorm"}]},primitive:{topology:"triangle-list",cullMode:C.cullMode??"back"},depthStencil:C.stencil&&{depthWriteEnabled:!0,depthCompare:"less",format:"depth24plus"}})}}var J=new Float32Array([-1,-1,0,1,1,1,1,1,0,0,1,-1,0,1,1,1,1,1,1,0,-1,1,0,1,1,1,1,1,0,1,1,1,0,1,1,1,1,1,1,1]),E=new k({mesh:J,positionSize:16,colorSize:16,uvSize:8});var F="fn rgb2hsv(vec3f c)->vec3f{vec4f K=vec4f(0.0,-1.0/3.0,2.0/3.0,-1.0);vec4f p=mix(vec4f(c.bg,K.wz),vec4f(c.gb,K.xy),step(c.b,c.g));vec4f q=mix(vec4f(p.xyw,c.r),vec4f(c.r,p.yzx),step(p.x,c.r));f32 d=q.x-min(q.w,q.y);f32 e=1.0e-10;return vec3f(abs(q.z+(q.w-q.y)/(6.0*d+e)),d/(q.x+e),q.x);}fn hsv2rgb(vec3f c)->vec3f{vec4f K=vec4f(1.0,2.0/3.0,1.0/3.0,3.0);vec3f p=abs(fract(c.xxx+K.xyz)*6.0-K.www);return c.z*mix(K.xxx,clamp(p-K.xxx,0.0,1.0),c.y);}struct Uniforms{modelViewProjectionMatrix:mat4x4,time:f32,}@group(0)@binding(0)var uniforms:Uniforms;struct v2f{@builtin(position)position:vec4f,@location(0)color:vec4f,@location(1)uv:vec2f,}@vertex fn main(@builtin(position)position:vec4f,@location(0)color:vec4f,@location(1)uv:vec2f,)->v2f{return v2f(uniforms.modelViewProjectionMatrix*position,color,uv);}@fragment fn main(@location(0)uv:vec2f,)->@location(0)vec4f{f32 z=sin(uniforms.time)*0.001*0.5+0.5;vec3f hsv=vec3f(uv.x,uv.y,z);hsv.x+=uniforms.time*0.0001;hsv.y=1.0;hsv.z=1.0;vec3f rgb=hsv2rgb(hsv);return saturate(vec4f(rgb,1.0));}";var H="struct Uniforms{modelViewProjectionMatrix:mat4x4,time:f32,}@group(0)@binding(0)var uniforms:Uniforms;struct v2f{@builtin(position)position:vec4f,@location(0)uv:vec2f,}@vertex fn vertex_main(@builtin(position)position:vec4f,@location(0)uv:vec2f,)->v2f{return v2f(uniforms.modelViewProjectionMatrix*position,uv);}@fragment fn fragment_main(@location(0)uv:vec2f,)->vec4f{return vec4f(1.0,0.0,1.0,1.0);}";var N=new RegExp("#pragma ([a-z]+) ([a-zA-Z_0-9]+)","g");class P{_module=null;vertexMain="main";fragmentMain="main";code;constructor(...v){this.code=v.join("\n");const x=this.code.matchAll(N);for(let C of x||[])switch(C[1]){case"fragment":this.fragmentMain=C[2];break;case"vertex":this.vertexMain=C[2];break}}module(v){return this._module=this._module||(this._module=v.device.createShaderModule({code:this.code}))}}var S=new P(H);var I=new _({fov:20}),s=new j(I,E),u=new P(F);I.start(); diff --git a/src/renderer/mesh-renderer.ts b/src/renderer/mesh-renderer.ts index 1e08ef0..2ab6bb9 100644 --- a/src/renderer/mesh-renderer.ts +++ b/src/renderer/mesh-renderer.ts @@ -17,10 +17,10 @@ export class MeshRenderer extends Behavior { super(app); } - override onStart() { + onStart() { console.log("hello from meshrenderer!"); console.log(`i've got a ${this.mesh.constructor.name}`); } - override onUpdate(time: number) {} + onUpdate(time: number) {} }