BigPipe是一个重新设计的基础动态网页服务体系。大体思路是，分解网页成叫做Pagelets的小块，然后通过Web服务器和浏览器建立管道并管理他们在不同阶段的运行。
1. 技术背景 FaceBook页面加载技术
试想这样一个场景，一个经常访问的网站，每次打开它的页面都要要花费6 秒；同时另外一个网站提供了相似的服务，但响应时间只需3 秒，那么你会如何选择呢？网页加载的速度十分重要,尤其对于拥有遍布全球的5亿用户的Facebook(全球最大的社交服务网站)这样的大型网站，有着大量并发请求、海量数据等客观情况，速度就成了必须攻克的难题之一。
简单的说，BigPipe 比AJAX 有三个好处：
2.1. AJAX 的核心是XMLHttpRequest，客户端需要异步的向服务器端发送请求，然后将传送过来的内容动态添加到网页上。如此实现存在一些缺陷，即发送往返请求需要耗费时间，而BigPipe 技术使浏览器并不需要发送XMLHttpRequest 请求，这样就节省时间损耗。
2.2. 使用AJAX时，浏览器和服务器的工作顺序执行。服务器必须等待浏览器的请求，这样就会造成服务器的空闲。浏览器工作时，服务器在等待，而服务器工作时，浏览器在等待，这也是一种性能的浪费。使用BigPipe，浏览器和服务器可以并行同时工作，服务器不需要等待浏览器的请求，而是一直处于加载页面内容的工作阶段，这就会使效率得到更大的提高。
2.3. 减少浏览器发送到请求。对一个5亿用户的网站来说，减少了使用AJAX额外带来的请求，会减少服务器的负载，同样会带来很大的性能提升。
3 实现原理。
当浏览器访问服务器时，服务器接受请求并对其进行检查。如果请求有效，服务器端不做任何的查询，而是立刻返回一个http request 给浏览器，内容是一段html 代码，包括html<head> 标签和<body> 标签的一部分。<head>标签包括BigPipe 的js文件和css文件，这个js 文件用来解析后面接收的http response，因为后面传输的内容都为js脚本。未封闭的<body>标签中，是显示页面的逻辑结构和pagelet 的占位符的模板，例如：
|
1
2
3
4
5
6
7
8
9
|
<body><div></div><div></div><div id=”hotnews”></div><div id=”societynews”></div><div id=”financialnews”></div><div id=”ITnews”></div><div id=”sportsnews”></div><div></div> |
上述模板使用css-div 描述了页面的结构，不同的div 标签对应不同的pagelet，id 对应了pagelet 的名称。将这个response 返回给浏览器后，服务器开始对每个pagelet 的内容进行查询，加载，生成。当一个pagelet的内容生成好，立刻调用flush()函数，将其返回给客户端，传输的数据是以json 格式的，包括这个pagelet 需要的CSS 和JS，以及html 内容和一些元数据。例如：
|
1
2
3
4
5
6
7
8
9
|
<script type=”text/javascript”>big_pipe.onPageletArrive({id:”pagelet_composer”,content:”<HTML>”,css:”[..]“,js:”[..]“,…});</script> |
虽然每个pagelet 都有要加载的js 文件，但是所有的js 文件都是在最后加载，这样有利于加快页面加载速度。客户端，当通过调用“onPageletArrive（json）”函数，第一次影响传输的JS脚本中的函数解析了传入的json 数据，接着下载需要的CSS，然后把html 内容显示到响应的DIV 标签位置上。多个pagelets 的CSS文件可以同时下载，CSS 下载完成的pagelet 先显示。
在BigPipe 中，js 被给予了比CSS 和content 更低的优先级。这样， 只有当所有的pagelets 都显示了，BigPipe 才开始去下载JS 文件。所有的JS 文件都下载完成后，Pagelets的JS初始化代码开始执行，按照下载完成时间的先后顺序。在这个高度并行的系统中，几个的pagelet 所要执行的不同的阶段可以同时执行。例如，浏览器可以给两个pagelets 下载CSS 资源，同时浏览器可以渲染另外一个pagelet 的内容，同时服务器仍然在为另一个pagelet 生成html源码。从用户的角度看来，页面时逐步呈现的。初始的页面显示的更快，可以有效减短用户感觉到的延迟。
2014 年 8 月 9 日
介绍得好详细，很有用