仗键牧码

React 18 已经发布，而流式渲染是 React 18 的一个非常重要的特性。 本文来探讨在 React 18 下，有什么方式可以实现 SSR 和流式渲染。

在 React 发展过程中，服务端渲染技术也发生一些变化。现代前端框架对 React 服务端显然都有良好的支持，React 自己也演化出了 server-component 来对服务端渲染组件进行原生

这里是 React 源码分析系列的第一节。看完这篇文章，你可以理解 React 的设计理念。并对 React 源码有一些初步的了解

React 18 提供了一种新的 SSR 渲染模式： Streaming SSR。本文将介绍 Streaming SSR 的实现原理。

本文通过几个例子简单介绍流式渲染（Streaming Render）和选择性注水（Selective Hydration）所要解决的问题。

不久前 React 18 推出了第一个发布候选版本(18.0.0-rc.0)。React 18其中一个重要特性就是本文要介绍的Streaming SSR with Suspense，流式服务端渲染。

也没有执行render之后的生命周期，组件没有被完整地“渲染”出来。因此，另一部分渲染工作仍然要在客户端完成，这个过程就是 hydrate

Fiber 也称协程或者纤程，它和线程并不一样，协程本身是没有并发或者并行能力的(需要配合线程)，它只是一种控制流程的让出机制。让出 CPU 的执行权，让 CPU 能在这段时间执行其他的操作。渲染的

眨眼距离 React 18.2.0 发布已经过了一年多了。 越来越多的开发者从当初的观望心态，逐步已经将 React18 的新特性投入开发/生产中了，当然，笔者所在的团队也不例外。