背景
记录学习小册 <React SSR 服务端渲染原理解析与同构实践> 过程中自己的理解和收获
什么是ssr(服务端渲染)
SSR 全称 server side rendering,也就是讲渲染的工作放在服务端进行
与 SSR 相对的是SCR(client side rendering),也就是客户端渲染,是我们平时用Vue和React开发的主流模式
为什么我们需要ssr
SSR如下优点:
-
对搜索引擎有好,利于SEO
-
更快的首屏加载速度
如图所示
CSR 的步骤:浏览器请求==>返回HTML(此时HTML空白)==>请求js等资源==>请求数据==>完成整体页面的渲染
SSR 的步骤:浏览器请求==>返回HTML(服务端执行渲染,预取数据的结果,此时的HTMl是有内容)==>请求js==> 通过Hydarte(注水)完成事件绑定以及客户端特有的内容
应用场景
- 主要流量来自于搜索引擎的网站
- 解决首屏空白时间过长问题
SSR会带来什么问题
- 当网站访问量大的会给服务造成压力
- 开发复杂度的问题,开发人员要掌握前端外的技术和知识Nodejs,增加开发和维护的成本
