React
Remixing React Router已经宣布:许多Remix抽象(action, loader...)将被添加到React-Router。这是在6.4版本,目前是预发布(pre-release)版本。新的数据API的文档已经可以使用。
Should you use Framer Motion or Motion One?
Matt是许多流行动画库的作者。他以一种细微的方式解释了声明式和命令式模型之间的区别。大多数React开发者应该使用声明式的Framer Motion库。Motion One是一个轻量级、低层次的命令式库,希望成为 "JQuery的网络动画API"。
拓展阅读
- 📜 Making Videos with Code is Cool, but is it Productive?: feedback explaining that Remotion + Screenflow can be used in tandem.
- 📜 We rebuilt Cloudflare's developer documentation - here's what we learned: from Gatsby/MDX to Hugo
- 📜 Working With Three.js: The Popular 3D JavaScript Library + Working With 3D Model in Three.js: nice intro tutorial to discover Three.js in CRA with React-Three-Fiber.
- 📜 How FedEx Influenced the React Logo
- 📜 High-Performance Personalization with Next.js Middleware
- 📜 React start losing its way
- 📜 React project structure for scale: decomposition, layers and hierarchy
- 📦 Storybook 6.5: great release: interaction testing, Webpack 5 lazy compilation, Vite builder, React 18, MDX 2, Figma plugin...
- 📦 LocatorJS: browser extensions to rapidly open a React component in your IDE by clicking on the UI.
- 📦 Remix-Three: integration package for Remix and React-Three-Fiber
- 📦 TanStack Table v8 beta: React-Table has been made framework-agnostic, and renamed accordingly. Adapters available for React, Solid, Svelte, Vue...
- 📦 Microsoft FluentUI React v9 RC: Microsoft design-system Storybook, used on Office
- 📦 Gatsby 4.5: Script component + GraphQL Type Generation
- 📦 Jotai 1.7
- 🎥 Reactathon Conf 2022 playlist
- 🎥 Remix Conf 2022
- 🧑🎓 Up and Running with Remix: free course by Kent C. Dodds
- 🐦 Remix feedback: Jamie Kyle, Sarah Dayan
- 🐦 Remix VueJS Support?
- 🐦 Dan Abramov optimizing the new React doc site: interesting takeaways, in particular using Suspense to enable non-blocking hydration
- 🐦 Reco: avoid runtime CSS-in-JS lib
React-Native
React and React Native finally feel the same
Jay解释了当今网络/移动跨平台的3个主要挑战:样式、动画、导航。他建议使用Tailwind-React-Native和他新的跨平台动画库。 Legend Motion依赖于与Framer Motion(仅限网络)相同的API。该文件简要解释了与另一个类似解决方案Moti类似解决方案Moti的区别。
拓展阅读
- 📦 Tailwind-React-Native: looks nice to use Tailwind in a cross-platform way. Mobile:
className+ Babel plugin. Web: just forwarding theclassNameto a React-Native-Web element. - 📦 React-Native-Esbuild: to very easily replace Metro with esbuild and compile much faster. A few limitations to consider: no Hermes nor Fast Refresh.
- 🎙️ RNR 237 - React Native on Desktop
Other
Airbnb - Faster JavaScript Builds with Metro
Airbnb的构建和热重载时间直线上升。他们决定用Metro (React-Native捆绑器🤯)取代Webpack,并看到了明显的改善。这篇文章强调了这两个捆绑器之间的一些架构差异,以及在这次迁移中遇到的挑战。注意:Stripe也使用Metro🤔。
How Lerna just got 10x faster!
Nwrl(Nx背后的公司)刚刚接管了未维护的单版本工具Lerna的领导权。他们已经发布了一个v5.0,并开始将Nx集成到Lerna 5.1-beta中,作为一个可追溯的选项。一个简单的Lerna配置 useNx: true,你的构建就会立即变得更快。
拓展阅读
- The balance has shifted away from SPAs: the need to have a SPA decreases with the addition of new web APIs which make certain experiences now possible in MPAs
- XState Test v1 Alpha released: use state machines to generate all possible paths when testing? 🤔
- Parcel 2.6: the scoping of CSS vars looks like an interesting idea 🤔
- TypeScript 4.7: with ES Modules support
- Babel 7.18.0: with TS 4.7 support
- A new way to test types
- How we converted our Node.js library to Deno (using Deno)
- Byte sized TypeScript #1 - Filter type
- Advanced TypeScript: How we made our router typesafe
- Playlist Advanced TypeScript Matt Pocock
- Monorepos in JavaScript & TypeScript
- Type-Trident: a curated list of advanced type level madness
- Tailwind - Headless UI v1.6
- Processing Arrays non-destructively: for-of vs .reduce() vs .flatMap()
- Lesser-Known And Underused CSS Features In 2022
- Dark Mode Toggles Should be a Browser Feature
- Electron 19.0.0
- Chrome 103 Beta
- GitHub is now free for teams
- Angular's Vision for the Future
订阅原文: