[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-3597":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":11,"languages":10,"totalLinesOfCode":10,"stars":12,"forks":13,"watchers":14,"openIssues":15,"contributorsCount":16,"subscribersCount":16,"size":16,"stars1d":17,"stars7d":18,"stars30d":19,"stars90d":16,"forks30d":16,"starsTrendScore":20,"compositeScore":21,"rankGlobal":10,"rankLanguage":10,"license":22,"archived":23,"fork":23,"defaultBranch":24,"hasWiki":23,"hasPages":23,"topics":25,"createdAt":10,"pushedAt":10,"updatedAt":30,"readmeContent":31,"aiSummary":32,"trendingCount":16,"starSnapshotCount":16,"syncStatus":17,"lastSyncTime":33,"discoverSource":34},3597,"react-spring","pmndrs\u002Freact-spring","pmndrs","✌️ A spring physics based React animation library","http:\u002F\u002Fwww.react-spring.dev\u002F",null,"TypeScript",29108,1216,183,76,0,2,5,31,6,44.26,"MIT License",false,"next",[26,27,5,28,29],"animation-library","react","spring-physics","springs","2026-06-12 02:00:51","\u003Cp align=\"center\">\n  \u003Cimg src=\"https:\u002F\u002Fi.imgur.com\u002FQZownhg.png\" width=\"240\" \u002F>\n\u003C\u002Fp>\n\n\u003Cbr \u002F>\n\n\u003Ch1 align=\"center\">react-spring\u003C\u002Fh1>\n\u003Ch3 align=\"center\">A spring-physics first animation library \u003Cbr>giving you flexible tools to confidently cast your ideas\u003C\u002Fh3>\n\n\u003Cbr>\n\n\u003Cp align=\"center\">\n  \u003Ca href=\"https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Freact-spring\" target=\"_blank\">\n    \u003Cimg src=\"https:\u002F\u002Fimg.shields.io\u002Fnpm\u002Fv\u002Freact-spring.svg?style=flat&colorA=000000&colorB=000000\" \u002F>\n  \u003C\u002Fa>\n  \u003Ca href=\"https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Freact-spring\" target=\"_blank\">\n    \u003Cimg src=\"https:\u002F\u002Fimg.shields.io\u002Fnpm\u002Fdm\u002Freact-spring.svg?style=flat&colorA=000000&colorB=000000\" \u002F>\n  \u003C\u002Fa>\n  \u003Ca href=\"https:\u002F\u002Fdiscord.gg\u002FAXfNsGx64f\" target=\"_blank\">\n    \u003Cimg src=\"https:\u002F\u002Fimg.shields.io\u002Fdiscord\u002F740090768164651008?style=flat&colorA=000000&colorB=000000&label=discord&logo=discord&logoColor=ffffff\" alt=\"Chat on Discord\">\n  \u003C\u002Fa>\n\u003C\u002Fp>\n\n\u003Cbr>\n\n`react-spring` is a cross-platform spring-physics first animation library.\n\nIt's as simple as:\n\n```jsx\nconst styles = useSpring({\n  from: {\n    opacity: 0\n  },\n  to: {\n    opacity: 1\n  }\n})\n\n\u003Canimated.div style={styles} \u002F>\n```\n\nJust a small bit about us:\n\n- **Cross-Platform**: We support `react-dom`, `react-native`, `react-three-fiber`, `react-konva` & `react-zdog`.\n- **Versatile**: Be declarative with your animations or if you prefer, imperative.\n- **Spring-Physics First**: By default animation use springs for fluid interactivity, but we support durations with easings as well.\n\nThere's a lot more to be had! Give it a try and find out.\n\n## Getting Started\n\n### ⚡️ Jump Start\n\n```shell\n# Install the entire library\nnpm install react-spring\n# or just install your specific target (recommended)\nnpm install @react-spring\u002Fweb\n```\n\n```jsx\nimport { animated, useSpring } from '@react-spring\u002Fweb'\n\nconst FadeIn = ({ isVisible, children }) => {\n  const styles = useSpring({\n    opacity: isVisible ? 1 : 0,\n    y: isVisible ? 0 : 24,\n  })\n\n  return \u003Canimated.div style={styles}>{children}\u003C\u002Fanimated.div>\n}\n```\n\nIt's as simple as that to create scroll-in animations when value of `isVisible` is toggled.\n\n### 📖 Documentation and Examples\n\nMore documentation on the project can be found [here](https:\u002F\u002Fwww.react-spring.io).\n\nPages contain their own [examples](https:\u002F\u002Freact-spring.io\u002Fhooks\u002Fuse-spring#demos) which you can check out there, or [open in codesandbox](https:\u002F\u002Fcodesandbox.io\u002Fs\u002Fgithub\u002Fpmndrs\u002Freact-spring\u002Ftree\u002Fmain\u002Fdemo\u002Fsrc\u002Fsandboxes\u002Fcard) for a more in-depth view!\n\n---\n\n## 📣 What others say\n\n\u003Cp align=\"middle\">\n  \u003Cimg src=\"assets\u002Ftestimonies.jpg\" \u002F>\n\u003C\u002Fp>\n\n## Used by\n\n\u003Cp align=\"middle\">\n  \u003Ca href=\"https:\u002F\u002Fnextjs.org\u002F\">\u003Cimg width=\"285\" src=\"assets\u002Fprojects\u002Fnext.png\">\u003C\u002Fa>\n  \u003Ca href=\"https:\u002F\u002Fcodesandbox.io\u002F\">\u003Cimg width=\"285\" src=\"assets\u002Fprojects\u002Fcsb.png\">\u003C\u002Fa>\n  \u003Ca href=\"https:\u002F\u002Faragon.org\u002F\">\u003Cimg width=\"285\" src=\"assets\u002Fprojects\u002Faragon.png\">\u003C\u002Fa>\n\u003C\u002Fp>\n\nAnd [many others...](https:\u002F\u002Fgithub.com\u002Fpmndrs\u002Freact-spring\u002Fnetwork\u002Fdependents)\n\n## Backers\n\nThank you to all our backers! 🙏 If you want to join them here, then consider contributing to our [Opencollective](https:\u002F\u002Fopencollective.com\u002Freact-spring).\n\n\u003Ca href=\"https:\u002F\u002Fopencollective.com\u002Freact-spring#backers\" target=\"_blank\">\n  \u003Cimg src=\"https:\u002F\u002Fopencollective.com\u002Freact-spring\u002Fbackers.svg?width=890\"\u002F>\n\u003C\u002Fa>\n\n## Contributors\n\nThis project exists thanks to all the people who contribute.\n\n\u003Ca href=\"https:\u002F\u002Fgithub.com\u002Freact-spring\u002Freact-spring\u002Fgraphs\u002Fcontributors\">\n  \u003Cimg src=\"https:\u002F\u002Fopencollective.com\u002Freact-spring\u002Fcontributors.svg?width=890\" \u002F>\n\u003C\u002Fa>\n","react-spring 是一个基于弹簧物理特性的 React 动画库。其核心功能包括通过简洁的 API 提供流畅的动画效果，支持声明式和命令式编程风格，并且默认使用弹簧物理特性来实现自然的交互体验，同时也支持传统的时间和缓动函数动画。该库跨平台支持多种环境，如 `react-dom`、`react-native` 以及 `react-three-fiber` 等，适用于需要在网页或移动应用中添加平滑过渡效果、响应用户输入或创建复杂动画序列的各种场景。","2026-06-11 02:54:52","top_language"]