SPA单页面应用优缺点整理

单页面应用 SPA (single page application)
一个应用只有一个html页面，它就是 SPA.
页面的切换其实是组件的切换，并修改了url地址。

优点：

1. 具有桌面应用的即时性、网站的可移植性和可访问性
2. 用户体验好、快、内容的改变不需要重新加载整个页面，web应用更具响应性。
3. SPA（ single page application）相对对服务器压力小
4. 良好的前后端分离。SPA和Restful架构一起使用，后端不再负责模板渲染、输出页面工作，web前端和各种移动终端地位对等，后端API通用化
5. 对前端人员javascript技能要求更高，促使团队技能提升

缺点：

1. 分功能模块的鉴权不好实现

2. 导航不可用，如果要导航要自行实现前进、后退

3. 书签需要程序来提供支持

4. 大型项目中可能会涉及大量的DOM操作、复杂的动画效果，也就不适合使用Vue、react框架进行开发。

5. 初次加载耗时相对增多
   ​ 解决方案：

• Vue-router懒加载：Vue-router懒加载就是按需加载组件，只有当路由被访问时才会加载对应的组件，而不是在加载首页的时候就加载，项目越大，对首屏加载的速度提升得越明显。

• 使用CDN加速：在做项目时，我们会用到很多库，采用cdn加载可以加快加载速度。

• 服务端渲染：服务端渲染还能对seo优化起到作用，有利于搜索引擎抓取更多有用的信息（如果页面纯前端渲染，搜索引擎抓取到的就只是空页面）

6.不利于SEO；
解决方案：

• 服务端渲染：服务器合成完整的 html 文件再输出到浏览器

• 页面预渲染

• 路由采用h5 history模式