<li id="2aw4k"></li>
  • <div id="2aw4k"><tr id="2aw4k"></tr></div>
  • <div id="2aw4k"><tr id="2aw4k"></tr></div>
    <center id="2aw4k"><small id="2aw4k"></small></center><center id="2aw4k"><small id="2aw4k"></small></center>
    首页»前端»从Web到未来

    从Web到未来

    来源:mickeywang 发布时间:2019-01-13 阅读次数:

    本文会以时间轴为主线,从介绍我们最为熟悉的一种承载互联网技术形态(浏览器)的历史开始,通过对一些重大节点的还原,以史为鉴,从历史的沿革总结具有启发性的准则,来指导我们一起去看未来技术的发展走向。

     

     web诞生

      在1989年3月,供职于欧洲粒子物理研究所Tim Berners Lee写下了他关于万维网(World Wide Web简称Web)的最初构想。提出了Web作为全球超链?#26377;?#24687;共享空间的想法,它是一个抽象?#27169;?#20551;想?#27169;?#20449;息空间,作为Internet上的一种应用架构,是之于Internet的。web的首要任务就是向人们提供信息和信息服务。在一开始,它就开放给所有人,欢迎所有人的贡献和参与,在Web上创建并分享内容,所有的人都可以分发、获取和利用信息。

      从技术层面看,Web架构的精华有三处:

    • 用超文本技术(HTML)实现信息与信息的连接;
    • 用统一资源定位技术(URI)实现全球信息的精确定位;
    • 用新的应用层协议(HTTP)实现分布式的信息共享。

      这三个特点无一不与信息的分发、获取和利用有关。

      既然web是一个抽象假想的空间,自然需要一个工具去访?#25910;?#20010;空间,于是1990年,Berners Lee编写了世界上第一个web浏览器诞生。

     1990--世界上第一个web浏览器

      万维网(WWW)是欧洲粒子物理研究所的一帮科学家为了方便?#27425;?#26723;、传论文而创造?#27169;?#23601;是用标记语言+超链接写成的由文字和?#35745;?#26500;成的HTML页面,随着网页从学术机构走向公众社会,网页承载的功能便超出?#25628;?#26415;?#27573;?#32780;变得愈加丰富,因此早期网页的局限性也逐渐?#26376;?#20986;来。

    1. 所有的网页都基于HTML页面。因为没有任何手段可以控制局部内容的显示和隐藏,因此任何局部的变化哪怕只多出一个标点符号,都只能重新下载一个新的页面。
    2. 计算任务只能在服务端实现。由于网速限制,与服务器通信的过程是非常缓慢?#27169;?#24182;且此过程是同步阻塞?#27169;?#20110;是会出现这样的场景:(表单验证)用户提交一个表单,然后整个页面消失,浏览器呈?#32844;灼粒?#32463;过漫长的等待,浏览器渲染出一个和之前一模一样的页面,只不过输入框旁边多了一排红色小字:用户名错误。
    3. 所有页面都是静态的。这意味着一个电商网站有一千种商品,哪怕页面布局一模一样,也必须写一千个单独的页面。
    P.S.
    1994年 PHP 实现了与数据库的交互以及用于生产动态页面的模板引擎,是Web领域中最主流的服务端语言。
    1995年网景推出了JavaScript,实现了客户端的计算任务(如表单验证)。
    1999年微软推出用于异步数据传输的ActiveX,衍生出了后来的Web网页迈向Web应用的关键技术Ajax,特别是在谷歌使用Ajax技术打造了Gmail(04年)和谷歌地图(05年)之后,Ajax获得了巨大的关注。它标识着Web2.0时代的到来。(Web1.0:静态网页,纯内容展示 Web 2.0:动态网页,富交互,前端数据处理)
    2006年,XMLHttpRequest被W3C正式纳入标准。

    ?#38142;耍?#26089;期的Document终于进化为了Web page,上述三个局限都得到了妥善的解决

     不平凡的1994

      1994年可以看做前端历史的起点,这一年10月13日网景推出了第一版Navigator;

      这一年,Tim Berners-Lee创建了W3C;目前,与Web相关的各种技术标准都由著名的W3C组织(World Wide Web Consortium)管理和维护。

      这一年,Tim的基友发布了CSS。还是这一年,为动态web网?#25104;?#35745;的服务端脚本PHP

      这里提到了一家重要的公司--Netscape(网景),网景的历史可以?#25104;?#20986;web前期发展的历史。

     硅谷传奇-网景

      除了 JavaScript 以外,网景还催化了JAVA,Netscape Navigtor还定义了现代浏览器的其它功能,比如说 Cookies、HTML Frames、自动代理等等。95年之前网景是浏览器的标准制定者。在当时拥有如此之多先进的特性,Netcape Navigator 曾是世界上最流行的浏览器,一时风光无限。

      但是网景寿命不长,94年成立,1998年11月,网景被美国在线(AOL)收购,03年被解散。这与其所经历的两次波折有关。一次是互联网泡沫,一次是浏览器大战。

      互联网泡沫

      2000年的互联网泡沫从网景的发行上市说起。因为正是这次IPO的超预期成功极大地刺激了市场的投资热情。1995 年 8 月,网景公司在纳斯达克市当天最高涨幅达154%,以上涨86%报收。网景公司股价的惊人表现掀起了美国20世纪90年代后半期波澜壮阔的风险投资热潮。大多数?#26102;?#20105;相流向了互联网产业。其中亚马逊(Amazon)、eBay等热门股上涨了数十倍,2000年1月起,原本被?#25918;?#30340;互联网?#21892;?#31361;然被 大量?#36164;郟?#24182;最终引发了整个纳斯达克市场的?#35272;!?/p>

      浏览器大战

      Netvigator 开拓了民用浏览器市场,当他们正在大展拳脚之际,电?#20113;教?#19978;的霸主微软,突然以 Internet Explorer (IE) 向 Netscape 狂攻,开始了“第一次浏览器大战”(95到99),因为,1995 年的 8 月推出了 IE 1.0,结果 IE 在 Windows 的捆绑优势下,将 Netscape 击得溃不成军,当时市占率90%。?#20113;?#36890;人来说,浏览器就是桌面上那个蓝色的“e”,多年来微软的 IE 浏览器几乎成了浏览器的代名词。

      Netscape 后来把 Navigator 浏览器开源,创造了Mozilla,衍生出 Firefox 浏览器。05 年到 07 年的第二轮浏览器大战,IE的份额被蚕?#22330;?#36825;?#26410;?#25112;后 Firefox 在北美,欧洲等地区的占有?#24335;?#36817;甚至超过了 20%,微软全球?#27573;?#20869;的份额也从 IE 6 高峰时的 96% 先是下降到 85%,最后 07 年末的时候稳定在 60% 左右,不再是“唯一的浏览器”了。但尽管当时 Firefox 的性能远胜不思进取的 IE,但 Windows 的捆绑优势太强横,使 Firefox 一直没机会从后赶上。

      直至 2008 年 Google 推出 Chrome 浏览器,其卓越的性能、简洁的介面以及捆绑 Google 搜索的优势,快速攻城掠地,除了侵蚀原有属于 Firefox 的市场之外,也同时痛殴老旧的微软 IE。2012年市占?#23454;?#19968;。

     移动互联网时代

      2007年第一代iPhone发布;

      2008年第一台Android发布;

      2014年第五代HTML标准发布;

      H5是由浏览器厂商(opera、?#36824;?#20027;导,与W3C合作制定的一整套Web应用规范,至今仍在?#27426;?#34917;充新的草案。我们可以清晰的感受到这一系列规范背后隐含的领导者的勃勃雄?#27169;?#21344;领所有屏幕。

      Google Chrome 的最大对手不再是其它?#25918;?#27983;览器,而是浏览器之外的对手──本地应用(Native App)。

      如此,衍生出了Web App与Native App之争,在这之前有必要介绍H5的历史,因为从其中可以窥见决定技术发展取向的基本准则。

     从H5的发展探知技术发展准则

      开放

      从H5发展的历史进程得到的启发:HTML从早些年出现的2.0以后的版本都是又W3C来制定并维护。从97年到99年,HTML的版本从3.2快速迭代到了4.01。问题是到了4.01的时候W3C的认识发生了倒退,W3C没有停止开发这门语言,只不过他?#23884;訦TML不再?#34892;?#36259;了。提出了XHMTL的概念,必须把文档标记为XML,XML与HTML都是一种文档标记语言,区别是XML的语法更加严格,(理论完美)比如属性必须小写,值要加引号。致命的是XML的错误处理模?#20572;?#22914;果解析器遇到错误,就停止解析。结果是只要有一处错误,浏览器就会死掉,用户将看不到任何网页内容。

      违反了重要的设计原理,就是著名的伯斯塔尔法则:发送时要保守,接受时要开放。接受时要开放,真是Web得以构建的基础。开发浏览器的人,必须敞开胸怀去接受所有发送给浏览器的东西,包括之前?#36824;?#26631;准、规范的东西,这正是Web的发展动力。从某种角度讲,Web走的正是一条混沌发展之路,虽然混沌,却非常?#35272;?#35825;人。作为专?#31561;?#22763;,在发送文档的时候要应该保守一些,尽量采用最佳?#23548;?#23613;量确保文档格式良好,但从浏览器的角度说,他们必须以开放的姿态去接受任何文档。所以过于?#37327;?#30340;错误处理模?#20572;?#20351;得不符合“接受开放”的法则,与伯斯塔尔法则?#23884;?#31435;的。

      用户优先

      因为理念上的不一致,导致04年以Opera为代表的厂商脱离W3C成立WHATWG,重新回到HTML的发展?#23567;?#20043;后W3C包括Lee都意识到了方向性的错误,结束了不切?#23548;?#30340;XHTML标准,?#19981;?#21040;了HTML的标准建设?#23567;?#29616;在二者同心同德,主要原因?#23884;?#20110;H5的设计思想保持统一,其中最具有启发性也是最重要的一条是:最终用户优先。这个原理本质上是一种解决冲突的机制。换句话说,当面临一个要解决的问题时,如果W3C和WHATWG给出了不同的解决方案,一旦遇到冲突,最终用户优先,然后是作者,其次是实现者,再次是标准制定者,最后才是理论上的完美。理论上的完美,理解为创建出最完美的格式。标准制定者是WHATWG、W3C,实现者是浏览器厂商,作者是开发人?#20445;?#29992;户是第一位。

      根据以上开发者在链条中的位置高于实现者,有更高的权重。它最重要,因为承认了用户的权力,无论是设计一?#25351;?#24335;,还是设计软件,这条原理保证了用户的发言权。而这条原理也正道出了事物运行的本质,用户的权力大于作者,作者的权力大于实现者,实现者的权力大于标准制定者。?#27426;?#21453;观其他规范,如XHTML2,就会发现完全相反的做法,把?#38750;?#29702;论的完美放在第一位,而把用户放在了链条的最低端,需要严格错误处理带来的各种麻?#22330;?#36825;是一种完全不同的思维方式。

      开放和用户优先,是每一个人,无论设计一?#25351;?#24335;,还是设计软件,都要遵循的基础准则。

     Web VS Native

      这一节我们来讲移动互联网下的Native App、Web App之争。

      Native App的优点:

    • Native的原生控件有更好的体验,比如消息推?#20572;?#24369;网离线使用;
    • Native有更好的手势识别;
    • Native有更合适的线程模?#20572;?#23613;管Web Worker可以解决一部分问题,但如图像解码、文本渲染仍无法多线程渲染,这影响了Web的流畅性。
    • Native能实?#25351;?#20016;富细腻的动画效果,归根结?#36164;?#29616;阶段Native具有更好的人机交互体验。

      Web App的优点:

    • 搜索引擎入口。如果一个产品是内容主导?#27169;?#21487;能很多流量是来自搜索引擎,这也可能是mobile web访问量更多的原因之一。
    • 即时更新。如果做native app的话,每次版本更新从审核、上架到用户更新是有一个时间间隔?#27169;?#24456;有可能用户懒得更新,就一直运行着一个很久很久以前的版本,接触不到新版本里的功能。如果ship的版本?#24418;?#39064;的话,大量用户可能直接就流失了,不像mobile web,有比较快的补救的可能。所以一般来说,mobile native ship的标准会更高。
    • 设计和开发成本。Native app要为不同的?#25945;?#36827;行设计和开发,有不同的规范和语言,mobile web在这方面的工作量会小很多。

      综上,Web优势是可以reach到更多用户,而native是优于用户体验,黏性更强。

      所以事实上的表现是,移动 Web 可以触达的用户是 App 的三倍之多,但用户的留存时间却明显少于在 App 上的留存时间,Native app用户每个月花的时间是mobile web用户的18倍。

      对于 Native App 来说,其最大的痛点正是web App的优点,由于其天生封闭的基因,内容无法被索引,而这条似乎又无法突破,这会导致后续一系列的问题。例如,用户想知道红烧肉的做法,还需要先知道App的名字,下载App后才能获取内容,这个流程是十分不合理的。而随着移动互联网的发展,用户下载App的热情也逐渐减弱,再加上用户80%的时间被Top3的超级App占据,所以也要考虑自己的产品有没有潜力进入Top3,还是会是在长尾里,去跟许许多多的app竞争那剩下的那几十?#31181;櫻?#23545;于站点来说,应用分发成本也因此越来越高了。

      移动端的发展进程和PC的历史如出一辙,一开始都是Native的天下。但浏览器试图取代操作系统的篡位之心从未消减。相比原生应用,Web有太多好处:无须开发?#25945;?#25110;者多套系统版本、无须安装、无须手动升级、无须审核……而最大的好处以及驱动软件形态转向的主要原因是在于?#26723;?#25104;本。

     出路 & 现状

      据此,众多的技术公司使出了各?#25351;?#26679;的奇门遁?#23383;?#26415;,归纳为?#25945;?#36335;。

      一条路是整合各native。目前的Hybrid、react native、weex等都可以看做Web App在性能方面向Native靠近的尝试。其中一个最重要的节点是,Facebook在2015.3.26 F8大会上开源了React Native。既拥有Native的用户体验、?#30452;?#30041;React的开发效率。这个理念似乎迎合了?#21040;?#26222;遍存在的痛点,尽管Native开发成本更高,但现阶段Native仍然是必须?#27169;?#22240;为Web的用户体验仍无法超越Native。但也有缺点,比如强?#35272;?#20110;Facebook,有政策风险等等。

    P.S.
    React?#23548;?#26159;思想上的一次胜出。
    现在编译器制作越来越简单,从语言到语言的翻译器成本下降,将来javascript(es5)可能会成为一门中间语言,在这之上比如说reason,typescript,es6,java,oc都可以写。
    虽然js未必会一?#31243;?#19979;,但翻译器节省了跨语言的成本。

      另一条路是?#24403;eb。比如小程序(易从Web迁移),PWA。相对于 Native App 的封闭,PWA 却是完全开放的——PWA 现有的所有技术都是遵循W3C的标准,完全开放,因此能够快速被站点接受、被浏览器快速支持。

     2015--PWA

      对于前期的失利,Web 显然是不?#24066;?#30340;。想要继续前进,就必须打造解开枷锁的钥匙——Progressive Web App( PWA ) 以及支撑 PWA 的一系列关键技术应运而生。其中,Servece Worker是至关重要的一项技术。早在 2014 年, W3C 公布就公布过 Service Worker 的相关草案,但是其在生产环境被 Chrome 支持是在 2015 年。因此,如果我?#21069;?PWA 的关键技术之一 Service Worker 的出现作为 PWA 的诞生时间,那就应该是 2015 年。

      PWA 不是特指某一项技术,而是应用了多项技术的 Web App。其核心技术包括 App Manifest、Service Worker、Web Push、Credential Management API ,等等。其核?#21738;?#26631;就是提升 Web App 的性能,?#32435;?Web App 的用户体验。

      在用户体验和用户留存两方面都提供了非常好的解决方案。PWA 可以将 Web 和 App 各自的优势融合在一起:渐进式、可响应、可离线、实现类似 App 的交互、即时更新、安全、可以被搜索引擎检索、可推送、可安装、可链接。

      其中,App Manifest 让 Web 站点能被添加到手机桌面,解决了用户到达站点链条太长的问题;Service Worker 让 Web 站点能够离线状态下正常使用,还有能让用户离线接受站点消息推送的 Web Push,这两点非常?#26723;?#20851;注。

      PWA 刚推出时,就获得了很多大型站点的支持,比如被腾讯战略投资的印度最大的电商网站 Flipcart,它是第一个大规模应用 PWA 的站点,也取得了非常好的收益,用户停留时长增长了 3 倍。

     未来是web的天下

      Native携带着天生封闭的基因,一种顽固而不可逆的特点。

      而制约Web App的因素也有很多,但我们可以看到Web App一直在?#27426;?#20462;复缺陷、突破局限。网页调取系统功能,Geolocation API、Camera API……你说网页不像APP有图标,safari早就支持在桌面上添加网页链接的快捷图标;你说网页必须联网,现在离线的方案也很多啊;你说Web App性能差,这个……你?#26723;?#23545;,也就是这个原因,Native App还能作为主流存在一段时间,可是如果Web App的性能逐渐赶上Native了呢?

    未来?#35789;共?#26159;web的天下,那也一定是属于开放的、最终用户优先的、可以?#26723;?#24320;发成本的一种技术形态。
    QQ群:WEB开发者官方群(515171538),验证消息:10000
    微信群:?#26377;?#32534;微信 849023636 邀请您加入,验证消息:10000
    提示:更多精彩内容关注微信公众号:全栈开发者中?#27169;╢sder-com)
    Web
    网友评论(共0条评论) 正在载入评论......
    理智评论文明上网,拒绝恶意谩骂 发表评论 / 共0条评论
    登录会员中心
    大乐透彩票预测
    <li id="2aw4k"></li>
  • <div id="2aw4k"><tr id="2aw4k"></tr></div>
  • <div id="2aw4k"><tr id="2aw4k"></tr></div>
    <center id="2aw4k"><small id="2aw4k"></small></center><center id="2aw4k"><small id="2aw4k"></small></center>
    <li id="2aw4k"></li>
  • <div id="2aw4k"><tr id="2aw4k"></tr></div>
  • <div id="2aw4k"><tr id="2aw4k"></tr></div>
    <center id="2aw4k"><small id="2aw4k"></small></center><center id="2aw4k"><small id="2aw4k"></small></center>
    广西福利彩票app 赌场如何换筹码 2019年3d269期历史开奖 香港赛马会透码公司 81期一肖中特 福彩中奖划分 甘肃十一选五开奖结果查 排列3技巧大全 体彩浙江6+1第18134期 加拿大彩票快乐8 广西快乐十分现金网 波色输尽光 北控vs北京直播蓝球 免费诈金花看牌器 山西快乐十分钟开29号