{
  "slug": "react-three-fiber",
  "name": "React Three Fiber",
  "url": "https://r3f.docs.pmnd.rs/",
  "cat": "anim",
  "group": "design",
  "tagline": "React renderer for Three.js",
  "price": "Free · MIT",
  "tier": "free",
  "pick": false,
  "what": "Express a 3D scene as JSX instead of imperative Three.js calls, with React state, hooks and Suspense for asset loading. The real draw is the ecosystem: drei (helpers, controls, text), postprocessing, rapier physics, gltfjsx.",
  "why": "Realistic total for a 3D hero: 250–350 kB gz of JS plus model assets. Always lazy-load behind React.lazy so it never touches the initial chunk.",
  "warn": "<b>Version-lock trap:</b> @react-three/fiber@9 requires React >=19 <19.3. Lovable scaffolds commonly sit on React 18.3.x — you need @react-three/fiber@8 on React 18, or upgrade React first.",
  "install": "npm install three @react-three/fiber @react-three/drei",
  "category": {
    "key": "anim",
    "name": "Animation & motion",
    "desc": "Scroll storytelling, transitions, 3D. Bundle costs are measured, not guessed.",
    "group": "design",
    "groupName": "Make it look right"
  },
  "freshness": null,
  "health": {
    "ok": true,
    "status_code": 200,
    "final_url": null,
    "checked_at": "2026-08-18T21:45:05.257+00:00"
  },
  "corrected_at": null,
  "upstream_changed_at": null
}