vtj-camera-system
hexianWebConfigures third-person camera systems with collision avoidance. Use when adjusting follow behavior, implementing camera modes, or handling cave/obstacle detection.
vtj-ui-integration
hexianWebIntegrates Vue UI with Three.js while maintaining strict separation. Use when building HUDs, menus, or handling UI-to-scene communication via events.
vtj-raycasting-system
hexianWebImplements ray picking and collision detection. Use when selecting objects, detecting block interactions, or optimizing raycaster performance.
vtj-state-management
hexianWebManages state between Vue and Three.js via Pinia and mitt. Use when synchronizing UI state, emitting events, or implementing cross-layer communication.
vtj-debug-panel
hexianWebConfigures Tweakpane debug panels for 3D components. Use when adding debug controls, monitoring component state, or adjusting parameters in real-time via the
vtj-resource-management
hexianWebLoads and manages 3D assets via the Resources system. Use when adding models, textures, or fonts; declare in sources.js and access via core:ready event.
vtj-shader-development
hexianWebCreates custom GLSL shaders with vite-plugin-glsl. Use when writing vertex/fragment shaders, managing uniforms, or adding ShaderMaterial debug panels.
vtj-anti-patterns
hexianWebPrevents common mistakes and prohibited practices in vite-threejs projects. Use before writing code to avoid bugs, memory leaks, and maintenance issues.
vtj-component-model
hexianWebCreates 3D components using the Experience singleton pattern. Use when building new classes in src/js/, implementing lifecycle methods, or managing Three.js objects.
vtj-input-system
hexianWebHandles mouse, keyboard, and touch input via the IMouse and InputManager systems. Use when implementing controls, raycasting, or FPS-style PointerLock.
vtj-performance
hexianWebOptimizes Three.js rendering performance. Use when rendering large numbers of objects, optimizing frame rates, implementing streaming, or managing memory in voxel/block-based scenes.