浅谈ssr服务器渲染、客户端渲染和预渲染以及前端打包部署
1.客户端渲染：
2.服务器渲染（SSR）
区别：
客户端渲染是先拿到一个空html，再去根据代码去渲染DOM和CSSOM，涉及到了js阻塞，css阻塞等等知识点，可以去查查。
服务端渲染是将上面的渲染过程在后端先做完，直接返回一个能直接在浏览器呈现的页面。这样就省的你自己电脑的浏览器去渲染，但速度不一定快。
优点：
客户端渲染：
1.可以快速的给出一个html页面骨架，然后再去慢慢加载资源。
2.不利于爬虫，意思就是刚刚获取到html的时候，客户端渲染是空的，获取不到数据。
服务器渲染（SSR）：
1.利于SEO ，即能被搜索引擎搜索到，因为数据能一次加载处理，方便被查到。
2.首屏渲染，首页是通过node加载的HTML字符串，用户直接可以看到完整HTML，所以更快。
缺点：
客户端渲染：
1.首屏加载时间会比较慢、性能差，白屏，对于SEO无能为力、
服务器渲染（SSR）：
1.渲染过程由后端完成，会造成服务器压力较大、
2.服务端渲染中，影响声明周期钩子，例如react只会执行到componentDidMount之前的生命周期钩子，不利于前后端分离。
3.服务器有压力。
说完客户端渲染和服务端渲染，下面说一下预渲染
3.预渲染
优点：
1.同样利于seo，毕竟页面有内容。
2.同样利于首屏渲染。
缺点：
1.如果有很多路由页面，每个路由都构建一个html，会严重拖慢你的构建速度。
如何选择？
1.注重SEO的新闻网站，非强交互的页面，建议采用服务器端渲染
原因：注重seo，则必须用服务器渲染或者预渲染，但是新闻页面数量巨大，预渲染构建很不友好。
2.对于强交互的页面，不注重SEO，采用客户端渲染
原因：交互性强，可能你服务器处理完，页面很快就变了，那岂不是白费劲。所以这种更适合浏览器去处理。
3.只需改善少数页面的SEO，采用预渲染
原因：部分页面需要seo，因此不需要花费大量时间去构建预渲染页面。
前端打包文件dist结合nginx和node原理图（个人见解）
以上是这三种渲染方式的基本原理，但今天最困扰我的是，既然ssr是服务端渲染，那么项目打包后是静态资源，放到nginx服务器上岂不是静态的，是怎么能动态渲染的呢？
下面一张图，就是我想明白画的，而且要写这篇博客进行纪念！
一转眼时间到了23:30，表达如有问题欢迎评论区讨论，一起学习！
good night~
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/227155.html原文链接：https://javaforall.net
