从React服务器组件（RSC）反思Jakarta Faces技术

• 2024.8.20
• 版权声明：本文为博主chszs的原创文章，未经博主允许不得转载。

1 引言

React 服务器组件（React Server Components，RSC）标志着 React 应用程序开发在其诞生十余年后的一次重大范式转变。RSC 概念于 2020 年底首次提出，其第一个稳定版本预计将作为 React 19 的一部分于 2024 年正式发布。

传统上，React 应用程序主要在客户端运行。这意味着浏览器需要下载包含运行整个应用所需全部代码的 JavaScript 包，然后在客户端渲染应用。尽管这种方法具有一定优势，但也导致了初始加载速度慢、需要在客户端获取和处理数据等问题，对整体性能和用户体验有一定的影响。

React 服务器组件的引入从根本上改变了这一状况。通过允许组件在服务器上运行并渲染，RSC 无需将全部代码发送到客户端即可工作。这一创新不仅改变了 React 的核心运作方式，还为开发者提供了构建更高效、更具性能的应用程序的新途径。

RSC 的出现为 React 生态系统带来了显著的优化潜力，特别是在初始加载速度、服务器端数据获取效率以及整体应用性能方面。这一技术的应用将使得 React 开发者能够更好地平衡服务器端和客户端的职责，从而创造出响应更快、体验更佳的 Web 应用。

2 服务器端渲染（Server Side Rendering，SSR）

要深入理解 React 服务器组件（RSC），我们首先需要掌握服务器端渲染（SSR）的工作原理。如果您已经熟悉 SSR，可以直接跳至下一节。SSR 是一种在服务器上而非浏览器中渲染网页的 Web 开发技术。

2.1 SSR 工作流程

1. 请求：用户向服务器发送网页请求。
2. 服务器处理：
   • 服务器接收并处理请求。
   • 执行必要的数据获取和业务逻辑。
   • 使用模板引擎或框架（如 React）构建完整的 HTML 页面。
   • 将生成的 HTML 响应发送回客户端。
3. 水合（Hydration，可选项）：
   • 浏览器接收 HTML 并呈现静态内容。
   • 通过 HTML 中的