Three.js Debug Profiler
Find the owning cause or measured bottleneck before changing code.
Read references/debug-profile-checklists.md for the applicable render,
runtime, loading, mobile, audio, physics, or performance path.
Debug Workflow
- Reproduce in the correct build mode.
- Read the first console, page, and relevant network errors.
- Check canvas display/drawing-buffer size, renderer/context, and loop ownership.
- Check camera, clipping, lights, fog, materials, visibility, transforms, and
scene contents.
- Check asset paths, loaders, CORS, base path, async ordering, and Mint artifact
integration.
- Check delta units, update order, fixed timestep, bodies/colliders, listeners,
pointer/touch behavior, resize, and audio unlock/decode.
- Fix the cause in the owning module.
- Retest the broken path plus screenshot, canvas pixels, and errors.
Performance Workflow
- Record target device, viewport, DPR, build mode, and worst-case scenario.
- Measure frame time/FPS, draw calls, triangles, resources, memory, bundle, and
expensive shadows/shaders/post-processing.
- Identify CPU, GPU, memory, or network ownership.
- Change one bottleneck at a time using reuse, instancing, culling, LOD,
pooling, disposal, DPR limits, or cheaper rendering.
- Re-measure the same scenario and verify playability and visuals.
Final Response
Lead with root cause or bottleneck. Report files changed, baseline/post metrics,
commands, screenshots/artifacts, retested paths, and residual risks.
1---2name: threejs-debug-profiler3description: Diagnose Three.js rendering, loading, animation, resize, audio, physics, input, mobile, and performance problems using reproduction and measured evidence.4---56# Three.js Debug Profiler78Find the owning cause or measured bottleneck before changing code.910Read `references/debug-profile-checklists.md` for the applicable render,11runtime, loading, mobile, audio, physics, or performance path.1213## Debug Workflow14151. Reproduce in the correct build mode.162. Read the first console, page, and relevant network errors.173. Check canvas display/drawing-buffer size, renderer/context, and loop ownership.184. Check camera, clipping, lights, fog, materials, visibility, transforms, and19 scene contents.205. Check asset paths, loaders, CORS, base path, async ordering, and Mint artifact21 integration.226. Check delta units, update order, fixed timestep, bodies/colliders, listeners,23 pointer/touch behavior, resize, and audio unlock/decode.247. Fix the cause in the owning module.258. Retest the broken path plus screenshot, canvas pixels, and errors.2627## Performance Workflow28291. Record target device, viewport, DPR, build mode, and worst-case scenario.302. Measure frame time/FPS, draw calls, triangles, resources, memory, bundle, and31 expensive shadows/shaders/post-processing.323. Identify CPU, GPU, memory, or network ownership.334. Change one bottleneck at a time using reuse, instancing, culling, LOD,34 pooling, disposal, DPR limits, or cheaper rendering.355. Re-measure the same scenario and verify playability and visuals.3637## Final Response3839Lead with root cause or bottleneck. Report files changed, baseline/post metrics,40commands, screenshots/artifacts, retested paths, and residual risks.
mintdotgg