细分服务器渲染和客户端渲染的区别所在

服务器端渲染和客户端渲染的区别一、什么是服务器端渲染和客户端渲染互联网早期，用户使用浏览器浏览的都是一些没有复杂逻辑的、简单的页面，这些页面都是在后端将html拼接好的然后将之返回给前端完整的html文件，浏览器拿到这个html文件之后就可以直接解析展示了，而这也就是所谓的服务器端渲染了。而随着前端页面的复杂性提高，前端就不仅仅是普通的页面展示了，而可能添加了更多功能性的组件，复杂性更大，另外，彼时ajax的兴起，使得业界就开始推崇前后端分离的开发模式，即后端不提供完整的html页面，而是提供一些api使得前端可以获取到json数据，然后前端拿到json数据之后再在前端进行html页面的拼接，然后展示在浏览器上，这就是所谓的客户端渲染了，这样前端就可以专注UI的开发，后端专注于逻辑的开发。二、服务器端渲染和客户端渲染的本质区别最重要的区别就在于究竟是谁来完成html文件的完整拼接，如果是在服务器端完成的，返回客户端就是服务器端渲染；反之，如果前段做了更多的工作完成html拼接，就是客户端渲染。三、服务器端渲染和客户端渲染的优点：服务器端渲染优点：①前端耗时少。因为后端拼接完了html，浏览器只需要直接渲染出来。②有利于SEO。因为在后端有完整的html页面，所以爬虫更容易爬取获得信息，更有利于seo。③无需占用客户端资源。即解析模板的工作完全交由后端来做，客户端只要解析标准的html页面即可，这样对于客户端的资源占用更少，尤其是移动端，也可以更省电。④后端生成静态化文件。即生成缓存片段，这样就可以减少数据库查询浪费的时间了，且对于数据变化不大的页面非常高效。客户端渲染优点：①前后端分离。前端专注于前端UI，后端专注于api开发，且前端有更多的选择性，而不需要遵循后端特定的模板。②体验更好。比如，我们将网站做成SPA或者部分内容做成SPA，这样，尤其是移动端，可以使体验更接近于原生app。四、服务器端渲染和客户端渲染的缺点服务器端渲染缺点：①不利于前后端分离，开发效率低。使用服务器端渲染，则无法进行分工合作，则对于前端复杂度高的项目，不利于项目高效开发。②占用服务器端资源。即服务器端完成html模板的解析，如果请求较多，会对服务器造成一定的访问压力。而如果使用前端渲染，就是把这些解析的压力分摊了前端，而这里确实完全交给了一个服务器。客户端渲染缺点：①前端响应较慢。如果是客户端渲染，前端还要进行拼接字符串的过程，需要耗费额外的时间，不如服务器端渲染速度快。②不利于SEO。目前比如百度、谷歌的爬虫对于SPA都是不认的，只是记录了一个页面，所以SEO很差。因为服务器端可能没有保存完整的html，而是前端通过js进行dom的拼接，那么爬虫无法爬取信息。除非搜索引擎的seo可以增加对于JavaScript的爬取能力，这才能保证seo。