聊聊谷歌Web开发技术变迁史 巨人的成长

过去十几年来, Web开发技术从最初的纯HTML到CGI、PHP / JSP / ASP、Ajax、Rails、Node.js，已经发展到了一个非常成熟的阶段。去年的Google I/O，谷歌开发者中心推出了关于Web开发的最佳实践手册；而今年的Google I/O，「The Next Generation of Mobile Web」依然是其中的一个重要议程

过去十几年来, Web开发技术从最初的纯HTML到CGI、PHP / JSP / ASP、Ajax、Rails、Node.js，已经发展到了一个非常成熟的阶段。去年的Google I/O，谷歌开发者中心推出了关于Web开发的最佳实践手册；而今年的Google I/O，「The Next Generation of Mobile Web」依然是其中的一个重要议程。

不过，前人栽树，后人乘凉。现在大家拷贝的代码可不是自己从土里自己长出来的，而是技术大牛一行行敲出来。即便是谷歌这样的互联网巨鳄，在Web开发上也经历过无数的努力和踩过一个又一个的坑。今晚Google I/O正式开启之前，我就给大家讲讲这些事儿，聊聊从Desktop时代到今天的Mobile时代，谷歌Web开发技术的变迁、踩过的坑。

Gmail、Google Map ：世界疯了两次

大家知道,最早期的web开发指的就是HTML，CSS，JavaScript，很多刚毕业的学生就会说，“切，会写HTML，JS，CSS不算写程序,会写C++的才算”，这可大错特错了。你们想想，写一个C++程序只需要会一种语言，写个Web应用得学三种语言，而且这三种语言还以一些神秘的、很多时候还没有文档的奇怪方式联系在了一起，再加上某些西北角的公司在里面再捣捣乱，导致Web应用非常的难以维护，直接的后果就是99%的应用都是简单的网页加上一点点可怜的逻辑，完全无法取代桌面上的应用。

这个时候，英雄出现了。Google在2004年愚人节那天发布了一个叫做Gmail的东西，当时email的容量只有可怜的10MB或者20MB，Google突然说提供1GB的邮箱并且不断增长，于是，全世界疯了。可是在大容量的背后，大家发现原来Gmail不仅仅只是大，而且让你觉得你在使用一个桌面的应用，而不是一个以前传统的网页的应用。所以可以说，Gmail是Web开发的一个里程碑，第一个大规模部署的Ajax的应用程序。

紧接下来的一年，也就是2005年的情人节前后，Google Map神奇般地出现了，世界再一次疯了。所有人都觉得不可思议，原来网页的程序可以做得那么酷炫，而2000年左右科技泡沫鼎盛时期的那些网站是多么的可笑。当时Map的组里面有2个人很值得一提，一个叫Lars Rasmussen的澳大利亚人，一个叫Bret Taylor的美国人，后面我们会慢慢的提到。

重写Gmail

在开发Map和Gmail的过程中，Google的工程师逐渐意识到一个高度结构化的JavaScript库的重要性。因为逻辑越来越复杂，代码量越来越多，功能也越堆越多，之前写得那些代码已经根本满足不了不断变化的需求了。于是伟大的工程师们做了一个Googler经常做的决定：我们重写吧。

一个伟大的重写Gmail的计划逐渐张开了，也就是今天大家看到的Gmail的前身。在整个重写的过程中，一个高度独立、结构化的JavaScript的库被抽象出，这就是可能很多前端工程师们知道的Google Closure。用今天的话来说，Closure不是一个简单的JavaScript的库，他是一种方法论，一种情怀，所以任何拿jQuery和Closure相对比的言论都是一种对Closure的侮辱。Closure告诉大家，大家应该像写java一样的去写javaScript，分清楚什么是一个类，什么是类的成员变量，什么是成员方法，什么继承，什么是接口等等...所有你熟悉的面向对象的概念都可以在Closure里面找到。Closure的出现极大地改变Google内部写JavaScript的效率，导致复杂的Ajax的应用如雨后春笋一样在Google内部迅速出现。

聪明人太多的产物：奇葩技术GWT

如果让Google的工程师们自己找Google一个不好的地方，一定有一点，那就是聪明人太多，没法管理。就在Gmail如火如荼重写的时候，另外一个团队在悄无声息的做着另外一个类似的努力去改变Web开发，那就是2006年发布的GWT（Google Web Toolkit）。这是一个无比奇葩的技术，程序员写的代码是java，出来的是JavaScript，就像你吃的是草，挤出来的是奶一样。这个技术的根本目的和Closure是一样的，就是为了让程序员用写java的方式去写Web应用，只是他的方式更直接，连JavaScript都省了。其实原理也很简单，就是通过编译器在编译阶段把java转成了JavaScript代码。可是，这个技术有一个致命的缺点：你想想，要有多麻烦才能在浏览器里面调试一堆由编译器生产的JavaScript代码。于是无数的各种附加调试技术出现，告诉大家怎么去简化GWT的调试，但是都没有解决根本问题。GWT的最大的好处就是如果你的网页是由标准的控件组成的，比如输入框、选择框、多选等，那么GWT会极大的简化你的代码量.就是因为这个好处，GWT一直活到了今天，因为Google最赚钱的广告系统的前端是就是用GWT写的。可见，计算机语言的世界也是看爹的哈哈。

