认识
2024年04月29日
一、认识
CSR 最流行的开发模式当属SPA（单页应用) ,这种模式下服务端只会返回一个空的HTML和js 脚本资源 然后再由JS去异步加载数据，再完成页面的渲染。
二、机制
Preview
当浏览器拿到如上的 HTML 内容之后，其实并不能渲染完整的页面内容，因为此时的 body 中基本只有一个空的 div 节点，并没有填入真正的页面内容。而接下来浏览器开始下载并执行 JS 代码，经历了框架初始化、数据请求、DOM 插入等操作之后才能渲染出完整的页面。也就是说，在 CSR 中完整的页面内容本质上通过 JS 代码执行之后才能够渲染。
三、特点
-
页面之间的跳转不会刷新整个页面，而是局部刷新，体验上有了很大的提升。
-
页面的路由维护在客户端，页面间的跳转就是切换相关的组件所以切换速度很快
-
数据渲染都在客户端完成，服务器只需要提供一个返回数据的接口,大大降低了服务器的压力
-
首屏加载速度比较慢: 首屏加载需要依赖
JS的执行，下载和执行JS都可能是非常耗时的操作，尤其是在一些网络不佳的场景，或者性能敏感的低端机下。 -
对
SEO(搜索引擎优化) 不友好: 页面HTML没有具体的页面内容，导致搜索引擎爬虫无法获取关键词信息，导致网站排名受到影响。