单页Web应用（single page web application，SPA），就是只有一张Web页面的应用，是加载单个HTML 页面并在用户与应用程序交互时动态更新该页面的Web应用程序。

单页面应用的优缺点：
优点：
1、用户操作体验好，用户不用刷新页面，整个交互过程都是通过Ajax来操作。
2、适合前后端分离开发，服务端提供http接口，前端请求http接口获取数据，使用JS进行客户端渲染。

缺点：
1、首页加载慢
单页面应用会将js、 css打包成一个文件，在加载页面显示的时候加载打包文件，如果打包文件较大或者网速慢则用户体验不好，首屏时需要请求一次html，同时还要发送一次js请求，两次请求回来了，首屏才会展示出来。相对于多页应用

2、SEO不友好
SEO效果差，因为搜索引擎只认识html里的内容，不认识js的内容，而单页应用的内容都是靠js渲染生成出来的，搜索引擎不识别这部分内容，也就不会给一个好的排名，会导致单页应用做出来的网页在百度和谷歌上的排名差。使用单页面应用将大大减少搜索引擎对网站的收录。

vue中的单页面应用（SinglePage Web Application  ）简称：SPA。

SPA的概述：

SPA（single page application）单页面应用程序，在一个完成的应用或者站点中，只有一个完整的html页面，这个页面有一个容器，可以把需要加载的代码片段插入到该容器中。

SPA的工作原理：

　　eg:  http://127.0.0.1/index.html#/start

①根据地址栏中url解析完整的页面：index.html
　　加载index.html

②根据地址栏中url解析#后的路由地址： start
　　根据路由地址，去在当前应用的配置中 找该路由地址的配置对象去查找该路由地址 所对应的模板的页面地址
　　发起异步请求加载该页面地址

③把请求来的数据加载到指定的容器中

单页面应用（SinglePage Web Application  ）简称：SPA

多页面应用 （MultiPage Application） 简称：MPA

组成一个外壳和多个页面片段组成多个完整页面，构成资源共用(css，js),只需在外壳部分加载不共用，每个页面都需要加载

    单页面应用指一个系统只加载一次资源，然后下面的操作交互、数据交互是通过router、ajax来进，页面并没有刷新。

  单页面的应用优点：

  1.分离前后端关注点，前端负责界面显示，后端负责数据存储和计算。不会把前后端的逻辑混杂在一起；

  2.减轻服务器压力，服务器只用出数据就可以；

 3.同一套后端程序代码，不用修改就可以用于Web界面、手机、平板等多种客户端；

 4.用户体验好、快，内容的改变不需要重新加载整个页面，web应用更具响应性和更令人着迷；

 5.SPA和RESTful架构一起使用，后端不再负责模板渲染、输出页面工作，web前端和各种移动终端地位对等，后端API通用化；

 单页面的应用缺点：

1. 初次加载耗时相对增多；

2.导航不可用，如果一定要导航需要自行实现前进、后退，需要程序来实现管理；

3.使用脚本修改页面，这个脚本我们都知道，他的兼容性是个大问题；

4. 不利于SEO问题，现在可以通过Prerender等技术解决一部分；

先来说说什么是单页面应用和多页面应用：

       单页面应用（SPA），通俗一点说就是指只有一个主页面的应用，浏览器一开始要加载所有必须的 html, js, css。所有的页面内容都包含在这个所谓的主页面中。

       多页面（MPA），就是指一个应用中有多个页面，页面跳转时是整页刷新。

单页面的优点和缺点：

      优点：

         1、用户体验好，快，内容的改变不需要重新加载整个页面，对服务器压力较小。

         2、前后端分离，比如vue项目

         3、完全的前端组件化，前端开发不再以页面为单位，更多地采用组件化的思想，代码结构和组织方式更加规范化，便于修改                 和调整；

      缺点：

        1、首次加载页面的时候需要加载大量的静态资源，这个加载时间相对比较长。

        2、不利于 SEO优化，单页页面，数据在前端渲染，就意味着没有 SEO。

        3、页面导航不可用，如果一定要导航需要自行实现前进、后退。（由于是单页面不能用浏览器的前进后退功能，所以需要自                己建立堆栈管理）

多页应用是多个页面跳来跳去，单页应用是只有一个页面

多页应用：比如有a,b两个页面，访问时是 xxx/a.html ，xxx/b.html，这种模式最明显的就是切换页面时有明显的加载动作，不流畅。

单页应用比如 vue、react、angular 等框架都是单页应用的思想，也能实现页面跳转，只不过方式不同，比如有a,b两个页面，访问时是 xxx/#/a , xxx/#/b (hash方式) ，通过#后的路径参数表示页面，然后由 vue 监测并做出响应，没有真正进行跳转，这种方式使得在切换页面时流畅无卡顿(除去网络因素)。

单页应用缺点：

加载缓慢，相当于一次性把多页面集中加载了，不过通过异步加载等手段也可以达到不错的效果

不利于seo优化，整个页面都是由vue渲染而成的，不同于多页应用无需渲染(或后台渲染)

单页Web应用（single page web application，SPA），就是只有一张Web页面的应用，是加载单个HTML 页面并在用户与应用程序交互时动态更新该页面的Web应用程序。

单页面应用的优缺点：
优点：
1、用户操作体验好，用户不用刷新页面，整个交互过程都是通过Ajax来操作。
2、适合前后端分离开发，服务端提供http接口，前端请求http接口获取数据，使用JS进行客户端渲染。

缺点：
1、首页加载慢
单页面应用会将js、 css打包成一个文件，在加载页面显示的时候加载打包文件，如果打包文件较大或者网速慢则用户体验不好，首屏时需要请求一次html，同时还要发送一次js请求，两次请求回来了，首屏才会展示出来。相对于多页应用

2、SEO不友好
SEO效果差，因为搜索引擎只认识html里的内容，不认识js的内容，而单页应用的内容都是靠js渲染生成出来的，搜索引擎不识别这部分内容，也就不会给一个好的排名，会导致单页应用做出来的网页在百度和谷歌上的排名差。使用单页面应用将大大减少搜索引擎对网站的收录。

1、首页加载慢
2、SEO不友好
3、用户操作体验好，用户不用刷新页面，整个交互过程都是通过Ajax来操作。
4、适合前后端分离开发，服务端提供http接口，前端请求http接口获取数据，使用JS进行客户端渲染