大航路超越时代的妄想

原文地址： https://plus.google.com/115060278409766341143/posts/ViaVbBMpSVG

1.使用Closure

我们使用Closure库、模版以及编译器来渲染Google+里每一个页面的每一个节点——甚至包括掌控页面的Javascript脚本。以下几点有助于加速网页的显示：

-Closure模版可以在服务器端用Java渲染，也可以在浏览器里用JS生成。这样的话，我们需要的内容总是能立即获取到；同时，我们也可以在”后台”( 指浏览器中的异步加载 )中载入javaScript（就像“装饰”一个网页，在主干之上，不断给各节点增加事件的响应）

-同时，Closure套件为JS提供了许多新特性：强类型、更强的错误检测、“死代码”预估、跨模块的通信以及很多的优化手段。

(欲了解更多的Closure套件细节，访问 http://code.google.com/closure/ )

2.总是在最适当的时候，书写最恰当的JS代码

我们将JS代码分割程序多小的模块，并能被异步加载，从而更方便的管理Google+中的JS脚本。而用户只需要按需下载最少的JS脚本。我们依照两个规则来进行设计：

-客户端必须包含一个核心的代码，它通过历史标记(也就是记录浏览器地址栏中的地址)来判断加载需要的模块。

-如果需要的JS模块没有加载完全，我们会阻塞页面所有的操作，直到加载完毕。

3.无刷新实现页面间的跳转

一旦JS脚本载入完毕，我们将脱离服务器，在本地渲染所有的内容，因此可以达到很快的速度。我们设置了一个全局的事件监听器——它监听页面上所有的锚点的单击事件。我们尽可能将单击事件转换为页面内的跳转。然而，对于不能在客户端渲染，或是用户单击鼠标中键或者按住CTRL键的情况下，将打开一个新的页面。

在这种情况下，浏览器中的地址可以代表当前页面的状态，所以我们可以复制/分享这个地址以分享当前页面。

4.刷新输出数据块

为了让数据下载完就立刻呈现出来，我们使用刷新输出数据块的技术(flushing chunks)，这样用户就不需要等待整个页面载入完成。

我们的实现方法是：
-最开始只载入最精简的数据，剩下的交由异步请求去获取。
-仅当需要的数据没有下载完全的时候才阻塞页面的渲染。

这个系统也可以让我们更快的加载CSS,JS,图像等等资源，并让这个网站显得更快且响应更加及时。

5.使用IFRAME

突破浏览器并行加载JS脚本的限制(参见 http://www.stevesouders.com/blog/2009/04/27/loading-scripts-without-blocking/)，[一般浏览器在一个页面中最多会并行加载3个JS脚本或是其他资源文件]——我们在页面的BODY的最前面加上一个IFRAME。其间的具体实现比较复杂，但是幸好我们还有Closure套件，实现此类功能非常方便。总而言之，相较网页速度的提升，这些努力都是值得的。

同时，你可能发现了我们通过XHR而非<style>标签来加载CSS样式表——这个设定并非为了优化，只是为了突破IE浏览器中一个样式表内选择器个数的限制。

最后的话

略。。。。