静かな森
·
为什么是 RSC (一）
💡
原文中文，约4200字，阅读约需10分钟。
📝
内容提要
React 19引入了React Server Component（RSC）的概念，将客户端组件和服务器组件分离。RSC减少了水合错误和服务器端状态管理的负担。传统的SSR中，水合错误会在服务器渲染的状态与浏览器状态不一致时发生。RSC通过允许组件仅在服务器上描述来解决此问题。RSC还通过不在客户端加载外部库来减少捆绑包大小。总体而言，RSC提高了开发体验和性能。
🎯
关键要点
- React 19 引入了 React Server Component (RSC) 的概念，分离了客户端组件和服务器组件。
- RSC 减少了水合错误的发生，避免了服务器渲染状态与浏览器状态不一致的问题。
- 传统 SSR 中，水合错误发生的原因是服务器和浏览器的状态不一致。
- 使用 RSC 可以简化状态管理，避免在组件间传递状态的复杂性。
- RSC 允许将需要的状态和组件结合，提升了组件的复用性。
- 由于 Server Component 只在服务端运行，外部库不会在客户端加载，从而减小了包体积。
- 使用 RSC 可以避免在客户端重复加载大型库，提升首屏性能。
➡️
