BigPipe是一个重新设计的基础动态网页服务体系。大体思路是,分解网页成叫做Pagelets的小块,然后通过Web服务器和浏览器建立管道并管理他们在不同阶段的运行。这是类似于大多数现代微处理器的流水线执行过程:多重指令管线通过不同的处理器执行单元,以达到性能的最佳。虽然BigPipe是对现有的服务网络基础过程的重新设计,但它却不需要改变现有的网络浏览器或服务器

工作原理

要利用该Web服务器和浏览器之间的并行性,BigPipe首先分解网页成多个可调用的Pagelets。正如流水线微处理器划分一个指令的生命周期为(如“取指令”,“指令解码”,“执行”,“写回寄存器”等)多个阶段,BigPipe的页面生成过程分为以下几个阶段:
1. 请求解析:Web服务器解析和完整性检查的HTTP请求。
2. 数据获取:Web服务器从存储层获取数据。
3. 标记生成:Web服务器生成的响应的HTML标记。
4. 网络传输:响应从Web服务器传送到浏览器。
5. CSS的下载:浏览器下载网页的CSS的要求。
6. DOM树结构和CSS样式:浏览器构造的DOM文档树,然后应用它的CSS规则。
7. JavaScript中下载:浏览器下载网页中JavaScript引用的资源。
8. JavaScript执行:浏览器的网页执行JavaScript代码。[1] 
前三个阶段执行,由Web服务器,最后四个阶段是由浏览器执行。每个Pagelet必须经过所有这些阶段顺序,但BigPipe在不同的阶段使几个Pagelets同时执行。
在BigPipe,一个用户请求的生命周期是这样的:在浏览器发送一个HTTP请求到Web服务器。在收到的HTTP请求,并在上面进行一些全面的检查,网站服务器立即发回一个未关闭的HTML文件,其中包括一个HTML 标签和标签的开始标签。标签包括BigPipe的JavaScript库来解析Pagelet以后收到的答复。在标签,有一个模板,它指定了页面的逻辑结构和Pagelets占位符。
在客户端在收到Pagelet通过“onPageletArrive”发出的指令,BigPipe的JavaScript库将首先下载它的CSS资源;在CSS资源被下载完成后,BigPipe将在Pagelet的标记HTML显示它的innerHTML。多个Pagelets的CSS可在同一时间下载,它们可以根据其各自CSS的下载完成情况来确认显示顺序。在BigPipe中,JavaScript资源的优先级低于CSS和页面内容。因此,BigPipe不会在所有Pagelets显示出来之前下载任何Pagelet中的JavaScript。然后,所有Pagelets的JavaScript异步下载。最后Pagelet的JavaScript初始化代码根据其各自的下载完成情况来确定执行顺序。
这种高度并行系统的最终结果是,多个Pageletsr的不同执行阶段同时进行。例如,浏览器可以正在下载三个Pagelets CSS的资源,同时已经显示另一Pagelet内容,与此同时,服务器也在生成新的Pagelet。从用户的角度来看,页面是逐步呈现的。最开始的网页内容会更快的显示,这大大减少了用户的对页面延时的感知。如果您要自己亲眼看到区别,你可以尝试以下连结: 传统模式和BigPipe。第一个链接是传统模式单一模式显示页面。第二个链接是BigPipe管道模式的页面。如果您的浏览器版本比较老,网速也很慢,浏览器缓存不佳,哪么两页之间的加截时间差别将更加明显。
在传统的模式,用户请求的生命周期如下:
1. 浏览器发送一个HTTP请求到Web服务器。
2. Web服务器解析请求,然后读取数据存储层,制定一个HTML文件,并用一个HTTP响应把它发送到客户端。
3. HTTP响应通过互联网传送到浏览器。
4. 浏览器解析Web服务器的响应,使用HTML文件构建了一个的DOM树,并且下载引用的CSS和JavaScript文件。
5. CSS资源下载后,浏览器解析它们,并将它们应用到DOM树。
6. JavaScript资源下载后,浏览器解析并执行它们。
传统模式在现代网站中效率是非常低下的,因为很多系统的操作顺序,不能互相重叠。一些如延时加载JavaScript、并行下载等优化技术已被网络社区广泛采用,以此来克服的一些限制。然而,这些优化却很少涉及Web服务器和浏览器的执行顺序造成的瓶颈。当Web服务器正忙生成一个页面,浏览器处于闲置状态,浪费其周期无所事事。当Web服务器完成生成页面,并将其发送到浏览器,浏览器则成为性能瓶颈并且Web服务器对其无从帮助。重叠Web服务器的生成时间与浏览器的渲染时间,我们不仅可以减少最终的时间延迟,也能使网页更早显示用户可见区域给用户,从而大大减少用户对延迟的感知。
Web服务器的产生时间和浏览器的渲染时间重叠,是特别有用的,如Facebook这样内容丰富的网站。一个典型的Facebook的网页包含许多来源不同的数据资料:好友名单,好友动态,广告等。在传统的网页呈现模式的用户将不得不等到这些查询数据都返回并生成最终文件,然后将其发送到用户的电脑。任何一个查询延迟都将拖慢整个最终文件的生成。

