Single Matrix Update Shared Across Multiple Three.js Render Passes in Browser Game
Developer of the browser game Vesper implemented a lightweight TypeScript wrapper that updates a Three.js scene's world matrices once per frame before submitting multiple render passes — including main view, reflection, and ambient occlusion. The approach prevents redundant transform calculations and keeps render ordering predictable by separating animation updates from per-pass rendering callbacks. A key design detail is the use of a finally block, which ensures the scene's original matrix auto-update policy is restored even if a render pass throws an error. Render callbacks are permitted to change object visibility but must not alter poses or bone positions after the shared matrix update has occurred. Two automated tests covering transform correctness and error-case policy restoration passed successfully as of September 15, 2026, against Three.js version 0.180.
This is an AI-generated summary. ShortSingh links to the original source for the complete article.


Discussion (0)
Log in to join the discussion and vote.
Log in