今天发现 shadow DOM 和 自定义元素,这两个东西和 molecule 简直是同出而异名。
我得好好推敲一下,如果 shadow dom 确实能达到目的且新款浏览器都支持,molecule 就可以停止了。
https://developers.google.com/web/fundamentals/getting-started/primers/shadowdom
https://developers.google.com/web/fundamentals/getting-started/primers/customelements
Shadow DOM 修复了 CSS 和 DOM。它在网络平台中引入作用域样式。 无需工具或命名约定,您即可使用原生 JavaScript 捆绑 CSS 和标记、隐藏实现详情以及编写独立的组件。
自定义元素提供了一种新工具,可让我们在浏览器中定义新 HTML 标记并创建可重用的组件。 将它们与 Shadow DOM 和 <template>
等新平台原语结合使用,我们可开始实现网络组件的宏大图景:
- 创建和扩展可重复使用组件的跨浏览器(网络标准)。
- 无需库或框架即可使用。原生 JS/HTML 威武!
- 提供熟悉的编程模型。仅需使用 DOM/CSS/HTML。
- 与其他网络平台功能良好匹配(Shadow DOM、
<template>
、CSS 自定义属性等) - 与浏览器的 DevTools 紧密集成。
- 利用现有的无障碍功能。