说三道四技术文摘-感悟人生的经典句子
说三道四 > 文档快照

单页Web应用或引领下一代Web新趋势?

HTML文档下载 WORD文档下载 PDF文档下载
一门新的技术诞生总会引来一番争议,单页Web应用程序也不例外,其最大的优势在于用户体验,对于内容的改动不需要加载整个页面;对服务器压力很小,消耗更少的带宽,与面向服务的架构更好地结合。使用HTML+CSS+JavaScript编写应用程序,能使更多的开发者都加入到程序开发的行列。

作者Steven Willmott是3scale网站的CEO,3scale为超过100家网络提供API服务,其中包括Skype等,也拥有超过60000名开发者为其编程;此外,他还为programmableweb和Gluecon社区做贡献。本文Steven为我们解读了利用HTML+JavaScript编写应用程序将引领下一代Web新趋势。

在旧金山创业公司3scale网站上经常有人会问道:“究竟什么样类型的Web架构会成为最终的赢家?是HTML5还是App+API?”我们的答案非常简单:“将两者集合。” 来自Alexander Aghassipour和Shajith Chacko发表的这篇文章讲述了单页应用程序是如何创建而来的。文章讲述了Web应用设计趋势——利用JavaScript并访问核心API将多页的Web应用转换成单页的应用。开发单页Web应用利器新的前端架构包括Backbone.js,Ember.js,Angular.js以及Meteor;使用Gmail和Google Docs对于单页模式来说早已不是稀奇之事,Trello正是使用单页面程序元素(比如infinite scrolling/loading,in-line content无限滚动/加载,内链内容);此外,像Twitter、Facebook、Pintrest这些大型的社交网站都使用了单页面程序设计元素。

单页面应用是指用户通过浏览器加载独立的HTML页面并且无需离开此导航页面,这也是其独特的优势所在。对用户操作来说,一旦加载和执行单个页面应用程序通常会有更多的响应,这就需要返回到后端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应用的诟病。

那么,综上所述,您怎么看呢?(译文/夏梦竹)

英文出自:Pandodaily

