SPA&SSR
SPA是什么?
SPA,即Single Page Application,按照字面意思就是单页面应用,通俗点就是整个网站由一个html页面构成。
三大框架Angular Vue React都是SPA
SPA的优点
- 页面响应速度快
- 可以缓存较多的数据,减轻服务器压力
- 良好的交互体验,避免不必要的跳转和渲染
SPA的缺点
- 不利于SEO(Search Engine Optimization)搜索引擎优化,由于所有内容都在一个页面中进行动态的替换,也就是利用hash片段实现路由,而利用hash片段不会作为HTTP请求中的一部分发送给服务器,所以在SEO上有着天然的弱势
- 初次加载速度很慢,因为用户首次加载需要先下载SPA框架及应用程序的代码,然后再渲染页面
解决方法:
SSR(Server-Side Rendering)服务端渲染
简单理解是将组件或页面通过服务器生成html字符串,再发送到浏览器,最后将静态标记"混合"为客户端上完全交互的应用程序
SSR常用框架
- React 的 Next
- Vue.js 的 Nuxt
既然说到SSR就,说一下它的优缺点
优点:
1.更快的响应速度
2.容易被爬虫爬到页面数据
缺点:
1.增加服务器压力
2.开发难度增大
3.可能会由于某些因素导致服务器端渲染的结果与浏览器端的结果不一致