facebook分块加载，页面优化，BigPipe，简单实例
<!DOCTYPE html>
<html>
<head>
<meta charset=”utf-8″>
<title>BigPipe Demo 3</title>
<style type=”text/css”>
* {margin: 0; padding:0;}
body {background-color:#fff;}
div{border:2px solid #4F81BD; margin:30px; padding: 10px;}
p {word-wrap:break-wrod; word-break:break-all; color: #666;}
.red {color: #f00;}
.blue {color:blue;}
.green {color:green;}
</style>
<script>
function render(nodeID,html){
document.getElementById(nodeID).innerHTML=html;
}
</script>
</head>
<body>
<div id=”header”><p>Loading…</p></div>
<div id=”content”><p>Loading…</p></div>
<div id=”footer”><p>Loading…</p></div>
<?php
ob_flush();
flush();
sleep(1);
//填充缓冲区
$header = str_pad(‘<span>111111</span>’, 4096);
?>
<script>render(‘header’, ‘<p><?php echo $header;?><p>’);</script>
<?php
ob_flush();
flush();
sleep(10);
$content = str_pad(‘<span>222222</span>’, 4096);
?>
<script>render(‘content’, ‘<p><?php echo $content;?><p>’);</script>
<?php
ob_flush();
flush();
sleep(10);
$footer = str_pad(‘<span>333333</span>’, 4096);
?>
<script>render(‘footer’, ‘<p><?php echo $footer;?><p>’);</script>
<?php
ob_flush();
flush();
?>
</body>
</html>
注：请将以上代码放到apache服务器上运行
1.作者的博客：http://www.facebook.com/note.php?note_id=389414033919
2.bigpipe技术的ppt：http://twork.taobao.net/books/237
3.bigpipe的java实现:http://codemonkeyism.com/facebook-bigpipe-java/
4.一篇介绍bigpipe的文章：http://www.54chen.com/architecture/rose-pipe-http-54chen.html
5.另一篇挺有用的文章：http://www.cnblogs.com/BearsTaR/archive/2010/06/18/facebook_html_chunk.html
6.人人网类似bigpipe的技术–rosepipe：http://www.54chen.com/architecture/rose-open-source-portal-framework.html
7．《高性能网站建设指南》by Steve Souder， Copyright 2007 Steve Sounder， 978-0-596- 52930-7
