Three.js Raycasting and Interaction

When to Use

Use this skill when:

• Implementing mouse/touch object picking
• Detecting clicks on 3D objects
• Creating interactive UI in 3D space
• Performing collision/intersection tests
• Implementing drag-and-drop mechanics

Core Principles

1. Raycaster Reuse: Create once, reuse for all casts
2. Layer Filtering: Use layers to limit raycast targets
3. Recursive vs Non-recursive: Choose based on scene depth
4. Touch Normalization: Convert touch to NDC coordinates
5. Performance: Limit raycast frequency and targets