标签：
简介
BigPipe是facebook推出的用于优化网页加载速度的技术，它突破了传统网页的加载方式，通过把网页内容进行分块，然后对这些块进行并行传输从，使得浏览器的渲染无需等到整个页面加载完毕，大大提升网页加载速度。天猫上首页就有这种实现。
Bigpie适用于网页分块清晰，且规模达到一定程度。简单说就是使用bigpipe要达到优化的效果才有意义。
实现原理
利用http1.1中的transfer-encoding:chunked头消息来进行分块传输，初始时只传输网页的骨架，待到具体分块到达后，利用js填充骨架。
已下是基于Nodejs的BigPipe的简单实现：
采用express框架，它默认使用transfer-encoding:chunked头消息
1 var express = require(‘express‘); 2 var app = express(); 3 4 app.get(‘/‘, function (req, res) { 5 var down = 2; 6 res.write(‘<!doctype html>‘); 7 res.write(‘<html><head>‘); 8 res.write(‘<script>‘ + 9 ‘function loaded(id, content){‘ + 10 ‘document.getElementById(id).innerHTML = content‘ + 11 ‘}‘ + 12 ‘</script></head>‘); 13 14 setTimeout(function(){ 15 res.write(‘<div id="pagelet1"></div>‘); 16 res.write(‘<script>loaded("pagelet1", "I am pagelet 1!")</script>‘); 17 18 if(--down === 0){ 19 res.end(‘</body></html>‘); 20 } 21 }, 1000); 22 23 setTimeout(function(){ 24 res.write(‘<div id="pagelet2"></div>‘); 25 res.write(‘<script>loaded("pagelet2", "I am pagelet 2!")</script>‘); 26 if(--down === 0){ 27 res.end(‘</body></html>‘); 28 } 29 }, 3000); 30 }); 31 32 var server = app.listen(3000, function () { 33 var host = server.address().address; 34 var port = server.address().port; 35 36 console.log(‘Example app listening at http://%s:%s‘, host, port); 37 });
标签：
原文地址：http://www.cnblogs.com/zechau/p/4680916.html
