WebGL Migration (Aesthetic Computer)#

Goal#

Move the rendering pipeline from Canvas2D compositing to a WebGL-based composite path.

Status#

• Add WebGL blitter module (full-screen quad + texture upload)
• Wire WebGL composite canvas into BIOS render path
• Move overlay compositing off the main canvas
• Preserve recording outputs with WebGL composite
• Preserve screenshot outputs with WebGL composite
• Verify underlay/tape playback behavior
• Validate WebGPU path still works (no conflicts)
• Add runtime flag/toggle and telemetry
• Performance profiling in sandboxed iframes

Subtasks#

1) WebGL Blitter (Base Frame)#

• Create module to upload ImageData as a texture and draw full-screen quad
• Add canvas sizing + visibility toggles in bios.mjs
• Replace ctx.putImageData with WebGL blit when enabled

2) Overlay Compositing#

• Add dedicated overlay canvas layer
• Route overlay painters to overlay canvas when WebGL composite enabled
• Ensure overlay canvas clears each frame to avoid accumulation

3) Recording / Screenshot Capture#

• Composite WebGL canvas + overlay canvas into offscreen capture canvas
• Preserve existing ordering (HUD before tape progress)
• Ensure clean screenshots exclude overlays

4) Runtime Flags + Fallbacks#

• Add content.webglCompositeEnabled flag path
• Add globalThis.acUseWebGLComposite override
• Fallback to Canvas2D if WebGL init fails

5) Validation#

• objkt sandbox: compare FPS vs Canvas2D path
• Regular browser: confirm no regressions
• Recording output: verify overlays + tape progress timing
• Glaze path: ensure compatibility with composite pipeline

Notes#

• WebGL composite should coexist with existing WebGPU path; if content.webgpuEnabled is true, WebGL composite should stay off.
• Keep UI canvas (cursor/spinner) above overlays to avoid GPU text rendering complexity.