BigPipe_高性能流水线页面手艺
Facebook的网站速率做为最要害的公司义务之一。在2009年，我们成功地实现了Facebook网站速率提升两倍 。而正是我们的工程师团队的几个要害的创新使它成为可能。在本文中，我将向人人先容我们的秘密武器之一，我们称之为BigPipe的伟大底层手艺。
BigPipe是一个重新设计的基础动态网页服务体系。大要思绪是，剖析网页成叫做Pagelets的小块，然后通过Web服务器和浏览器确立管道并治理他们在差别阶段的运行。这是类似于大多数现代微处置器的流水线执行历程：多重指令管线通过差别的处置器执行单米，以到达性能的更佳。虽然BigPipe是对现有的服务 *** 基础历程的重新设计，但它却不需要改变现有的 *** 浏览器或服务器，它完全使用PHP和JavaScript来实现。
念头
为了更好的领会BigPipe，我们需要领会一下现有的动态Web服务系统，它的历史可以追溯到万维网的初期，但现在与初期相比却并没有若干改变。现代网站有着远远高于10年前的动态效果和互动性，但传统的网页服务系统早已无法跟上当今互联网速率的要求。
为了明白BigPipe，我们先看一下传统方式下用户请求的历程:
传统模式在现代网站中效率是异常低下的，由于许多系统的操作顺序，不能相互重叠。一些如延时加载JavaScript、并行下载等优化手艺已被 *** 社区普遍接纳，以此来战胜的一些限制。
然而，这些优化却很少涉及Web服务器和浏览器的执行顺序造成的瓶颈。当Web 服务器正忙天生一个页面，浏览器处于闲置状态，虚耗其周期无所事事。当Web 服务器完成天生页面，并将其发送到浏览器，浏览器则成为性能瓶颈而且Web 服务器对其无从辅助。重叠服务器的天生时间与浏览器的渲染时间，我们不仅可以削减最终的时间延迟，也能使网页更早显示用户可见区域给用户，从而大大削减用户对延迟的感知。
Web 服务器的发生时间和浏览器的渲染时间重叠，是稀奇有用的，如Facebook这样内容丰富的网站。一个典型的Facebook网页包罗许多泉源差别的数据资料：密友名单，密友动态，广告等。在传统网页出现模式的用户将不得不等到这些查询数据都返回并天生最终文件，然后将其发送到用户的电脑。任何一个查询延迟都将拖慢整个最终文件的天生。
BigPipe若何事情
BigPipe首先剖析网页成多个pagelet，每个Pagelet都经由以下几个阶段：
（1）Server请求剖析和检查request（2）Server从存储层获取数据
（3）Server天生HTML响应内容
（4） *** 响应从Web服务器传送到浏览器侧
（5）响应CSS的下载请求
（6）构建DOM树和应用CSS样式
（7）JavaScript下载
（8）JavaScript执行
感受和传统模式下的页面请求历程一样啊，但BigPipe能让多个Pagelet在统一时刻处于差别的阶段
（Facebook主页的pagelets，每个矩形对应一个Pagelet。）
该Facebook主页包罗多个pagelet，相互自力，从用户的角度来看，页面是一块一块逐步出现的，感受网页内容出现得异常快，大大削减了用户对页面延时的感知。例如当“导航pagelet”处于页面显示阶段时，“新闻动态pagelet”可能正处于Server天生阶段。在BigPipe中，一个用户请求的生命周期是这样的：在浏览器发送一个HTTP请求到Web服务器。在收到的HTTP请求，并在上面举行一些周全的检查，服务器收到请求后，举行一些需要的检查，然后立刻返回一个不完整的HTML文件：其中有<head>和<body>
<head>中包罗BigPipe的JavaScript库，用来剖析Pagelet
<body>中是一个模板，形貌了页面的逻辑结构，每个逻辑部门使用pagelet占位符举行占位，例如：
<div> <div> <div id="pagelet_nav"></div> </div> <div> <div id="pagelet_composer"></div> <div id="pagelet_ads"></div> </div>
Web服务器一个接一个的天生pagelet，只要一个pagelet天生了，立刻被发送到客户端，客户端收到一个pagelet后就更先剖析并加载CSS，然后渲染显示出来，于此同时，服务器在并行处置下一个pagelet
例如，浏览器可以在下载3个pagelet的CSS的同时，渲染另一个pagelet内容，与此同时，服务器在天生另一个pagelet的内容。
以是BigPipe的效果就是：多个pagelet同时执行，但处于差别阶段，使浏览器和服务器并行高效处置
pagelet的内容是一个 *** ON工具，包罗HTML内容，和需要引用的CSS、JavaScript
BigPipe首先下载pagelet的CSS，然后在这个pagelet占位符所在的位置举行显示，多个pagelet的CSS可同时下载，可以无序，JavaScript的优先级更低，所有pagelet都显示出来之后才更先下载JavaScript
性能测试效果
下图是传统模式与BigPipe的性能对照图，对Facebook主页的延迟时间举行了对比， *** 数据方式是在禁用浏览器缓存的情况下加载页面50次，该图显示BigPipe使用户在大多数浏览器中感受到的延迟削减了一半。
值得一提的是BigPipe是从微处置器的流水线中获得启发。然而，他们的流水线历程之间存在一些差异。例如，虽然大多数阶段BigPipe只能操作一次Pagelet，但有时多个Pagelets的CSS和JavaScript下载却可以同时运作，这类似于超标量微处置器。
BigPipe另一个主要区别是，我们实现了从并行编程引入的“障碍”观点，所有的Pagelets要完成一个特定阶段，如多个Pagelet显示区，它们都可以举行进一步JavaScript下载和执行。
在Facebook，我们激励创造性思索。我们不停的实验创新手艺，以使我们的网站更快。
内容整理自Facebook文章：https://www.facebook.com/note.php?note_id=389414033919
1.阿里云: 本站现在使用的是阿里云主机，平安/可靠/稳固。点击领取2000米代金券、领会最新阿里云产物的种种优惠流动点击进入
相关文章
如何做好「按钮」的用户体验？
编辑导语：我们在利用Web可能移动端时常常会看到一些按钮，好比确认、切换、返回、打消等等，这些按钮的设计会参考到用户体验的感觉，好比封锁按钮的颜色可能巨细与旁边的按钮有明明的区别，为了利用户可以或许清...
创业赚钱项目有哪些？请看以下项目！
伴随着我国“大家领域，大众创业”的宣传口号传出，有很多人 逐渐考虑到自主创业，终究如今自主创业有国家新政策和补助帮扶，可是自主创业的新项目有很多，小到摆地摊，大到成立公司，但不管怎样，大家的最终总目地...
黑客挖钻石图片（黑客挖洞从哪里开始）
鸡肉钻啥意思 1、所谓肉鸡就是指专门用于生产鸡肉的仔鸡，它是食用肉仔鸡的总称。现代肉鸡的概念与传统肉鸡截然不同。50年代以前，传统肉鸡主要来源于淘汰的小公鸡和产蛋鸡，而现代肉鸡则是指通过专门化品系配套...
蓝宝石配什么颜色衣服（珠宝和衣服应该怎么搭
半个世纪前，奥黛丽·赫本选择了纪梵希，纪梵希选择了奥黛丽·赫本，同时，他们又选择了蒂凡尼，所以他们成就了一个珠宝的神话，那就是《蒂凡尼的早餐》。 珠宝，服装，是一对姐妹，姐姐高贵，妹妹时髦，当她们完...
黑客接单hzs,找黑客改成绩后果,找黑客带赚钱吗
CredCrack的作业机制而GFSK制式仅仅是在FSK制式的基础上，在调制之前经过一个高斯低通滤波器来约束信号的频谱宽度，以此来提高信号的传达功用。 在这种情况下,成果便是有用的查询成果,像是htt...
重庆大学怎么样（重庆大学厉害吗排名情况如何）
湖南大学如何（湖南大学强大吗排行状况怎样）湖南大学，重庆第一高等院校，西部地区一流高等院校，全国各地著名高校。从精准定位上看，湖南大学的精准定位是较为高的，湖南大学是211工程，985工程名牌大学...
Copyright Your WebSite.Some Rights Reserved.
免责声明:本站所发布的任何网站，全部来源于互联网，版权争议与本站无关。仅供技术交流，如有侵权或不合适，请联系本人进行删除。不允许做任何非法用途！