undo

index.js

@@ -75,11 +75,11 @@ async function main() {
     state.width = width;
     state.height = height;
 
-    requestAnimationFrame(render);
+    requestAnimationFrame((time) => render(time, mat4, context, state, RENDER_PASS_DESCRIPTOR));
 }
 
-function render() {
-    state.time = performance.now() * config.time.phase;
+function render(time, mat4, context, state, RENDER_PASS_DESCRIPTOR) {
+    time *= config.time.phase;
     const fov = 60 * Math.PI / 180;
     const aspect = canvas.clientWidth / canvas.clientHeight;
     const projectionMatrix = mat4.perspective(fov, aspect, config.render.zNear, config.render.zFar);
@@ -89,7 +89,7 @@ function render() {
     const encoder = state.device.createCommandEncoder();
     const pass = encoder.beginRenderPass(RENDER_PASS_DESCRIPTOR);
     pass.setPipeline(state.pipeline);
-    mat4.rotateY(viewProjectionMatrix, state.time, state.matrix);
+    mat4.rotateY(viewProjectionMatrix, time, state.matrix);
     mat4.translate(state.matrix, [-state.width / 2, -state.height / 2, 0], state.matrix);
     state.device.queue.writeBuffer(state.uniformBuffer, 0, state.uniformValues);
     pass.setBindGroup(0, state.bindGroup);
@@ -98,7 +98,7 @@ function render() {
     pass.drawIndexed(state.numGlyphs * 6);
     pass.end();
     state.device.queue.submit([encoder.finish()]);
-    requestAnimationFrame(render);
+    requestAnimationFrame((t) => render(t, mat4, context, state, RENDER_PASS_DESCRIPTOR));
 }
 
 main();