SPA单页面应用

概念

SPA（Single-page application）仅在 Web页面初始化时加载相应的 HTML、JavaScript 和 CSS。一旦页面加载完成，SPA不会因为用户的操作而进行页面的重新加载或跳转，取而代之的是利用路由机制实现 HTML 内容的变换，UI 与用户的交互，避免页面的重新加载。

优点：

• 用户体验好、快、内容的改变不需要重新加载整个界面，避免了不必要的跳转和重复渲染
• 基于上面一点，SPA相对服务器压力更小
• 前后端职责分离，架构清晰，前端进行交互逻辑，后端负责数据处理

补充：为什么单页面应用最好前后端分离？

前端项目要自己管理路由，如果是单页面的话，路由切换不需要经过后端，前端可以很方便的管理，包括状态。

如果多页面的话，前端路由在切换的时候，就需要提交到后端，跳页。

这样路由管理就麻烦了，状态管理也麻烦。

另外就是多页面带来的性能开销和浪费。

共用部分被反复加载渲染，css，js等也要反复加载，虽然可以利用缓存，但是也需要判断有没有缓存，以及缓存是否过期，没有单页省事。

最后，最重要的是，和后端的交互方式是ajax，只传递数据，而不是整个页面。

缺点：

• 初次加载好耗时多：为实现单页面 Web应用功能及其显示效果，需要在加载页面的时候将 JavaScript、CSS统一加载，部分页面按需加载
• 前进后退路由管理：由于单页面应用在一个页面中显示所有内容，所以不能使用浏览器的前进后退功能，所有的页面切换需要自己建立堆栈管理
• SEO难度大：由于所有内容都在一个页面中动态替换显示，在SEO上具有天然弱势

补充：SEO

SEO（Search Engine Optimization）：汉译为搜索引擎优化。是一种方式：利用搜索引擎的规则提高网站在有关搜索引擎内的自然排名。目的是让其在行业内占据领先地位，获得品牌收益。很大程度上是网站经营者的一种商业行为，将自己或自己公司的排名前移。

一个网站虽然推广不易，但是得到的流量却是很大的，毕竟页面那么多，总有几个被浏览的，自然就是流量。而单页网站则不同，只有一个页面，要么有人看，要么没人看，终的结果就是流量不高。再加上单页无法承受太多的关键词，所以在搜索上也是很吃亏的。