1.什么是SPA？
SPA是英文的缩写，全称是Single Page Application，即单页Web应用。
SPA：
1.SPA是一种介绍特殊web应用的理念 （是什么） 2.SPA可以提供最贴近于Native应用的用户体验 （干什么） 3.SPA可以用在：（在哪用）
a.跨平台的浏览器内核（webkit）的页面 （如：微信页面、Native App页面（手机QQ里面的QQ空间）） b.用web技术开发类似Native应用的App （如：Telkomsel Moovigo，馋口街，爱班级） c.机顶盒里的页面（拥有webkit内核） （如：华为Digice项目）
2.详细介绍SPA
详细说明SPA到底是个什么东西，看过几个前端研发写的博客，他们都有不同的理解： 子凡：
单页Web应用是一种特殊的Web应用。它将所有的活动局限于一个Web页面中，仅在该Web页面初始化时加载相应的HTML、JavaScript和CSS。一旦页面加载完成了，SPA不会因为用户的操作而进行页面的重新加载或跳转。 取而代之的是利用JavaScript动态的变换HTML的内容，从而实现UI与用户的交互。由于避免了页面的重新加载，SPA可以提供较为流畅的用户体验。
民工精髓：
所谓单页应用，指的是在一个页面上集成多种功能，甚至整个系统就只有一个页面，所有的业务功能都是它的子模块，通过特定的方式挂接到主界面上。它是AJAX技术的进一步升华，把AJAX的无刷新机制发挥到极致，因此能造就与桌面程序媲美的流畅用户体验。 其实单页应用我们并不陌生，很多人写过ExtJS的项目，用它实现的系统，很天然的就已经是单页的了，也有人用jQuery或者其他框架实现过类似的东西。用各种JS框架，甚至不用框架，都是可以实现单页应用的，它只是一种理念。有些框架适用于开发这种系统，如果使用它们，可以得到很多便利。
伯乐：
单页面应用是仅包含单个网页的应用，目的是为了提供类似于本地应用的流畅用户体验。
大熊君：
所谓的单页面结构就是指多个页面间切换时，不刷新当前整个页面，更新页面展示数据，并且相应地改变地址栏中的url，以使用户可以分享这个url。
再说说我的理解：
单页应用就是通过一个主入口获取应用大部分资源，使用路由机制实现页面跳转的应用。
3.SPA的实际例子
因为手机的浏览器内核是个残废，所以单页Web应用主要用在移动端。但不是说单页Web应用在PC端就不可用使用，PC的浏览器内核健壮性强得没话说，如果再加上SPA技术的话，页面交互那更是棒棒的！ 使用SPA的网站有： CODING：https://coding.net/pp Teambition：https://bbs.teambition.com 阿里云控制台：https://home.console.aliyun.com 百度云：http://yun.baidu.com QQ空间：https://mobile.qzone.qq.com YoloSong：http://music.uodoo.com Huntnews：http://huntnews.in
使用SPA的手机App、机顶盒TV App有： 爱班级、馋口街、Telkomsel Moovigo、Digice TV
4.SPA的优缺点
优点：
- 良好的交互体验 前端进行的是局部渲染，避免了不必要的跳转和重复渲染。
- 前后端职责分离，架构清晰 前端进行交互逻辑，后端负责数据处理。 前后端可以单独开发、单独测试。
- 减轻服务器压力 服务器只用出数据就可以，不用管展示逻辑和页面合成。
缺点：
- 初次加载耗时多 为实现单页Web应用功能及显示效果，需要在加载页面的时候将JavaScript、CSS统一加载，部分页面可以在需要的时候加载。
- 前进后退路由管理 由于单页Web应用在一个页面中显示所有的内容，所以不能使用浏览器的前进后退功能，所有的页面切换需要自己建立堆栈管理。
- 页面模板化和区分代码逻辑 由于单页Web应用在一个页面，当单页Web应用规模增大，页面会越来越多，我们需要将页面模板化；业务会越来越多，我们需要根据业务区分代码逻辑。
- SEO难度较大 单页Web应用因为只有一个页面主入口，所以很难被搜索引擎收录。
其实上面说到的前三个问题都已经得到了解决，唯独最后一个还未找到解决方案。 因为单页Web应用最根本的缺陷就是不利于SEO，因为界面的绝大部分都是动态生成的，所以搜索引擎很不容易索引它。
5.解决SPA的缺点
a.初次加载耗时多 可以使用模块化框架，按需加载资源。 如：使用SeaJS、RequireJS
b.前进后退路由管理 可以使用原生H5 History API。 如：window.history.replaceState和window.history.pushState
可以使用支持路由管理的集合框架。
补充：
深入说明就是如果用“location.href”实现页面来回跳转会出现资源重复获取、文件重新解析、javascript重新执行、css重新渲染等问题。 使用路由机制则不会出现该问题。
c.页面模板化和区分代码逻辑 需要引入MV*框架，它们的基本思路都是在JS层创建模块分层和通信机制。 这类框架包括Ember.js，Backbone.js，Angular.js，Avalon.js、Vue.js等。
6.完整SPA项目
张鑫旭写的**mobilebone** 自述：mobile移动端，PC桌面端页面无刷新过场JS骨架，简单、专注！
赵达写的**spa** 自述：SPA是为构建WebApp设计的路由控制和视图转换框架。
dolymood的**mobile-router** 自述：轻量级web端单页面骨架。
onlyurei的**knockout-spa** 自述：用Knockout做个的SPA。
7.SPA总结
最后总结下单页Web应用，SPA的出现最主要的目的是提升交互体验。 难道使用了SPA就一定能提升交互体验吗？ 带着这个问题，我对SPA的讲解就结束啦，谢谢！
附上参考资源： 资源一：单页面应用SPA架构 资源二：构建单页Web应用
