Thoughtworks 技术专家 Phodal：2022 年前端趋势总结

类微前端：丰富与灵活的各类模式

与多年前相比，微前端及类微前端模式已经灵活多变：

• 微内核模式，即胖 vendor + 插件式的瘦组件。
• 标准微前端模式，基于定制的底座，以使各个应用、组件完全独立。
• 混合模式，即介于微内核与微服务化模式，诸如半嵌入的微内核模式。
• 无组件模式，诸如基于 Web Components、Islands 架构模式构建丰富的组件集。

现在，我们的挑战变成：如何选择合适的模式？

工具链：追求速度与非凡体验

众所周知，JavaScript 的工具链存在执行速度的问题，主要体现在编译方面，进而影响到开发和构建速度。

• Rust 作为 JavaScript 的基础设施语言之一，在底层的 Node.js 生态方面，诸如 NAPI-RS 提供了使用 Rust 构建预编译 Node.js 原生扩展的能力。而围绕编译与构建的 SWC、Parcel 等工具也提供了更快的开发体验。
• 其它语言，诸如采用 Golang 语言的 ESBuild、采用 Zig 语言的 Bun 开发的 JS 运行时等。

接下来，我们要考虑的是兼容性。

低代码的另外一种声音

社区已经达成共识：针对不同的场景，构建不同的低代码平台。而对于中小型公司，还面临着一个问题，开发人员响应“热闹驱动开发”开发了低代码平台，而这些低代码平台似乎并没有真正体现价值？设计不出适合业务使用的体验与流程？

值得一提的是，金融科技公司倾向于招聘会 Python 的业务人员。或许，你需要真正懂数字化的业务？

浏览器智能

在移动设备上运行 TensorFlow Lite，在边缘型的嵌入式设备中能部署 AI 应用（tinyML），那么直接运行在浏览器上的 AI 也将变得流行（TensorFlow.js、ML5.js）。而我们还要面对模型体积带来的网络影响，如何平衡体积与质量成为了一种挑战？

架构模式：SDUI 与 Islands

在 2022 年里，一些过去陌生的架构模式，也逐渐变得耳熟能详。

• Server Driven UI。在 SDUI 架构下，服务器返回的数据（JSON）会包含页面的组件信息、布局以及数据类型等等，前端则根据这些信息来渲染 UI。从模式上来说，它与我们现今构建的低代码模式极为类似，围绕生成的 JSON 生成组件等的信息。相比之下，只是产出的结果和过程数据略有差异。
• Islands 架构（孤岛架构）。孤岛架构鼓励在服务器呈现的网页中使用小的、集中的交互块。Islands 的输出是渐进式增强的 HTML，更具体地说明了增强是如何发生的。

这两种模式依赖服务器来动态生成，还存在依赖 CDN 的动态生成模式。

边缘 JavaScript

多年前，Cloudflare 公司提供了一个名为 Cloudflare Worker 的工具，可以在边缘侧执行应用程序。越来越多的主流框架支持这种方式，诸如 Next.js 的 Edge Runtime。简单来说，CDN 厂商提供了一个动态的 JavaScript 服务器，让代码运行在边缘侧，以提高应用程序的访问速度。其适合处理预处理场景，诸如授权等，也应用于 Islands 架构。