单页面应用

来源:互联网 发布:ffmpeg基础库编程开发 编辑:程序博客网 时间:2024/04/27 23:14

什么是单页面应用?

单页Web应用(single page web application,SPA),就是只有一张Web页面的应用,是加载单个HTML 页面并在用户与应用程序交互时动态更新该页面的Web应用程序,是指在浏览器中运行的应用,它们在使用期间不会重新加载页面。像所有的应用一样,它旨在帮助用户完成任务,比如“编写文档”或者“管理Web服务器”。可以认为单页应用是一种从Web服务器加载的富客户端。


速度:更好的用户体验,让用户在web app感受native app的速度和流畅,
MVC:经典MVC开发模式,前后端各负其责。
ajax:重前端,业务逻辑全部在本地操作,数据都需要通过AJAX同步、提交。
路由:在URL中采用#号来作为当前视图的地址,改变#号后的参数,页面并不会重载。

      (可以参考:http://blog.csdn.net/limm33/article/details/50947212?locationNum=1)


单页Web应用(single page web application,SPA)是当今网站开发技术的弄潮儿,很多传统网站都在或者已经转型为单页Web应用,新的单页Web应用网站(包括移动平台上的)也如雨后春笋般涌现在人们的面前,如Gmail、Evernote、Trello等。如果你是一名Web开发人员,却还没开发过或者甚至是没有听说过单页应用,那你已经Out很久了。


单页Web应用和前端工程师们息息相关,因为主要的变革发生在浏览器端,用到的技术其实还是HTML+CSS+JavaScript,所有的浏览器都原生支持,当然有的浏览器因为具备一些高级特性,从而使得单页Web应用的用户体验更上一层楼。关于单页应用的优点和缺点,网上讲解的文章有很多,这里就不展开论述了。 单页Web应用,顾名思义,就是只有一张Web页面的应用。浏览器一开始会加载必需的HTML、CSS和JavaScript,之后所有的操作都在这张页面上完成,这一切都由JavaScript来控制。因此,单页Web应用会包含大量的JavaScript代码,复杂度可想而知,模块化开发和设计的重要性不言而喻。


以下来自:https://pando.com/2012/12/06/html-javascript-and-the-app-ification-of-the-web/

单页Web应用程序的优点:

  1. 首先,最大的好处是用户体验,对于内容的改动不需要加载整个页面。这样做好处颇多,因为数据层和UI的分离,可以重新编写一个原生的移动设备应用程序而不用(对原有数据服务部分)大动干戈。
  2. 单页面Web应用层程序最根本的优点是高效。它对服务器压力很小,消耗更少的带宽,能够与面向服务的架构更好地结合。



单页Web应用程序的缺点:

虽然还有一些历史遗留问题(大部分是针对HTML5的改进)以及SEO。如果你看中SEO,那就不应该在页面上使用JavaScript,你应该使用网站而不是Web应用。目前该技术还存在一些争议,但这并不是重点,因为这种类型的体系架构为SAAS Web Apps提供了一个极大的可用性。

单页Web应用程序的结构很简单:首先传递HTML文档框架;然后使用JavaScript修改页面;紧接着再从服务器传递更多数据然后再修改页面,如此循环。从性能的角度看,在现代浏览器中单页面Web App已经能够和普通应用程序相媲美,而且几乎所有的操作系统都支持现代的浏览器。使用HTML+CSS+Javascript编写应用程序,能使更多的人们都加入到程序开发的行列。

这足以说明,在Web设计过程中标志着Web将呈现一种新的趋势,它将一个分离的功能层作为API并将表示层用APP的形式体现出来 (HTML5或Native):

  • 单页面+API模式比基于应用程序的HTML多重页面更加灵活,因为底层API可用于多种不同的上下文、形式因素和设备类型。一旦网页内置了API,能够满足客户不同需求(比如合作伙伴vs最终用户)。
  • 该模式意味着本地Web应用能够为用户无论是基于什么平台提供更接近一个本地移动或桌面应用程序的体验。服务平台的移动后端比如Stackmob、Parse、Appcelerator、Kinvey以及Kii借助一些标准的API后端元素可提供跨平台用户体验。
  • 协议(如openAuth (oAuth) 成为作为用户授权的黄金标准已被广泛采用,提供了一个共同的模式。从应用程序和内容中将单独登录/授权问题分离出来。也就是说用户的身份可以从内容、功能和用户体验中清晰地分离出。

一个单页面Web应用程序就是一个Web应用程序,但结构不同。其中最重要的是:在第一次请求的时候,所有的标记语言(HTML)就已经传输到客户端,其余的请求都通过REST API获取JSON数据,数据的传输通过Web Socket API或远程过程调用。单页面应用程序可以说是分拆Web技术的最后一步——通过分离(css)内容,改进架构(XML和 XSLT)上的灵活性,调用服务器(AJAX)再到解压应用程序的导航页面结构。因此,这在Web发展中是个历史性的转折点。

目前这只是单页面Web应用开发的初期,但可以看出将单页面应用、APIs以及JavaScript结合在一起将成为许多流行应用的规范。

所以,当被问到“HTML5是App+API?”,我们会说,“两者皆是——将两者结合在一起要比以往快很多。”单页面应用是一个块非常大的拼图。当然,导航、历史性和SEO等问题也成为单页面Web应用的诟病。



1 0