react

（Facebook 已有近十年历史），主要功能是其虚拟DOM。这意味着所有 DOM 元素都在内存中创建，而 React 负责将它们传递给（真实的）DOM。这也意味着您不能自己进行任何DOM 更新，也不能使用 W3C 标准事件系统。
在一切（真正的）DOM由作出react处理。
很棒，就像 Facebook 一样，您必须防止成千上万的开发人员在同一个 DOM 中乱搞。（没有慢 DOM，只有开发人员编写访问 DOM 的慢代码）

W3C 网页组件

（作者：苹果、Mozilla、谷歌、微软）

由 3 种不同的技术组成：

• 自定义元素 API
• 模板： <template>
• 影子DOM

每个都可以在没有另一个的情况下使用！

您可以在常规上附加 shadowDOM<div>以在类固醇上创建 DIV，而无需使用自定义元素或模板。

W3C Web Components 标准实际上是由浏览器构建者 Apple、Google、Mozilla 和 Microsoft 开发的。

他们所有人都必须同意，这导致制定标准的进展缓慢；但是一旦成为标准，只要 JavaScript 将在浏览器中运行，W3C 标准就会得到支持。

Microsoft 选择交换浏览器引擎并使 Edge（2020 年 1 月）在 Chromium 上运行，现在所有现代浏览器
都支持 Web 组件。

Chrome、Safari 和 FireFox自 2018 年起支持 Web 组件（版本 V1）。
并且一些浏览器（部分）更长时间地支持现已弃用的 V0 版本。
所以在 Web Components 方面有很多经验。

在自定义元素API是一个API，仅此而已，无所不及，（但强大的一个）
相对于一个框架，就像比较集和地图终极版或Vuex。

模板很棒，但许多开发人员复制/粘贴博客示例<template>使用 javascript 代码创建一个，而不是在 HTML 中定义它们

shadowDOM（以及 SLOT 和 :parts）值得拥有一长篇，
许多开发人员不了解它是什么或如何使用它，但大多数人对它有坚定的看法。

点亮

（由谷歌提供）。是一个建立在W3C Web Components 技术之上的库

在版本 2之前称为Lit-Element & Lit-HTML。
在Lit之前，Google 也有Polymer

！！！你不需要 Lit 来开发 Web 组件！！！

Lit 是一个工具，它将加快开发过程。
当您首先学习 Lit 时，您学习的是一种工具，而不是 Web 组件技术

Lit 是语法糖（有点像 jQuery）

（就像在早期的 jQuery 时代一样）有 50 多种 Lit 替代品：

https://webcomponents.dev/blog/all-the-ways-to-make-a-web-component/

React 的未来？

有趣的部分是 React，由于其虚拟DOM 实现，仅支持71%的 W3C 自定义元素 API （参见https://custom-elements-everywhere.com/）。
您需要为每个要使用的 W3C 组件创建一个 React 包装器。（参见：https : //reactjs.org/docs/web-components.html）

该React17更新（2020年10月）甚至没有提到的话Web组件，自定义元素，shadowDOM或模板

[2021 年更新] 我不再阅读 React 更新了。但 Benny Powers 做到了：https : //dev.to/bennypowers/what-s-not-new-in-react-18-45c7

什么工作组

非常有趣的事实是 Facebook 没有浏览器，也不是 WHATWG 的核心成员。而且自2019，在WHATWG（阅读：谷歌，苹果，微软，Mozilla的）是什么在浏览器中运行控制：https://techxplore.com/news/2019-06-w3c-whatwg-agreement-version-html .html

构架

所有其他框架（Angular、Vue、Svelte 等）都100% 支持 W3C 标准并且可以创建Web 组件

这创造了一个有趣的未来。

• Facebook 不开发浏览器，几乎与浏览器运行的内容无关。

• WHATWG 只接受邀请；谷歌、苹果、微软和 Mozilla 会邀请Facebook 吗？

• 有人说 React 是新的 Flash（生命周期结束：2020 年 12 月 31 日）

• 有人说Facebook将合并的WhatsApp，Instagram的和Facebook，
  那么将提供一个新的浏览器每个人都在世界上必须安装

关于框架和库

免责声明：我制造了自己的摩托车

框架和库就像您在超市购买的罐装和包装成分。

当然，你在桌子上吃饭。
但是去买杂货，品尝香料，学习如何切割、烘焙和烧烤，
你将成为一名厨师。

库/框架的一个问题是：当引入新功能时，新版本中总会有重大变化。或者当不再需要功能时，因为它们现在是本机的一部分，因此更快的标准（但语法不同）想想 jQuery 选择器和（后来实现的）.querySelector

它从来都不是一键式升级。而且因为您很可能没有为所有这些新功能编写 TDD 测试，所以您必须再次检查和测试您的所有代码

或者更糟，就像 Angular 1 到 Angular 2 的“升级”；你必须重写一切......

你想成为什么样的专业前端开发人员是你的选择