前端目前大多都是SPA单页应用，而SPA项目普遍有一个首屏加载慢的问题，究竟为什么首屏加载会慢？还有SPA应用为什么不利于SEO？看完这篇文章，我想你肯定有自己的答案了。

渲染生成页面，同时，JavaScript 代码会完成页面交互事件的绑定。 服务端渲染：所有数据请求和 html 内容已在服务端处理完成，浏览器收到的是完整的 html 内容，可以更快的看到渲染内容，在服务端完成数据请求肯定是要比在浏览器端效率要高的多。 CSR 项目的 TTFP…

SSR：服务器端渲染-将客户端或通用应用程序渲染到服务器上的HTML。 CSR CSR：客户端渲染-通常使用DOM在浏览器中渲染应用程序。

服务端渲染在很多场景下是非常有用的，为了更加灵活的控制我们的代码，本文从0到1基于vite搭建了一个服务端渲染框架。

* 服务端渲染是什么？什么是服务端渲染？（服务端渲染的运行机制） * 为什么使用服务端渲染？服务端渲染解决了什么问题？ * 什么情况下使用服务端渲染？（服务端渲染的应用实例与使用场景）

⚛️React是目前前端社区最流行的UI库之一，它的基于组件化的开发方式极大地提升了前端开发体验，React通过拆分一个大的应用至一个个小的组件，来使得我们的代码更加的可被重用，以及获得更好的可维护性，等等还有其他很多的优点... 通过React, 我们通常会开发一个单页应用（…

最近 Next.js 14 发布了，虽然之前也有用过 Next.js，也看过一些关于 SSR 的文章，但是一直没有动手实现过。这次正好趁着这个机会，从零开始手动实现一个 React SSR 服务端渲染

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

前面我们聊了首屏优化之 script 的加载方式以及 import 动态导入，今天我们来聊一下首屏优化之 SSR-服务端渲染（Server-Side Rendering）。 可能很多朋友并不了解