放弃 React 改用 Web 组件，微软这次重构让开发者不解：没有任何意义

微软已经推出新的 Web 版 Windows 应用商店，用以替代 Web 平台上的原有 Windows 应用查找方式。换句话说，未来我们可以通过网站链接打开 Windows 10 或 11 上的 Microsoft Store 客户端。

与此同时，这次微软将 React 从之前 Microsoft Store 的 Web 版代码库中去掉了，转而使用 Shoelace、Lit、Vite 和 C# ASPNET 后端共同打造出更现代的新版本。

微软工程师 Judah Gabriel 在通过 X 发表的推文中解释称，“旧网站采用的是一套基于过时 UI 框架构建的 React 代码库。现在，我们通过精心设计的界面、更简单的新应用发现方式和更现代的 Web 技术栈，共同创造出了全新的用户体验。希望大家能够喜欢我们的这份心意。”

很多开发者对此次微软更换底层框架感到惊讶。

对于 Lit，开发者们都比较乐观。“Lit 基本上是 Polymer（Google 发布）的继承者，而 Polymer 基本上只是现在常见的一堆 Web 标准的填充程序。Lit 是一个围绕标准、现代 Web 的精简包装，它不会像框架那样真正过时。”有开发者说道。

但很多开发者担心微软是不是要放弃 React。“为什么没有用 React 的 Fluent 2 ？这种方式在开发中看起来更加活跃，而且看到内部团队使用其他框架有点出乎意料。”有开发者表示。

“Azure 看起来仍然主要是 React。当他们的云仍然是 React 时，将他们的商店页面更改为另一个框架没有任何意义。”有开发者对这一改动表示不解。

当然也有开发者表示理解，“据我所知，微软会让从事项目的工程师选择他们认为可以接受的任何框架来完成工作。React 本身并没有失去动力。这只是一个项目决定尝试另一种框架。”Schwarz 说道。

还有开发者非常肯定，微软不会放弃 React，“微软应用商店可能是微软所做的最不重要的事情，他们可以使用任何他们想要的技术，因为这并不重要。微软要放弃 React 了吗？一定不行。365 (Office) 都是 React，包括 Teams、Sharepoint、Viva Engage 等，几乎所有东西都是 React，并且正在进行大量新的开发。”

这位开发者还表示，微软很快就会转向 Glorbo。“Satya Nadella 喜欢 Glorbo，微软全力投资 Globo。微软正在大量招聘 Globo 开发人员。”

开发者“AbraxasNowhere”说道，“不可避免地，React 不会总是当前热点，但它的知识不会变得毫无价值。有太多公司的代码库暂时还不会离开它，因为在另一个框架中重建是很困难的。”

实际上，微软拥有完整的工具包来制作带有 React 的 Windows 应用程序，微软重建的 Teams 应用程序还是基于 Webview2 和 React 开发的。

Gabriel 表示，新的网页用 Web 组件构建的，使用了 Lit、Vite JS、Shoelace 等的 PWA 模版，App Tools router，在 C# ASPNET 后端上运行。其中，App Tools router 是一个基于 Lit 的路由器组件，用于管理网页应用中不同页面之间的跳转。PWA builder’s template 是一个用于创建渐进式 Web 应用（PWA）的模板，可以让网页应用像原生应用一样运行。

Gabriel 在帖子里称，“现在 Web 组件已成为 Web 的一部分，因此对这类框架的需求减少了。”

Web 组件是一个个可定制的 HTML 元素，开发者可以在任意框架中灵活使用这些组件。随着 Angular、Vue 和 React 等框架的流行，组件驱动开发已经成为前端世界中日常操作的一部分。

组件可以帮助开发者将各种样式和行为都封装进可复用的构建块当中，因此在设计、开发和测试等方面都发挥出非常重要的作用。不过，特定于框架的组件也存在一些问题，比如只能在设计所面向的框架当中使用；框架的寿命决定了组件的寿命；新的框架 / 版本往往导致重大变化，迫使开发者付出大量精力来更新组件。

Web 组件成功解决了这些问题，它们受到一切现代浏览器的支持、保持框架中立，而且属于 Web 标准的一部分。这样开发者就能安心使用，坚信开发成果在未来很多年里都能得到支持。

这次微软的 Web 组件构建，Shoelace 引起了开发者们的注意。有开发者称，“微软有一个名为 FAST 的 Web 组件库，该库是使用他们名为 fast-element 的 Web 组件创作库编写的（VS Code 大量使用了这两种库）。我可以理解放弃后者而使用 Lit 是因为 fast-element 有点笨拙，但令我惊讶的是他们使用 Shoelace 而不是 FAST 作为预构建的一组 Web 组件。”

Shoelace 是一款面向未来的 Web 组件库，提供了一系列专业设计且高度可定制的 UI 组件，这些组件均由框架中立的技术构建而成。目前在 GitHub 上拥有 9,700 颗 star。

这个项目思路非常简单：何必要耗费几百个小时（甚至更久）来从零开始构建设计系统？又为什么要制作仅适用于一种框架的组件库？

官方称，Shoelace “超越以往一切同类方案”：兼容所有框架、可与 CDN 配合使用并配合 CSS 实现全面定制，构建时充分考虑可及性和辅助功能，具有一流的 React 支持能力。开发者可以根据需求逐步引入组件而无需放弃框架，并且开发者在升级或切换框架之后，也无需重建基础组件。

“如果您的组织正需要构建一套设计系统，那么 Shoelace 将为您节约下数千美元。”Shoelace 官方称。Shoelace 基于 Web 标准构建而成，所以浏览器将在未来许多年内持续提供支持。

“现在我们没有理由不在 React 中使用 Web 组件。”开发者“deadwisdom”称，“Shoelace 是 Cory LaViska 的一个奇妙的、绝对充满激情的项目，他多年来一直将精力放在了这个项目上。他创造了一些经过深思熟虑且完美组合的东西。”“您还可以将 Shoelace 与 React 结合使用，他已经很好地解决了这个问题。”

“这不会持续 5 年，并将被更流行且有长期支持的东西所取代。这些新事物固然不错，但它不会持久。”开发者“AwesomeFrisbee”断言。

在“AwesomeFrisbee”看来，这就像是一个充满激情的项目，在没有真正深入研究未来需要如何维护的情况下就已经发布了。这些库所做的一些事情将被移植到更大的框架中，然后由于人们失去了维护它的兴趣，最后就被放弃了。

这样的担忧无不道理。前端被公认为是变化非常快的一个领域，很多人在“学不动了”和“扶我起来”之间反复横跳。虽然现在三大框架已经很完善了，但也还会冒出新的东西。现在前端领域更多在朝着精细化方向探索，注重如何将之前的东西做细、效果更好，而这又带来了更多未知。

不过，变化的另一面是，标准多、实现多，每个前端人都有机会亲身经历技术从“可用”到“标准工程化”的过程。

参考链接：

https://www.theverge.com/2023/10/6/23906082/microsoft-windows-app-store-web-version-launch

https://shoelace.style/

https://www.reddit.com/r/webdev/comments/1728lvu/microsoft_ditched_react_for_shoelace_lit_vite/

FCon 全球金融科技大会将于 11 月在上海开幕，会议聚焦当前金融行业遇到的问题，围绕金融企业在数字化转型过程中的痛点，例如数据治理，智能化、数字化风控，数字化投研，数字化营销，IT 技术能力等方向进行深入交流。

扫码或点击「阅读原文」可查看全部演讲专题。咨询购票请联系：17310043226（微信同手机号）。