初识SPA--by 陈鹏飞

SPA(Single-page Application),直接翻译过来也就是“单网页应用”,一个更好的译名是“单页Web应用”。

 

从它的名字我们可以知道,这就是一个单独的网页。一个真正的SPA是用户通过浏览器加载了HTML页面之后,所有的后续操作响应都不会离开当前页面,不会进行任何页面跳转而是通过动态加载等方式实现只更新当前网页的内容而不变更网页。这样的优势使得一个SPA给予的用户体验更接近于一个桌面的应用程序而非一个网页。

 

SPA的主要由AJAX、Node.js、浏览器插件(例如Silverlight、Flash及Java Applets等)、薄服务器端架构、有状态厚服务器端架构、无状态厚服务器端架构等等。具体介绍可参考http://en.wikipedia.org/wiki/Single-page_application

 

  单页Web应用的优点:

1.  最大优点便是良好的用户体验,这样当内容改变时不需要重新加载整个页面,某些情况下可以大大提高页面加载速度。同样,因为数据层和UI的分离,可以大大提高代码的复用率并降低耦合性。

2.  单页面Web应用层程序最根本的优点是高效。它对服务器压力很小,消耗更少的带宽,能够与面向服务的架构更好地结合。

  单页Web应用的缺点:

1.  首先是在SEO(Search Engine Optimization),即搜索引擎最佳化上,需要花费更多的功夫。因为爬下一个SPA内的所有内容对于一个搜索引擎的爬虫来说是非常困难的,这样如果SPA成为网页的主流发展趋势,那么对于时下的所有搜索引擎来说都将会是一个灾难。

2.  另一个问题是浏览器的历史遗留的设计问题。比如浏览器都设计有“前进”/“后退”按钮,而对于一个单页Web应用来说,当用户按下”前进””后退”按钮后并不一定会转到用户想要到达的状态。用户可能希望通过按下后退按钮来回到该SPA的前一个场景,但浏览器却会后退到用户进入该SPA网页之前的网页,这与用户的初衷大相径庭。

 

目前知名的网站中例如Trello 正是使用了单页面程序元素(比如infinite scrolling/loading,in-line content无限滚动/加载,内链内容)还有大型社交网站如Twitter、Facebook等也使用了单页面程序设计元素。而在国内,如人人、QQ空间也采用了类似的单页面程序设计元素。而最直接的国内SPA应该就是现下受众面很广的网页游戏了,这里就不一一列举了。

 

如此观之,SPA终将成为未来网页发展的主流趋势。

 

参考资料:

  1. http://en.wikipedia.org/wiki/Single-page_application
  2. http://www.csdn.net/article/2012-12-10/2812658-Single-Page-Applications
  3. http://www.arthurtoday.com/2013/02/spa-singal-page-application-intro.html#.UlKR5pKmi_4
posted @ 2013-10-07 20:15  一盆小铜钱  阅读(422)  评论(0编辑  收藏  举报