BigPipe介绍

http://baike.baidu.com/view/4601904.htm

http://www.searchtb.com/2011/04/an-introduction-to-bigpipe.html

 原文地址:http://www.facebook.com/note.php?note_id=389414033919

译文地址:http://isd.tencent.com/?p=2419
作者:蒋长浩

Facebook的网站速度做为最关键的公司任务之一。在2009年,我们成功地实现了Facebook网站速度提升两倍 。而正是我们的工程师团队的几个关键的创新使它成为可能。在本文中,我将向大家介绍我们的秘密武器之一,我们称之为BigPipe的伟大底层技术。

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

动机

为了更好的了解BigPipe,我们需要了解一下现有的动态Web服务系统,它的历史可以追溯到万维网的初期,但现在与初期相比却并没有多少改变。现代网站有着远远高于10年前的动态效果和互动性,但传统的网页服务系统早已无法跟上当今互联网速度的要求。在传统的模式,用户请求的生命周期如下:

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如何工作

要利用该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代码。

前三个阶段执行,由Web服务器,最后四个阶段是由浏览器执行。每个Pagelet必须经过所有这些阶段顺序,但BigPipe在不同的阶段使几个Pagelets同时执行。


(Facebook主页的Pagelets,每个矩形对应一个Pagelet。)

上面的图片使用Facebook主页为例子来说明如何将网页是分解成Pagelets。该主页包括几个Pagelets:“作者Pagelet”,“导航Pagelet”,“新闻动态Pagelet”,“请求框Pagelet”,“广告pagelet”,“朋友推荐”和“联系”等他们是相互独立的。当“导航Pagelet”显示给用户,“新闻动态Pagelet”仍然可以在服务器上正在生成。

在BigPipe,一个用户请求的生命周期是这样的:在浏览器发送一个HTTP请求到Web服务器。在收到的HTTP请求,并在上面进行一些全面的检查,网站服务器立即发回一个未关闭的HTML文件,其中包括一个HTML 标签和标签的开始标签。标签包括BigPipe的JavaScript库来解析Pagelet以后收到的答复。在标签,有一个模板,它指定了页面的逻辑结构和Pagelets占位符。例如:

渲染后的第一个反应到客户端,Web服务器继续一个接一个生成Pagelets只要一个Pagelet生成,他将立即刷新到客户端在一个JSON编码的对象,包括所有的CSS,JavaScript的pagelet,它的HTML内容,以及一些元数据所需的资源。例如:

在客户端在收到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管道模式的页面。如果您的浏览器版本比较老,网速也很慢,浏览器缓存不佳,哪么两页之间的加截时间差别将更加明显。

性能测试结果

下图是传统模式和BigPipe性能数据比较图,数据是75%用户对一个页面中最重要的内容(例如:新闻动态被认为是在Facebook主页上最重要的内容)的感知延迟时间。收集数据方式是加载Facebook主页50次并且禁用浏览器缓存。该图显示BigPipe使用户在大多数浏览器中感受到的延迟减少了一半。


(Facebook主页的延迟时间对比)

值得一提的是BigPipe是从微处理器的流水线中得到启发。然而,他们的流水线过程之间存在一些差异。例如,虽然大多数阶段BigPipe只能操作一次Pagelet,但有时多个Pagelets的CSS和JavaScript下载却可以同时运作,这类似于超标量微处理器。BigPipe另一个重要区别是,我们实现了从并行编程引入的“障碍”概念,所有的Pagelets要完成一个特定阶段,如多个Pagelet显示区,它们都可以进行进一步JavaScript下载和执行。

在Facebook,我们鼓励创造性思考。我们不断的尝试创新技术,以使我们的网站更快。

作者蒋长浩目前是Facebook的研究科学家,他致力于研究使网站更快的各种创新。

