leanentropy/threejs-phaser-game-skills

threejs-debug-profiler

Debug and profile Three.js browser games.

Voir la source

Mode d’emploi

  1. Copiez la commande et examinez le paquet avant de l’installer dans votre environnement agent.
  2. Consultez le document original pour les outils, identifiants et environnements requis.
  3. Décrivez les entrées et le livrable souhaité ; comparez la sortie aux sources.
npx skills add https://github.com/leanentropy/threejs-phaser-game-skills --skill threejs-debug-profiler

Avant de commencer

  • L’installation n’inclut ni abonnement au modèle, ni quota API, ni accès aux fichiers.
  • Étoiles et installations reflètent l’activité, pas un test indépendant de qualité ou de sécurité.
Document Skill original

Rendu depuis le dépôt source en conservant titres, exemples, code, tableaux, liens et images.

Three.js Debug Profiler

Purpose

Find root causes and optimize measured bottlenecks without breaking playability.

Debug Workflow

Load references/debug-profile-checklists.md as the first action when debugging render/runtime/mobile issues, asset loading, audio loading/playback, animation, resize, input, blank canvas, physics/collision bugs, or profiling performance. Track it in a reference ledger with yes/no, path, and failure reason. Do not mark the debug/profile phase complete while this reference is skipped for debug or profiling work.

Load references/checklists/scene-debugging.md for render/runtime bug diagnosis, references/checklists/performance-profile.md for profiling work, and references/checklists/mobile-input.md for mobile render/input issues. Load references/prompt-templates.md only when the user asks for reusable debug/profile prompts or a task template.

  1. Reproduce locally.
  2. Read console/page/network errors.
  3. Check canvas display size and drawing-buffer size.
  4. Check renderer/context/loop ownership.
  5. Check camera, aspect, near/far, lights, materials, fog, scene contents, transforms.
  6. Check asset paths/loaders/CORS/base path.
  7. Check animation delta units, physics/update order, fixed timestep, collider/body ownership, input listeners, pointer/touch behavior, resize, and audio context unlock/decode errors when audio is involved.
  8. Fix root cause in owning module.
  9. Verify browser screenshot, nonblank canvas, console/page errors, and broken path.

Performance Workflow

  1. Reproduce in correct build mode.
  2. Record baseline: FPS/frame time, draw calls, triangles, geometries, textures, memory, bundle.
  3. Identify CPU/GPU/memory/network bottleneck.
  4. Optimize one thing at a time: instancing, shared resources, culling, LOD, DPR cap, cheaper shadows/post, texture discipline.
  5. Re-measure same scenario and verify visuals/playability.

Final Response

Lead with root cause or bottleneck. Report the reference ledger, checklist items used, files changed, baseline/post metrics, commands, screenshots/artifacts, broken paths retested, and residual risks.

Tâches connexes

du même dépôt

Autres Skills

Tous les Skills
leanentropy
Communauté

threejs-3d-generator

Generate, texture, rig, animate, stylize, convert, and download 3D assets for Three.js games using the Tripo API. Use for text-to-3D, image-to-3D, 2D concept to 3D conversion, game-ready GLB/FBX assets, characters, creatures, buildings, props, weapons, terrain pieces, auto-rigging, animation retargeting, model texturing, LEGO/voxel/Minecraft-style stylization, low-poly/quad conversion, and browser asset pipelines. Pair with threejs-image-generator for concepts, texture references, sky/background

installations
1
GitHub Stars
0
Mis à jour
23 juin
leanentropy
Communauté

threejs-aaa-graphics-builder

Upgrade Three.js games from basic/prototype visuals to premium AAA-inspired browser graphics. Combines art-direction critique, procedural model building, mandatory external asset sourcing decisions, threejs-3d-generator assets, threejs-image-generator concept/texture workflows, scene visual polish, material/texture libraries, world prop kits, VFX, render pipeline, and visual scorecard gates. For premium games with characters, vehicles, ships, weapons, buildings, signature props, skies, textures,

installations
1
GitHub Stars
0
Mis à jour
23 juin
leanentropy
Communauté

threejs-audio-generator

Generate, convert, clean, and prepare audio assets for Three.js browser games using ElevenLabs. Use for sound effects, looping ambience, UI sounds, impact/weapon/vehicle audio, creature or boss stingers, announcer/dialogue TTS, scratch-performance voice conversion, voice cleanup/isolation, audio manifests, and game-ready web audio integration.

installations
1
GitHub Stars
0
Mis à jour
23 juin
leanentropy
Communauté

threejs-game-ui-designer

Design premium Three.js game UI. Use for HUDs, menus, overlays, pause/win/lose screens, settings, icon controls, touch UI, typography, responsive layout, safe areas, text fit, and UI/world cohesion.

installations
1
GitHub Stars
0
Mis à jour
23 juin