今日推薦開源項目：《上古版本 98.css》
今日推薦英文原文：《Is Deep Cloning Coming to Our Browsers?》
今日推薦開源項目：《上古版本 98.css》傳送門：GitHub鏈接
推薦理由：現在 UI 設計變得越來越友好，windows 98 風格的 UI 界面已經逐漸銷聲匿跡，不過有的時候為了特地表現出古老，沒準還需要把它拿出來。這個項目是一個純 CSS 庫，裡面充滿了上古版本的 UI 界面，打開官網就會發現古老的氣息撲面而來。
今日推薦英文原文：《Is Deep Cloning Coming to Our Browsers?》作者：Johannes Baum
原文鏈接：https://medium.com/better-programming/is-deep-cloning-coming-to-our-browsers-b703acde29eb
推薦理由：結構化克隆似乎能成為一種深度拷貝的解決方法
Is Deep Cloning Coming to Our Browsers?
Read about a possible exposure of the structured clone algorithm in major browsers
There are many discussions on the web about deep cloning in JavaScript. While there are native solutions like destructuring or Object.assign() for shallow clones, deep clones had to be created using third-party libraries like Lodash or abusing APIs like MessageChannel to take advantage of unexposed implementations of structured cloning as proposed by the HTML standard.According to the usage of third-party libraries like Lodash, the popularity of questions regarding deep cloning in JavaScript on Stack Overflow, and the common (and in many cases problematic) usage of JSON.parse(JSON.stringify(...), there seems to be a large demand on the developer side for a native solution.
Structured Cloning
The structured clone algorithm was proposed by the HTML standard, already has an implementation in common browsers, and is used internally (i.e., for transferring data between web workers or for storing data with IndexedDB).It recursively walks through the object to be cloned and maintains a map of visited references in order to avoid infinite cycles. Therefore circular structures are not a problem for this algorithm, compared to the JSON.parse(JSON.stringify(...)) approach, for example.
In the JavaScript realm, this means that most types (such as Date, RegExp, Array, Object, Map, and Set) are supported. However, the prototype chain is not considered and there are some more things to look after. If you』re interested, check out the link to the MDN Web Docs in the references below.
Structured clone vs. deep clone
A deep clone (also deep copy) is a copy of an object such that new copies are created for any referenced objects. What does that mean for JavaScript objects? Here it gets difficult. While some people might be satisfied with just the structural data, others might want to copy the prototype chain. So deep clone is a rather ill-defined term.The structured clone algorithm, on the other hand, is a well-defined algorithm and therefore defines pretty well what a structured clone is. One could say it is a specific implementation of a deep clone.
Structured Cloning in Browsers?
While Node.js exposed the implementation of structured cloning by the v8 JS engine as their Serialization API, many people are still waiting for an exposed implementation of a browser. If you are one of these people, there is good news: A proposal in the HTML specification already exists.Unfortunately, it seems that at the time writing, only Firefox is interested in implementing it. However, the topic is still discussed, so don』t give up hope if you are craving that feature.
Even if it is only at the stage of a proposal, it looks like the exposure will come in the form of a global function structuredClone() that will make structural clones as easy as:
const myClone = structuredClone(originalObject);
下載開源日報APP：https://openingsource.org/2579/
加入我們：https://openingsource.org/about/join/
關注我們：https://openingsource.org/about/love/
