React-three-fiber（R3F） npm i three react-three-fiber
為了能在React裡面用 Hook 編寫，React-three-fiber 是封裝threejs的語法糖庫，並沒有改變threejs的本質，threejs對象不是DOM，React的虛擬DOM對threejs沒有用，錯誤的更新和生成threejs對象可能會造成嚴重的性能問題
three-fiber
— @react-three/drei - 有用的库，这本身就是一个生态系统
— @react-three/gltfjsx - 将 GLTF 转换为 JSX 组件
— @react-three/postprocessing - 后处理效果
— @react-three/test-renderer - 用于在节点中进行单元测试
— @react-three/flex - 适用于 react-three-fiber 的 flexbox
— @react-three/xr - VR/AR 控制器和事件
— @react-three/csg - 构造实体几何
— @react-three/rapier - 使用 Rapier 进行 3D 物理学
— @react-three/cannon - 使用 Cannon 进行 3D 物理学
— @react-three/p2 - 使用 P2 进行 2D 物理学
— @react-three/a11y - 真正的 a11y 场景
— @react-three/gpu-pathtracer - 逼真的路径跟踪
— create-r3f-app next - nextjs 起始器
— lamina - 基于层的着色器材料
— zustand - 基于 flux 的状态管理
— jotai - 基于 atoms 的状态管理
— valtio - 基于代理的状态管理
— react-spring - 基于弹簧物理的动画库
— framer-motion-3d - framer motion，一个流行的动画库
— use-gesture - 鼠标/触摸手势
— leva - 在几秒钟内创建 GUI 控件
— maath - 数学助手的工具箱
— miniplex - ECS（实体管理系统）
— composer-suite - 组合着色器、粒子、效果和游戏机制
資源：