BigPipe 了解的更多相关文章

  1. BigPipe学习研究

    BigPipe学习研究   from: http://www.searchtb.com/2011/04/an-introduction-to-bigpipe.html 1. 技术背景 FaceBook ...

  2. nodejs简易实现一下bigpipe

    今天刚好看到bigpipe的文章,写个demo试一下: nodejs的实现: var fs = require('fs'); module.exports = function(req , res){ ...

  3. BigPipe

    BigPipe是一个重新设计的基础动态网页服务体系.大体思路是,分解网页成叫做Pagelets的小块,然后通过Web服务器和浏览器建立管道并管理他们在不同阶段的运行.这是类似于大多数现代微处理器的流水 ...

  4. [转载]BigPipe技术

    1. 技术背景 FaceBook页面加载技术 试想这样一个场景,一个经常访问的网站,每次打开它的页面都要要花费6 秒:同时另外一个网站提供了相似的服务,但响应时间只需3 秒,那么你会如何选择呢?数据表 ...

  5. 高性能页面加载技术(流水线加载)BigPipe的C#简单实现(附源码)

    一,BigPipe简介 BigPipe是一个重新设计的基础动态网页服务体系.大体思路是,分解网页成叫做Pagelets的小块,然后通过Web服务器和浏览器建立管道并管理他们在不同阶段的运行.这是类似于 ...

  6. php通过curl实现bigpipe

    BigPipe是facebook发明的一种页面加载技术.其实也不是什么新技术了,也有很多文章进行说明.但是在网上,具体讲如何使用php实现bigpipe的文章很少,并且有些文章还不很准确.bigpip ...

  7. facebook分块加载,页面优化,BigPipe,简单实例

    <!DOCTYPE html><html><head><meta charset=”utf-8″><title>BigPipe Demo 3 ...

  8. BigPipe设计原理

    高性能页面加载技术--BigPipe设计原理及Java简单实现 1.技术背景 动态web网站的历史可以追溯到万维网初期,相比于静态网站,动态网站提供了强大的可交互功能.经过几十年的发展,动态网站在互动 ...

  9. 用 NodeJS 实现 BigPipe

    BigPipe 是 Facebook 开发的优化网页加载速度的技术.网上几乎没有用 node.js 实现的文章,实际上,不止于 node.js,BigPipe 用其他语言的实现在网上都很少见.以至于这 ...

随机推荐

  1. 解决关于打开plist文件乱码问题,plist转换为xml文件的txt文件!

    自己是程序员,干嘛不自己写代码完成?下载工具还不一定管用!具体解决方案如下: 1,获得内容 NSArray *dictionary = [NSArray arrayWithContentsOfFile ...

  2. 10、C#基础整理(集合)

    集合 1.集合的引用 using System.Collections;//添加类 2.定义集合(ArrayList 或 Array) ArrayList arr = new ArrayList(); ...

  3. 转:label标签的特殊用法

    容易被忽略的label标签 原始作用 label标签是HTML原生的标签,其原始的作用参考这里 label 标签为 input 元素定义标注(标记). label 元素不会向用户呈现任何特殊效果.不过 ...

  4. iOS开发环境C语言基础 运算符和表达式

    1 年龄判断程序 1.1 问题 本案例需要使用交互的方式判断年龄的范围:用户从控制台输入一个年龄,由程序判断该年龄是否在18~50岁之间.程序交互过程如图-1所示: 图-1 1.2 步骤 实现此案例需 ...

  5. 内存回收,Dispose,Close,Finalie(C#中的析构函数)

    NET中的资源分托管和非托管,所谓的托管是指CLR(通用语言运行时)中进行管理的资源,它可以由CLR自动进行内存回收. 也就是大家熟知的GC(垃圾回收机制). 而对于 非托管资源,比如数据库连接,CO ...

  6. 八 JDBC

    一 JDBC 简介 1. 作用:规避数据库的不同,为程序开发人员访问数据库提供统一的编程接口. 2. 具体作用:和数据库建立连接,发送 sql 语句,处理数据库返回的结果集. 3. 框架模式: 4. ...

  7. UVa 11714 - Blind Sorting

    题目题意: 有n个不同的数,你可以询问a,b哪个大,会得到答案,然后问最少要几次保证能挑选出最大和第二大的数. 分析: n个数,先以打擂台的方式,两两比较出最大的,n - 1次,然后在由被最大PK下去 ...

  8. C++ Primer : 第十二章 : 动态内存之unique_ptr和weak_ptr

    unique_ptr 一个unique_ptr拥有它所管理的对象,与shared_ptr不同,unique_ptr指向的对象只能有一个用户.当unique_ptr被销毁后,它所指向的对象也被销毁. 定 ...

  9. C++ Primer : 第十二章 : 动态内存之shared_ptr类

    在C++中,动态内存是的管理是通过一对运算符来完成的:new  ,在动态内存中为对象分配空间并返回一个指向该对象的指针,delete接受一个动态对象的指针,销毁该对象,并释放该对象关联的内存. 动态内 ...

  10. Codeforces Round #129 (Div. 2)

    A. Little Elephant and Rozdil 求\(n\)个数中最小值的个数及下标. B. Little Elephant and Sorting \[\sum_{i=1}^{n-1}{ ...