(译者还找到了几篇关于BigPipe的文章,如果有兴趣大家可以了解下:Facebook创新之BigPipe:优化页面加载时间名站技术分析 — facebook奇特的页面加载技术Facebook让网站速度提升一倍的BigPipe技术分析Facebooks BigPipe Done in JavaOpen BigPipe javascript implementationTutorial: Implementing Facebook’s BigPipe Using ASP.Net MVCBigPipe Done in Node.js

以Facebook现在的经营规模,诸多传统服务器的技术均将崩溃或根本无法支撑。那么面对5亿的活跃用户,Facebook的工程师们又将如何让网站平 稳运转呢?伯乐在线 - 职场博客的这篇文章将展示Facebook的工程师完成这个艰巨任务所用到的一系列软件。


Facebook级别规模的挑战 

在我们深入细节之前,先了解一组Facebook不得不面对数据,你就可以想象这种规模。

  • Facebook每月的PV量:630,000,000,000 (6千3百亿)
  • Facebook上的图片数量超过其他图片网站的总和(包括诸如Flickr这样的图片网站)
  • 每个月有超过30亿的图片上传到Facebook
  • Facebook系统每秒可以处理120万张图片。这还不包括Facebook的CDN处理的图片。
  • 每月处理超过250亿的信息内容(包括用户状态更新,评论等)
  • Facebook的服务器数量超过3万台(此数据为2009年的数据)



Facebook所用的软件 

从某些方面来说,Facebook还是属于LAMP类型网站,但是,为了配合其他大量的组件和服务,Facebook对已有的方法,已经做了必要的改变、拓展和修改。

比如:

  • Facebook依然使用PHP,但Facebook已重建新的编译器,以满足在其Web服务器上加载本地代码,从而提升性能;
  • Facebook使用Linux系统,但为了自身目的,也已做了必要的优化。(尤其是在网络吞吐量方面);
  • Facebook使用MySQL,但也对其做优化。


还有定制的系统,比如, Haystack -- 高度可扩展的对象存储,用来处理Facebook的庞大的图片;Scribe -- Facebook的日志系统。

下面展现给大家的是,全球最大的社交网站Facebook所使用到的软件。

Memcached 

Memcached是一款相当有名的软件。它是分布式内存缓存系统。Facebook(还有大量的网站)用它作为Web服务器和MySQL服务器之间的缓存层。经过多年,Facebook已在Memcached和其相关软件(比如,网络栈)上做了大量优化工作。

Facebook运行着成千上万的Memcached服务器,借以及时处理TB级的缓存数据。可以这样说,Facebook拥有全球最大的Memcached设备。

HipHop for PHP 

和运行在本地服务器上代码相比,PHP的运行速度相对较慢。HipHop把PHP代码转换成C++代码,提高编译时的性能。因为Facebook很依赖PHP来处理信息,有了HipHop,Facebook在Web服务器方面更是如虎添翼。

HipHop诞生过程:在Facebook,一小组工程师(最初是3位)用了18个月研发而成。

Haystack 

Haystack是Facebook高性能的图片存储/检索系统。(严格来说,Haystack是一对象存储,所以它不一定要存储图 片。)Haystack的工作量超大。Facebook上有超过2百亿张图片,每张图片以四种不同分辨率保存,所以,Facebook有超过8百亿张图 片。

Haystack的作用不单是处理大量的图片,它的性能才是亮点。我们在前面已提到,Facebook每秒大概处理120万张图片,这个数据并不包括其CDN处理的图片数。这可是个惊人的数据!!!

BigPipe 

BigPipe是Facebook开发的动态网页处理系统。为了达到最优,Facebook用它来处理每个网页的分块(也称“Pagelets”)。

比如,聊天窗口是独立检索的,新闻源也是独立检索的。这些Pagelets是可以并发检索,性能也随之提高。如此,即使网站的某部分停用或崩溃后,用户依然可以使用。

Cassandra 

Cassandra是一个没有单点故障的分布式存储系统。它是前NoSQL运动的成员之一,现已开源(已加入Apache工程)。Facebook用它来做邮箱搜索。

除了Facebook之外,Cassandra也适用于很多其他服务,比如Digg。

Scribe 

Scribe是个灵活多变的日志系统,Facebook把它用于多种内部用途。Scribe用途:处理Facebook级别日志,一旦有新的日志分类生成,Scribe将自动处理。(Facebook有上百个日志分类)。

Hadoop and Hive

Hadoop是款开源Map/Reduce框架,它可以轻松处理海量数据。Facebook用它来做数据分析。(前面就说到了,Facebook的数据量 是超海量的。)Hive起源于Facebook,Hive可以使用SQL查询,让非程序员比较容易使用Hadoop。(注1: Hive是是基于Hadoop的一个数据仓库工具,可以将结构化的数据文件映射为一张数据库表,并提供完整的sql查询功能,可以将sql语句转换为 MapReduce任务进行运行。 )

Thrift 

Facebook在其不同的服务中,使用了不同的语言。比如: PHP用在前端,Erlang用于聊天系统,Java和C++用于其它地方,等等。Thrift是内部开发的跨语言的框架,把不同的语言绑定在一起,使之 可以相互“交流”。这就让Facebook的跨语言开发,变得比较轻松。

Facebook已把Thrift开源,Thrift支持的语言种类将更多。

Varnish 

Varnish是一个HTTP加速器,担当负载均衡角色,同时也用于快速处理缓存内容。

Facebook用Varnish处理图片和用户照片,每天都要处理十亿级的请求。和Facebook其他的应用应用一样,Varnish也是开源的。

Facebook可以平稳运行,还得利于其他方面 

虽然上面已经提到了一些构成Facebook系统的软件,但是处理如此庞大的系统,本身就是一项复杂的任务。所以,下面还将列出使Facebook能平稳运行的一些东西。

逐步发布&暗启动 

Facebook有一个系统,他们称之为“门卫”。该系统可以针对不同种类的用户运行不同的代码。(它简单介绍了代码库中的不同条件。)该系统让Facebook逐步发布新特性、A/B测试、激活仅针对Facebook员工的特性 等等。

门卫系统也让Facebook做些“暗启动”的事情。比如,在某一特性上线之前,可以激活该特性背后的元件。另外,它还可以做模拟压力测试,发现瓶颈和潜在的问题。默默启动一般都是在正式启动之前的2周完成。

实时系统的简介 

Facebook会仔细监控自身系统,有趣的是,它还监控每个PHP函数在实时生产环境下的性能。这一实时PHP环境监控是通过一个叫XHProf的开源工具完成的。

逐步禁用某些特性,借以提高性能 

如果Facebook遇到性能问题,Facebook有大量的途径来逐步禁用不很重要的特性,以提高其核心特性性能。

尚未提到的东西 

虽然这里无法过多深入硬件方面,但硬件绝对是Facebook能达到空前规模的重要因素。比如,和其他大型网站一样,Facebook也用CDN来处理静态内容。Facebook还在美国西部的俄勒冈州建有一超大的数据中心,可以随时增加服务器。

当然了,除了前面已经提到的,还有其他大量的软件没有说到。但是,希望能突出其中非常有特色的。

Facebook和开源之间的“恋情” 

Facebook和开源之间联系,此文不能不提,虽不能说Facebook是多么地钟爱开源,但至少可以这样说,Facebook是“爱”着开源的。

Facebook不仅使用(也捐赠)开源软件,比如,Linux、Memcached、MySQL、Hadoop等等,它还内部开发不少软件,并且也将之开源。

Facebook开发的开源工程,包括HipHop、Cassandra、Thrift和Scribe。另外,Facebook也把Tornado开源 了。Tornado是一个高性能的Web服务器框架,由FriendFeed幕后团队开发而成。(2009年8月,Facebook收购 FriendFeed。)

(Facebook所用到的开源软件,可以在Facebook的开源页面找到。)

面临更多的大规模挑战 

Facebook以一种令人难以置信的速度成长。它的用户群几乎是成倍增加,活跃用户数量现已接近5亿。而且,谁都无法预测今年底,活跃用户量会到多少。

Facebook甚至成立了一个专门的“成长小组”,该小组不断思考如何让人们使用facebook并融入到facebook中。

这一快速成长,意味着Facebook将遇到不同的性能瓶颈。Facebook会面临来这如下方面的挑战:PV、搜索、上传的图片和状态消息,用户之间的交互和用户和Facebook之间的交互带来的挑战。

这也是Facebook面对的事实。Facebook的工程师们将继续寻求新方法来扩展(这不只是增加服务器的问题了)。比如,随着网站成长,其图片存储系统已经多次完全重写。

所以,我们将看到Facebook的工程师们奔向下一个“山头”。我们相信他们不会辜负众望。毕竟,他们正跨越山头,那个我们大多数人仅能向往的山头;他们正扩展网站,那个用户来自全球各地的网站。当你实现那个里程碑时,你将彪炳史册。

 

 

 

 

 

 

http://www.jobbole.com/entry.php/503

Web开发人员应当知道的15个开源项目

如今,构建网站和开发Web应用程序已经不仅要求开发人员是一名优秀的程序员,更需要聪明的程序员。这也就是说,在可能的情况下,重复使用已有的代码和应用程序,而不是自己重头开始。

开源由来已久,并且很多网站的构建也使用了开源。开发人员都知道Linux、Apache、MySQL及 PHP (LAMP)。

但是除那些之外的其他开源项目呢?作为一名Web开发人员,你可以借助诸多可用的项目,以节省开发时间,或提高程序性能。

下面让我们看一下哪些开源项目可供大家免费使用。

可供使用的新型数据库 

传统上讲,你可能习惯使用MySQL。尽管MySQL是一个非常棒的数据库,但诸多试图解决MySQL存在的问题的新型数据库已经问世。

1. MongoDB 

MongoDB就是的“非关系型”数据库之一。它扩展性强、性能高。

2. Apache Cassandra 

与MongoDB相似,Apache Cassandra也是一种“非关系型”数据库,它亦扩展性强、性能高。并且能够很好地处理庞大而活跃的数据集。(编注:Facebook用Cassandra来做邮箱搜索。)

更多 

根据需要,你还有更多的选择。请参阅维基百科的这个列表


缓存数据 

因为需要频繁使用一些数据,所以相比每次去数据库中查询,把这些数据存放在内存中更加合理。这能够大大提高Web应用程序的运行速度。

3. Memcached 

Memcached是一种在内存中缓存小型数据块的简单但强大的解决方法。(编注: Facebook运行着成千上万的Memcached服务器,借以及时处理TB级的缓存数据。)

4. Redis 

Redis的作用与Memcached相同,但包含更多的特性。例如,它也可以存储本应当永久性保存在磁盘上的数据。


加快网络请求的速度 

大多数网站使用Apache的网络服务器来提供服务。它能够很好地服务于大多数网站,但是一旦网站的访问量增大,就需要做进一步优化。

5. Nginx 

Nginx是一种与Apache非常相像的网络服务器,但它的速度相当快。作为负载平衡器,它常用于处理静态内容,如图像文件。

6. Varnish 

Varnish是位于常规网络服务器之前的高速缓存器。它将所有热门内容放入内存,直接对其处理,无须将所有内容都传给网络服务器。(编注: Facebook用Varnish 处理图片和用户照片,每天都要处理十亿级的请求。Facebook所用到的其他开源项目,请参阅《揭秘Facebook背后的那些软件》一文。)


轻松管理内容 

如果你在构建一个允许用户添加及编辑内容的网站,那么你可能需要一个内容管理系统(CMS)。CMS能够帮助开发人员轻松地管理博客及网站,并且提供大量的能够扩展网站功能的插件。

7. WordPress 

虽然WordPress是个博客平台,但它也能用于管理大大小小的网站。

8. Drupal 

Drupal是一个可用于构建强扩展性、高灵活性网站的完整平台。

更多 

还有很多可用的内容管理系统。请参阅维基百科的这个大型列表


交互式的网络UI 

如今,你可以使用JavaScript和AJAX技术,开发一个类似桌面应用程序那样的以多种方式运行的网络应用。使用JavaScript框架,能够轻松地开发大型的网络应用程序。

9. JQuery 

JQuery是一个带插件的框架,这些插件有主构建包含AJAX交互及动画的动态网站。

10. MooTools 

MooTools就和jQuery一样,是一个使用JavaScript构建强大网络应用程序的框架。

更多 

如果你想尝试一下其他选择,请参考维基百科的这个列表


其他比较炫的资源 

当你开始开发一个复杂的网络应用程序时,很多软件、库及模型能够帮你解决难题,如果不参考这些资源,你可能会花费大量的时间。以下是两个入门的例子。

11. Node.js 

Node.js是一个事件驱动的输入/输出框架,支持用JavaScript编写应用程序,并在V8 JavaScript引擎上运行。这是一种开发快速、可扩展网络程序的很棒的方式。

12. RabbitMQ 

RabbitMQ是一种可靠的、可扩展的信息传送系统,它能够处理高吞吐量。如果需要在系统之间或应用程序之间交换数据,比起传统的解决方案或直接将数据存储在数据库中,信息传送系统的更能胜任这一工作。


使用框架来加速开发进程 

不管你是使用PHP还是其他的编程语言,有很多不同的可用框架能够帮助你加速开发进程,并能够更加轻松地管理代码。

13. Symfony 

Symfony是一个PHP框架,它包含很多能够加速开发复杂网络应用程序的组件及工具。同时它包含社区提供的1000多个插件。

14. Ruby on Rails 

对Ruby语言而言,Ruby on Rails是最流行的可用框架。

15. Django 

Django是一个Python网络框架,它用来帮助快速开发高性能、优秀的网络应用程序。

更多 

维基百科上有一份更完整的列表,这个列表包含不同语言的可用网络应用框架。 


后话 - 合理利用时间 

开发人员有必要花费时间不断了解哪些新软件是可用的,这样对轻松地解决复杂的任务大有裨益。

而且在项目开发之初,花费一些时间做计划和调查也是非常有必要的,因为这样可以明确即将面临的问题,并确定其最佳解决方案。

自己编程来解决每个问题的时代已经结束,如今更多的是灵活使用现有技术来解决问题。

不知正在看本文的Web开发人员,在上述这些开源项目中,你用到了哪些?欢迎你在评论中分享你的使用经验和心得。

posted on 2012-04-11 22:54  dhj  阅读(312)  评论(0编辑  收藏  举报

导航