中国第一个云主机评测发布:天翼云性价比第一、青云质量第一 Ruby 2.1.3发布,降低内存消耗、修复众多Bug! OpenHW2014开源硬件总决赛鏖战西安 AMD力推异构计算 《坦克世界:闪电战》:PC转手游,不止免费! 【讲师】道里云毛文波:网络虚拟化与SDN实现Docker连通 性能测试:SequoiaDB vs. MongoDB vs. Cassandra vs. HBase 华云数据推运营型PaaS Plus平台,联合Tmax走出“去IOE”的云化之路 聚焦移动新势力 MDCC 2014免费展位团队名单公布 详解Google Authenticator工作原理 云计算的乐高玩具,Docker从根本上改变应用程序开发 【先锋】eSage缔造异构虚拟化管理技术,做数据中心核心思想执行者 Uplinq2014:亲身体验Vuforia与智能眼镜设备 MDCC 2014 移动开发者大会议程全面揭晓! 顺丰模式:物流行业“互联网化”的科技之路 移动应用云服务工具APICloud宣布完美适配iPhone6 从应用分发到能力开放 华为开发者联盟沙龙上的共赢理念 SOOMLA框架:移动游戏分分钟创建个虚拟商店 Facebook:如何让应用适合所有系统、带宽以及屏幕 Docker实践者不能错过2014 Container技术大会的九大理由!(讲师议题全面揭晓) 2014全球云计算大会中国站(CC China)精彩集锦 腾讯X5浏览服务正式开放 30多款APP成为首批受益者 Node.js设计经验谈 LeanKanban University首位中国认证讲师路宁:看板会为更多国内企业带来深刻变革 环信IM沙龙纪实:无分享不IM,无社交不未来 【工具推荐】ESL:更简洁、更高效的标准加载器 【先锋】亲加通讯云:以云服务模式为App提供社交引擎 2014中国移动开发者大调查第一批获奖名单大曝光 移动开发云服务AVOS Cloud宣布完成A轮融资 Uplinq2014:人工智能嵌入硬件 万物互联建生态 Uplinq2014:基于Vuforia的新奇智能玩具 一应俱全!开源跨平台3D应用开发框架Minko 用VC的console application 到底能编多大的程序? 关于程序在初始化时候注册窗口类的问题? 上网很慢 请问从log文件里都能得到哪些信息? 系统设计一般把数据表放一个数据库中还是分到多个数据库中? 树型控件的问题,PB8.03版本,大家遇到过吗? 强烈支持雍亲王倒分!!(江湖无赖) 怎样调用VC写的DLL 同步 兄弟们,我的rh8中怎么没有中文输入法? 在access中如何用函数?我怎么找不到函数库啊。那里有关于access的函数库教程? 请教 我装的DELPHI7.0不知为何在区域设置为“英文”是看到的汉字都成了“????”? <iframe>如何改变大小? 关于水晶报表的问题!(急!!!!)(在线等待~~~~~~~~) 关于vb脚本中运用三角函数的问题 一个三百年前已忘得一干二净的问题 cbc+数据库的问题????????? 能不能控制<input type='fele' ...>的文件类型,如不可输入(readonly全部都不能用了) 在线等待:谁有个最简单的加密算法? 谁有More Effective中文电子书! 请教一段java计时器的问题(送分了) 在ASP中能不能引用.net的框架组件,能的话该怎么做? 占便宜歌 不想周末加班了,帮我啊兄弟们! 小弟是2003年毕业生,想找个软件工程师工作,不知道有什么要求? 一个简单的添加记录语句,求解! 请问通常所说的“横表”“纵表”指什么。 我想在菜单显示之前将其文字都更改掉在哪个函数中写?? 各位高手快来指点一下,是关于动态创建组件的! http://expert.csdn.net/Expert/topic/1180/1180423.xml?temp=.7148706 各位高手快来指点一下,是关于动态创建组件的! http://devserver/mail/abc.nsf?login&Username=abc&Password=12345678 如何得到已有exe文件中的菜单资源,并且添加新的item(UP无分) 在线等待:winxp professional中文版的sn? 进度条的颜色能不能换?老是灰的! 求网卡RealTek8029在Solaris8的驱动程序!!!!!! 如何提高记录的入库速度?内见例子 简单问题,容易回答,容易得分,在线等待。谢谢 高手请进,有关MVC(模型-视图-控制器)设计的讨论 客户端配置的问题? 各位高手教两招吧!! 帮我看这个汇编程序,有高分送 关于WIN2000/XP机器收发传真??? 请问学习VC是要以学习C++的语言为主呢,还是要以学习VC++的集成开发环境为主呢? 如何响应asp.net中datagrid的双击事件?或者迂回实现目的? VB60开发IIS出错 static性质 我编了一个c#的程序,要在别人的98上跑,怎么办才能跑? 退出当前for循环而执行后面的循环判断语句怎么写? <embed>都可以加什么属性?怎么捕捉鼠标滚轮的事件? DataSet怎样把一个Access数据库读进来? 拼音打字最快的可以每分钟打几个字? Y我的名字里有一个字是(乞丐的乞) 请问我可以把(乞丐的乞)换成另外一个字吗? 6.A:____ Diana have a new car?B:____ .She has one.A.Does,Yes,she doesB.Do,No,she doesn’tC.Do,Yes,she does满分:4 分7.I am not feeling very well.I ____ the doctor.A.need to seeB.should to seeC.would to see满分:4 分8.A:____?B:I’ve got a ba 拼音打字速度一般每分钟可以打到多少字 世界第一大长河是什么 I don't have______pet cats,but she has________ 如何论证:思想道德修养比知识文化修养更重要? 以保护课桌为题设计标语. I don't have a dictionary so I should __ one __ the library that isn't a watch改为复数形式? 怎样设计保护蓝鲸的标语 bec报名在哪报我是银川的考生 我知道银川没有考点 但是怎么报名呢?银川有报名的地方么?还是要去西安报名? That isn't my CD 改成复数形式 一般西餐正餐的配菜是什么?RT情人节,想给他做一顿正宗可口的西餐,求达人回答, 新疆bec商务英语在哪儿报名我想报名参加.我是六级的英语水平报考中级的应该没有什么太大的问题吧?兰州商学院在哪儿啊?我都没有听说过啊~ 请问2011年BEC高级报名费是多少啊 这种西餐里的配菜是什么西餐牛扒中的一种配菜,请问是是什么 bec怎么报名 2011年bec 高级报名时间如题…有几次报名时间?截止? 西餐配菜有哪些规定 请问,你的BEC 我的名是志明,想起个谐音的英文名字?含义要好Gemin的读音,告诉我英式与美式的音标,Gemin是英文名字:我的名是志明,想起个谐音的英文名字,含义要好 哪个英语单词和butterfly配 BEC报名后应该做些什么? 我叫姜冬阳,想起英文名,要和自己的名字最好有部分谐音或意义相同我一开始取wintersun,被同学嘲笑一番,那可以以此改变吗,我提高选赏了,如果没办法,我再从下列答案中选, 道路行车中干路和支路怎么区分,到底是谁让谁 《小时了了,大未必佳》中孔文举采用什么方式来辩驳陈韪的 如何在实际生活中坚持科学文化修养和思想道德修养的有机结合 西餐 配菜我经常看西餐里有种配菜是长条形的一根或者几根一起绿色的最头上有一点像芽其他地方都是很干净没叶子还是比较长的一根一根的 手机可以打出来这个字吗 六年级上册英语活动手册第16—18页答案 世界上排名第二的长河是什么河? 武则天造了哪些字 材料一:北京师范大学心理系儿童研究专家舒华教授公布:很多孩子的学习问题是由阅读问题引起的,很多智力正常的孩子存在不同程度的阅读困难,严重的已经发展成阅读障碍,阅读困难不仅 is that bus red or green?改为复数句 How+many+++(dictionary)+do+you+have? 空调电功率这两张图片分别是挂机和柜机的,3台柜机和10点挂机总共需要多少电功率,懂得麻烦告诉一下,/> 一个口字里面有一个女字怎么打 How many _____[nə:siz] do you have Only one. 怎样去算空调的电功率 一个口,里面有一个女字,就这字怎嘛打出来 武则天另一个名字武瞾有什么含义? 2011年的中级BEC何时开始报名? 车、斤、土组合一个字拼音怎么打 武则天怎么当上皇上的? 2011年BEC中级什么时候报名?在哪里报?在武汉的话在哪里报名呢? 一个口字加一个恩字念什么?怎么打呢?我聊天的时候老打不出这个字~霍霍.. 关于什么风什么雨的成语意思 Who is that policeman over there?(改为复数形式) 世界第六长河是什么河? 国家励志奖学金是几等奖学金,简历上该怎么写 双控开关 (二地控一灯)和三控开关(三地控一灯)怎么接呀?双控开关 (二地控一灯)和三控开关(三地控一灯)怎么接呀?回答的时候麻烦帮画下电路图, 六年级上册英语活动手册第四页和第五页不用了,现在只要第三页的第五题,也就是第四页上面的 在贴吧里面DB 是神马东东? BEC中级报名时间是什么时候呀? 蝴蝶的英语单词(复数) 这个东东叫神马来着, bec中级要准备多长时间,本人高中水平.还有要怎么准备呢 一个口里面有个男字怎么打 国家励志奖学金的基本情况简介,该怎么写?是写个人的基本情况,还是写家庭情况?如题
备案号:鲁ICP备13029499号-2 说三道四 www.s3d4.cn 说三道四技术文摘