CSR、SSR、SPA是什么

一、CSR客户端渲染模式（vue、react）

1.1、CSR是什么

页面由js渲染，js运行于浏览器端，所以称客户端渲染，即CSR。

1.2、基于react的csr渲染流程

浏览器下载html文档→下载js→运行react代码构建页面→展示页面

1.3、优势

• 1、前后端分离的架构，利于开发效率的提升

1.4、缺点：

• 1、首屏渲染时间比较长（首屏加载速度慢）
• 2、不能SEO （搜索引擎优化） 。大多数搜索引擎的爬虫只能识别html中的内容，无法识别js中内容。

二、SSR服务器端渲染

2.1、SSR的渲染流程

服务器生成html→浏览器从服务器下载html→页面展示

2.2、优势

• 更好的 SEO -----由于搜索引擎爬虫抓取工具可以直接查看完全渲染的页面。
• 用户将会更快速地看到完整渲染的页面

2.3、劣势

• 开发条件所限-----浏览器特定的代码，只能在某些生命周期钩子函数 (lifecycle hook) 中使用；
• 涉及构建设置和部署的更多要求----服务器渲染应用程序，需要处于 Node.js server 运行环境。
• 更多的服务器端负载----在 Node.js 中渲染完整的应用程序，显然会比仅仅提供静态文件的 server 更加大量占用 CPU 资源

三、SPA

3.1、SPA是什么

SPA，即单页面模式。Vue、React的路由就都是SPA模式。

参考链接：https://blog.csdn.net/weixin_39786582/article/details/83753225