(封面图片来源于:基于 CC0
协议的 pixabay[1])
!!! tip hint important "温馨提示"
周刊中所有高亮的内容都可以点击到指定内容的链接~
如果您正处在微信公众号,请直接滚动至底部 👉 阅读原文 🫶
关键词: React
、deepClone
、styleX
、Css-In-Js
相关地址:https://www.builder.io/blog/structured-clone
现代化的克隆方式:
浏览器基线,现代化的浏览器基本都得到了支持,并且在 Web Worker
中可用。
const atom = {
year: '2024',
helloMsg: '新年快乐',
date: new Date(),
}
const cloneAtom = structuredClone(atom);
什么不能克隆
函数
DOM 节点
属性描述符:getter、setter
对象原型
相关地址:https://jakelazaroff.com/words/web-components-will-outlive-your-javascript-framework/
其实我是认同的,这个观点比较鲜明,跨框架生态的组件形式还是可以的,借助影子 DOM
具备天然的沙箱系统。
作者在原文中举了很多示例,还是比较有意思的。
相关地址:https://stylexjs.com/blog/introducing-stylex/
由 Meta
开发的一个新的 CSS-IN-JS
的库。
CSS
产物的体积;Tree-Shaking
相关地址:https://blog.sentry.io/fixing-memoization-breaking-re-renders-in-react/?utm_source=reactstatus&utm_medium=paid-community&utm_campaign=general-fy24q4-jtbd&utm_content=newsletter-jtbdblog-read
内容有些简陋,就是简单的介绍了 useCallback
和 memo
来优化组件。
相关地址:https://www.bekk.christmas/post/2023/1/polymorphism-in-react
内容也很简陋,有兴趣可以读一读:
Button
作为展示元素Button
作为 Parent
具备插槽能力但是我觉得文章中的 asChild
有些多余,重新写一个组件不就好了,保持组件的单一功能原则。
!!! pied-piper "交个朋友吧~"
我是不换(书生),"浪子回头金不换"的**不换**,"百无一用是书生"的**书生**,热爱工作,同时在工作之余也热爱开源。
本期周刊到这里就结束了,我们下期再见 👋 ~
[1]
pixabay: https://pixabay.com/photos/fireworks-pyrotechnics-explode-1880045/
[2]
现代化深克隆: https://www.builder.io/blog/structured-clone
[3]
structuredClone: https://developer.mozilla.org/en-US/docs/Web/API/structuredClone
[4]
WebComponent 将比任何 JS 框架都长寿: https://jakelazaroff.com/words/web-components-will-outlive-your-javascript-framework/
[5]
StyleX: https://stylexjs.com/blog/introducing-stylex/
[6]
优化 React 中的重复渲染: https://blog.sentry.io/fixing-memoization-breaking-re-renders-in-react/?utm_source=reactstatus&utm_medium=paid-community&utm_campaign=general-fy24q4-jtbd&utm_content=newsletter-jtbdblog-read
[7]
React 中多态性(2种模式): https://www.bekk.christmas/post/2023/1/polymorphism-in-react