2007，2008貌似很平静，Google也没发布什么惊人的、大的前端产品和框架。事实上，他们并没闲着。Google在那两年期间做了几个重要的收购，奠定了后面著名的Google docs的基础。

2009年，在Google内部雪藏了很久的Closure库终于开源了，同时开源的还有一个对应的叫做Closure Compiler的东西，一般人理解Closure Compiler不就是另外jQuery Minifier嘛，其实可没那么简单，Closure的Compier是可以真的理解你的JavaScript代码的类型的。通过一个叫JsDoc的注释形式的语法，你可以完全地把 JavaScript当做是一种强类型的语言来写，并且有一个编译器来帮你查错。在强大的工具面前，jQuery被无情地碾压。在接下来几年，Google又陆陆续续的发布了对应的Closure的模板语言，和对应的Closure Stylesheet编译器，于是Web的三件套，HTML + JS + CSS在Closure的世界里都有了对应的工具，在Google内部,大部分的前端项目也都是基于这套工具来开发的。

与此同时，GWT的小组也没闲着，一方面更好的支持Google最赚钱的广告系统前端；一方面默默的憋了一个超级大招--大名鼎鼎的Google Wave。对，Google Wave是用GWT写的，Wave的founder就是我们前面提到的Map的创始人Lars。

又把最赚钱的广告系统重写了一遍

2011，2012的IO上，关于web开发的主题很多都是基于GWT、Closure展开的，一直风平浪静地到了2013年。但与此同时，Google内部已出现了一股暗黑势力，悄悄地开发了一个完全颠覆式的前端框架-- AngularJS。它，就是以HTML标签起始符形状命名的AngularJS，简称Angular。颠覆在哪呢？Google的web前端开发框架基本采用著名的MVC (Model-View-Controller)结构，有效地分离数据模型和最后显示的视图，使代码更清晰、更容易维护。早先的MVC大都是在服务器端实现的，包括先前提到的GWT神器。但是AngularJS不一样，是一个完全在客户端也就是浏览器里的MVC框架。这个框架在HTML中标注新的属性，运行时用JavaScript动态解析和绑定数据关联，简化了web应用尤其是单页应用(single-page application)的开发。不少数据双向同步逻辑甚至不用手工编写JavaScript就能实现了。更重要的是它制定了一整套前端组件的开发规范。虽然各种繁杂的条条框框让它无论在Google内部还是开源社区都备受微词，但它还是迅速获得很多企业的青睐，近几年来以异军突起之势成为众多公司招募前端程序员的一项标准需求。于是疯狂的程序员们又疯了，开始把很多陈旧的系统用Angular重写，包括前面提到了那个最赚钱的广告系统前端。甚至Angular一出来的时候就有人预测，Angular就是早期的HTML6。

异类语言的诞生

说到这里，不能不提一个异类语言了，叫做Dart。这个Dart可是出自名门，是由V8的首席程序员Lars Bak在他工作之余发明的，他一边改善V8的性能，一边琢磨如何能突破JavaScript语言本身诸如弱类型等限制，让web程序执行速度更上一层楼。他最后决定，干脆摆脱JavaScript的束缚，重起炉灶设计一门全新的、为新时代Web App专门打造的语言-- Dart。

在了解Dart前，简单科普一下同父同母的兄弟V8。Google的Chrome浏览器当年发布时以其远超Internet Explorer和Firefox的网页渲染速度震撼了世界。其中一个核心优势就在于全新的V8 JavaScript引擎。当竞争对手还在吭哧吭哧解释执行(interpret)网页中的脚本时，强大的V8引擎采用即时编译(JIT)技术把JavaScript的运行速度提升到了一个全新的层次。在之后的几年里，各家浏览器厂商纷纷效仿，推进了整个Web平台的发展。目前深受追捧的Node.js / io.js其实也都是V8开源后的衍生产品，造就了一个前后端用同一种编程语言的新兴开发生态。

Dart语言借鉴了广大程序员熟悉的Java语法，支持面向对象、单继承、interface、泛型、非强制的类型标记等语言特性。Dart的虚拟机在V8大牛的打造下性能当然也是超强的。Dart程序还能被编译成JavaScript，运行在没有Dart VM的环境中。

然而，Dart从发布日起一直倍受争议和质疑。它被认为是一项分裂web之举，而且长期以来没有得到任何其他浏览器厂商的支持。2015年初，Google宣布取消将Dart VM绑定在Chrome浏览器里的计划。不过这并不是Dart的死刑判决。Google仍然支持并使用Dart开发大型web应用，因为比起JavaScript，Dart更能提高开发效率和保证代码质量。

综上，大家可以看到，web在开发上两个趋势，第一个是从脚本语言层面去改善代码的质量，提高效率，第二是从web标准入手，提供更多抽象的模块化的组件，让编写web应用更加容易。

而说到第二点，不得不提提Google的一个项目叫做Polymer，如果你们去Polymer的网站，你会发现Polymer的口号是「leverage the future of web platform now」。的确，Polymer是一个库用来实现Web component的，而web component是W3C关于下一代 HTML的一个标准，这可是根正苗红的一个项目。可以说Polymer项目的进展某种程度上就代表了下一代HTML标准制定的进展。让我们一起期待在本次IO上Google会对Polymer做出怎样的更新吧。