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

单页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

移动广告量起来了!2013年绩效营销将成主流 Fedora欲以MariaDB取代MySQL 将节能进行到底:Facebook为冷存储寻求廉价闪存 谷歌Q4财报净利润28.86亿美元 超分析师预期 社交媒体的力量:Wood Camera登上iOS付费榜首之谜 屏蔽GitHub是互联网时代的“闭关锁国”吗? 巧妙利用空白设计案例分享(多图) 用友发布2013/新三年业务策略 力推UAP/CSP云平台 AWS集群计算新增内存分析EC2实例 手游:鼓足力气,掰弯传统3D游戏大作 LBA兴起:未来移动广告将基于地理位置 苹果发布2013财年Q1财报:iPhone销量及营收低于预期 不再被墙后 一个全新GitHub到来 与乔布斯并肩作战的日子 Google抛弃Exchange ActiveSync WP用户获DAV支持 Facebook真的要做“Facebook Phone”? 程序员,都去写一写前端代码吧 清除山寨和广告应用,“豌豆洗白白”服务上线 谷歌另类“开源” 程度仍不及Facebook和Twitter 想在云中分一份蛋糕? 不妨试试“山寨” 为何乔布斯脾气怪糟 却能让一群最优秀的人为他卖命? 单页Web设计案例+技巧攻略(多图) IE10里的捕捉模式和响应式设计 在“亚马逊商店”出售自己:产品经理这么找工作 【CTO俱乐部第92期】大规模存储与电商架构演化实战分享 刘黎明:PaaS是非主流业务,要与IaaS融合 个人手机游戏开发者之死 为什么苹果的应用审核是个笑话? 程序员性格怪癖是才华横溢的表现,还是危险分子的征兆? JavaScript Source Map详解 8条学习编程的可靠建议 各位水友,有力的出力,没力的看看,拜托 请从位高手帮小弟解决一个棘手的问题……………………多谢!!!!!!! ALLTEC(荔枝)兄弟,兄弟我接帖太快 :( 請這邊來. ★★★ 救命啊! VC 用ODBC访问 Access 数据库的问题 guo->你在www.linuxforum.net中叫什么?有个guoemail是你吗? 软件发布:市场摊位租赁管理系统Ver1.0 软件发布:量和单位转换软件(免费版) 软件发布:五笔快打 在listview中的各个记录listitem中,有没有双击记录的事件 软件发布:伏羲服装鞋业购销存管理系统 软件发布:进销存商务管理pcft-jxc 征集各地童谣.唤醒儿时记忆! 今天我请客! 有关vb调用excel的问题! 有没有关于BDE的单独的分发程序? VB中报表预览打印能不能实现象EXCEL中一样的“按比例缩放”?如何实现? 单机版流量统计 关于Delphi6的安装问题 动态计算公式怎么实现?? 常用的英文字体是什么? 在通信过程中怎样做到防监听、防篡改? 各位大虾现欲用java开发一套网上投票表决系统 应该看什么书?用什么开发工具?(一定给分!) 关于winsock的问题,急急 怎样使用VB6中TREEVIEW控件? 我真的要疯了! 这里有很多Delphi6的控件! 如何在ASP中传递多个参数?displaymsg.asp?page=1在后面我还想加另外一个参数 有没有喜欢画漫画的? 如何得到ActiveX控件的窗口句柄 请问mif文件格式以及、读写方法?高分求解 sco unix的root口令忘了,谢谢. 在PowerBuilder中使用Microsoft Web浏览器控件 ,这个控件在ole中怎么没有啊? 急盼有人答复!!!!!! 急!急!编译exe时出现:link errors提示 具体提示:create of executable file failed? 小笨笨一问 年年岁岁花相似,岁岁年年人不同 VC++初学者的几个大烦恼!(苦呀,谁来拯救我这个VC小兵?) 请教在DELPHI中调用API发送EMAIL的问题!!!!! 有谁知道没有封闭25端口的美国ISP的地址信息??? 水园的过去现在未来 -- 座谈一下 哭笑沉默怒骂攻击噌分拉关系白脸黑脸等等都欢迎 高分求购速达软件单据编辑的DBGrid组件或设计思想! 发表一下意见,做报表用那个控件好 谁有对话框实现的计算器的源程序? 帮小弟看一下这段程序,不好意思,只有10分了 Delphi多线程有用吗? 初学JAVA,还有一些问题烦劳各位大侠指点? 请教一个c语言库函数问题? 动不动就谈"爱国"的人请进 如何改变开机声音??? 菜鸟有一问题请教 请看一下我的程序错在哪里,好吗? 2+2等于几? 3小时25分等于多少小时,怎么来的 大肠杆菌感受态细胞的制备与转化实验:在转化实验中,涂平板前需要在37度下振荡培养30-60min大肠杆菌感受态细胞的制备与转化实验:在转化实验中,涂平板前需要在37度下振荡培养30-60min,请 2+2等于几啊 8π-20 等于多少?怎么算, 大肠杆菌DH52a感受态细胞 25下午1点,25小时后是几号的几点? 用分数表示:25分钟=( )小时,2500克=( )千克 提取DNA后为什么要跑胶 第25小时怎么样 25分钟=( )小时 最简分数 提取DNA时为什么要用新鲜血液 第25小时电影求求求, 2.15小时=?小时(用分数表示) 3小时15分=?小时 质粒DNA提取中为什么要用冰预冷溶液I和溶液Ⅲ? 第25小时的结局他爸爸要载他去哪里?是帮他越狱?还是送进监狱? 45分钟=多少小时 用分数表示 提取叶绿体是为什么要在冰浴中进行 如果一天不是24小时 是25小时,一小时是70分钟 你会怎么办? 正切1度29分是多少 农杆菌感受态细胞制备失败和质粒没有转进去的可能原因 黄金一盎司等于多少克 正切根3是45度,那么正切根2是多少度呢 大肠杆菌感受态制备为什么要冰上操作,0-4℃操作.还有,为什么要采用对数生长期的菌?不要只给一个简简单单的回答说转化率高,要具体、详细点的,最好有原理, 一盎司等于多少克黄金? 正切45是多少 感受态的制备我制备的感受态加DMSO放-80最近转化率总是下降不知是什么原因, 一盎司黄金等于多少克 15.8°化成度 分 秒 BJ5183细胞感受态的制备我之前用拿来的BJ5183菌液划板挑单菌落,然后扩大培养保存菌种.最近用该菌种用氯化钙法制备感受态细胞然后用pShuttel-CMV转染(连上了目的基因),但是Kna板子上培养了 一盎司黄金等于多少克黄金? 8/15-1/4= 大肠杆菌感受态细胞转化实验中没冰浴就热击会怎样?之后又冰浴30min,还再热击一次,这样会有什么后果?问题严重么? 黄金1斤等于多少两 0.8,里面有( )1/15 聚苯乙烯微球是什么是什么 1港两黄金等于多少克 正切函数的一个问题可是从函数图象上来看,在不一样的区间有不一样的对称中心啊.. 制得的聚苯乙烯微球如果进行真空干燥 多长时间合适? 1盎司黄金等于多少克 什么是正切函数 我要制备核壳结构的PS/TiO2纳米材料,现已制备出纳米级的PS微球,但现在用水热法无法使TiO2包覆其上我应该怎么做.最好有文献名称,望有心人给与帮助, 怎样理解为公司节约一分钱就等于为公司挣得一分钱? 一道正切函数题求函数Y=tan^2x+tanx+1(x属于R,x不等于kpai+pai/2)的值域. 聚苯乙烯-二乙烯基苯聚合物微球怎么聚合?主要应用在哪些方面? 一分钱等于多少百元 (1)正切函数在整个定义域内是增函数吗?理由?(2)正切函数会不会在某一区间内是减函数?理由? 在哪里能买到聚苯乙烯微球 如果1+2=2+1,那么我爱你就等于你爱我吗?付出就会有回报吗? 请问多少“厘”等于一分钱? 关于正切函数正切函数在其定义域内是增函数,这句话对吗? 1+2=2+1那么是不是我爱你,也等于你爱我 中国一厘钱等于多少元?多少分? 大肠杆菌感受态细胞制备试验中为什么转化后要在37℃摇床上温育45min 如果1+2=2+1 那么我爱你是不是等于你爱我 一分等于几时 如何制备大肠杆菌感受态细胞 2+2到底等于几呢 14小时35分等于几小时 大肠杆菌制备感受态细胞和重组子转化实验中,没有实验结果大肠杆菌制备感受态细胞和重组子转化实验中,将重组子放在含抗生素的培养皿中培养,也就是用蓝白班的方法,但是培养皿上什么颜
备案号:鲁ICP备13029499号-2 说三道四 www.s3d4.cn