SSR 框架是什么？
SSR 框架是指支持**服务器端渲染（Server-Side Rendering，SSR）**的框架。它的核心思想是在服务器端生成完整的 HTML 页面，然后将其发送到客户端（浏览器），而不是在客户端通过 JavaScript 动态渲染内容。
SSR 的核心特点
-
服务器端生成 HTML：
-
在服务器端运行 JavaScript，生成完整的 HTML 页面。
-
客户端接收到的是可以直接渲染的 HTML，无需等待 JavaScript 加载和执行。
-
-
更好的首屏性能：
-
由于 HTML 已经在服务器端生成，浏览器可以更快地显示内容，提升用户体验。
-
-
SEO 友好：
-
搜索引擎可以直接抓取服务器端生成的 HTML 内容，有利于 SEO（搜索引擎优化）。
-
-
客户端交互：
-
在 HTML 加载后，客户端 JavaScript 会接管页面，使其具备动态交互能力（即“同构渲染”）。
-
常见的 SSR 框架
以下是一些支持 SSR 的流行框架：
-
Nuxt.js：
-
基于 Vue.js 的 SSR 框架，简化了 SSR 的实现。
-
支持静态站点生成（SSG）和服务器端渲染。
-
-
Next.js：
-
基于 React 的 SSR 框架，由 Vercel 开发。
-
支持 SSR、静态生成和混合渲染模式。
-
-
Angular Universal：
-
Angular 的 SSR 解决方案，支持服务器端渲染和预渲染。
-
-
SvelteKit：
-
基于 Svelte 的框架，支持 SSR、静态生成和客户端渲染。
-
SSR 的工作流程
-
请求到达服务器：
-
用户请求一个页面时，请求会发送到服务器。
-
-
服务器生成 HTML：
-
服务器运行 JavaScript 代码，生成完整的 HTML 页面。
-
-
发送 HTML 到客户端：
-
服务器将生成的 HTML 发送到客户端浏览器。
-
-
客户端激活：
-
浏览器加载 HTML 并显示内容。
-
JavaScript 在客户端激活，使页面具备交互能力。
-
SSR 的优缺点
优点：
-
更快的首屏加载：用户无需等待 JavaScript 加载即可看到内容。
-
SEO 友好：搜索引擎可以抓取完整的 HTML 内容。
-
低性能设备支持：减少客户端 JavaScript 的计算负担。
缺点：
-
服务器压力增加：每次请求都需要服务器生成 HTML，增加了服务器负载。
-
开发复杂度较高：需要处理服务器端和客户端的代码兼容性问题。
总结
SSR 框架通过服务器端生成 HTML，提升了首屏性能和 SEO 效果，适合内容型网站或需要快速加载的应用。常见的 SSR 框架包括 Nuxt.js、Next.js 等，开发者可以根据项目需求选择合适的工具。