React
Solid.js feels like what I always wanted React to be
解释了为什么Solid比React更简单。Solid 是反应式的,直接更新 DOM(没有虚拟 DOM)。渲染函数只被调用一次,即使状态发生变化,也不存在陈旧的封闭问题。这是一篇很好的文章,可以发现这两个框架之间的差异并深究Solid。
Solid真的很有趣。在短期内,它可以成为网络应用中React的一个非常好的替代品。然而,我在等待看到React 18的创新的实际应用,因为我认为虚拟DOM对于备受期待的并发功能是很有趣的。
Headless components in React and why I stopped using a UI library for our design system
Nir讲述了他的故事:从使用React-Bootstrap和MUI到从头开始实现自动完成,到最后使用封装了行为和可访问性的无头库。这是一个很好的介绍,可以了解无头库的兴趣,其中还列出了生态系统的流行库。
Johannes向我们展示了他如何逐步重构他的文件系统结构以使他的应用保持长期的可维护性。一个有趣的思路。我并不认识存在一种试用于所有场景的万金油的方案。就我个人而言,更喜欢分型树,我希望IDE能提供一种标记文件的方法。
Gatsby现在提供了一个图像CDN,可以减少构建时间并优化加载(注:Netlify提供了一个类似的服务)。其他值得注意的改进是:增量部署、完全支持TypeScript、GitHub企业版、尾部斜线...
对于FP爱好者来说。Devansh解释说,你可以将每个hook转换为一个render-prop,但不能反过来。Hooks只是语法上的糖,以避免 "回调地狱"。它与Haskell monads和do符号有关。展示各种有趣的实验,比如实现条件性渲染,或者使用生成器函数来实现hooks。
拓展阅读:
- 📜 Building Pages in Storybook: Storybook并不局限于设计系统,也可以在完整的页面上使用。你可以模拟数据,新的play()函数对于在边缘情况下设置页面似乎很有用。
- 📜 How to manage the useEffect dependency array like a pro?
- 📜 A Deep Dive Comparison Between useMemo And useCallback
- 📜 Hosting a React App with OpenFaaS
- 📜 Improving Web Performance with React Hydration Strategies
- 🧵 Sebastian Markbåge: "One day, React will switch to only ESM"
- 🐦 Classic vs Shorthand Props
- 🎥 Remotion + Fireship: nice intro to discover Remotion
- 🎥 10 React Antipatterns to Avoid: Fireship建议避免一些React的反模式。一个很好的提醒。
React-Native
Expo: EAS Update Preview Progress
Expo 分享了其在EAS更新方面的进展,EAS是目前处于预览阶段的空中传送更新系统。它可以将发布通道与Git分支联系起来,进行持续交付。他们还改进了性能、安全性,并正在开发一个网页用户界面,使其更容易使用。
React Native + Github Action = ❤️
提供一个完整的工作流程来自动构建React-Native应用程序。当一个新的GitHub版本被创建时,会触发构建。有一点工作,但它表明Fastlane可能不再是那么必要了。
拓展阅读:
- 📜 What makes Hermes engine (React Native) fast?
- 📜 How we made our React Native tests run 5x faster
- 🧑🎨 React-Native-Skia v0.1.105: animations, drop shadow...
- 🐦 Expo deprecating expo-app-auth
- 🐦 @margelo_io (Marc Rousavy) sharing interesting React-Native tips
- 📦 Stacks: a set of React-Native primitives to create your layouts. Encapsulates the practice of avoiding margins. v2.0 has just been released.
- 📦 react-native-reanimated-zoom
其它
Socket: Secure your JavaScript supply chain
检测供应链安全漏洞的新工具:你在应用中使用的npm libs受到攻击。
提供了一个不同的主动方法:不是寻找已知的漏洞,而是假设任何npm包都可能被破坏,并根据已经被破坏的包的历史来寻找指标。鉴于这种类型的攻击数量正在急剧增加,这是一个需要迅速采用的工具。相关阅读:
- Introducing Socket
- What's Really Going On Inside Your node_modules Folder?
- Why Vulnerability Scanning Isn't Enough To Protect Your App
Interop 2022: browsers working together to improve the web for developers
主要浏览器的团队将在2022年一起工作,以改善15个重点领域的兼容性,这些领域在今天对开发者来说是特别痛苦的。甚至还有一个仪表板,上面有每个浏览器的兼容性分数。我们发现了层叠图层、颜色功能、视口单位、滚动、子网格等问题。
拓展阅读:
- Vitest v0.6: a great innovation: In-source testing permits to co-locate the test in the source code file!
- Monorepos are changing how teams build software: Vercel给出了4个采用monorepo的好理由
- The
<selectmenu>HTML element: 一个即将推出的HTML组件可以逐渐取代<select>。 - Future Javascript: ShadowRealms: TC39最近进入了第三阶段。允许在隔离状态下执行代码。
- Implementing Node.js URL parser in WebAssembly with Rust: 有趣的反馈:使用在WASM中编译的Rust并没有提高这个Node.js API的性能。
- Jest
--shardoption在其CI上进行并行测试 - WebGPU --- All of the cores, none of the canvas
- SPAs were a mistake
- Steve Schoger tips on dark mode
- Progressive enhancement + dark mode switch
- How to add types for Object.fromEntries
- Introducing The XState CLI
- New to the web platform in February 2022
- Safari Technology Preview 141
- New CSS Features In 2022
- Can you get pwned with CSS?
- Parcel CSS 1.5
- "Chrome 99 rolled out this week, with Cascade Layers on by default."
- Web devs rally to challenge Apple App Store browser rules
- Thoughts On Markdown
- Flightcontrol:world-class deployment DX natively to your AWS
- Cloudflare: Steps we've taken around Cloudflare's services in Ukraine, Belarus, and Russia
- Renovated Home For WAPM WebAssembly package manager
- A new year, a new MDN
专栏同步自This Week in React(经作者授权许可),旨在分享当周热点内容、知识,主要关于React 技术栈,也会包含前端业界的其它动态
原专栏网址:www.getrevue.co/profile/thi…
github同步地址:github.com/react-shari… (求个小星星❤️)
备注:长期招募合作小伙伴