Rafe/Procfile

## app.js
var express = require('express')
  , async = require('async')
  , path = require('path')
  , jade = require('jade')
  , fs = require('fs');

var app = express();

app.configure(function(){
  app.set('port', process.env.PORT || 3000);
  app.use(express.favicon());
  app.use(express.logger('dev'));
});

app.configure('development', function(){
  app.use(express.errorHandler());
});

var loadView = function(name, locals) {
  var template = fs.readFileSync(path.join(__dirname, name + '.jade')).toString();
  return jade.compile(template)(locals);
};

var db = {
  search: function(callback) {
    setTimeout(function() {
      callback({items: ['test', 'test1', 'test2', 'test3']});
    }, 2000);
  },
  slowQuery: function(callback) {
    setTimeout(function() {
      callback();
    }, 5000);
  }
};

var renderLayout = function(req, res, next) {
  res.writeHead(200, {'Content-Type': 'text/html'});
  res.write('<html><head><title>Test</title></head><body>');
  res.write(loadView('layout', {}));
  next();
};


var renderSidebar = function (req, res, next) {
  db.search(function(items) {
    var content = loadView('sidebar', items);
    res.write('<script>$(".content-sidebar").html(\'' + content + '\');</script>');
    next();
  });
};

var renderContent = function (req, res, next) {
  var content = loadView('main', {title: 'Bigpipe!'});
  res.write('<script>$(".content-main").html(\'' + content + '\');</script>');
  next();
};

var renderExtra = function (req, res, next) {
  db.slowQuery(function() {
    var extra = loadView('extra', {});
    res.write('<script>$(".content-extra").html(\'' + extra + '\');</script>');
    next();
  });
};

var renderBody = function (req, res, next) {
  async.forEach([renderExtra, renderSidebar, renderContent], function(fn, done) {
    fn(req, res, done);
  }, next);
};

var renderEnd = function (req, res, next) {
  res.write('</body></html>');
  res.end();
};

app.get('/', renderLayout, renderBody, renderEnd );

app.listen(process.env.PORT || 3000);
console.log("Express server listening on port " + app.get('port'));

## extra.jade
a.btn.btn-md.btn-primary Test
a.btn.btn-md.btn-primary Test
a.btn.btn-md.btn-primary Test
a.btn.btn-md.btn-primary Test
a.btn.btn-md.btn-primary Test
a.btn.btn-md.btn-primary Test

## layout.jade
script(src='http://code.jquery.com/jquery-1.9.0.min.js')
link(rel='stylesheet', href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css')
<!--used to over 1k cache in chrome xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx -->
<!--used to over 1k cache in chrome xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx-->
nav.navbar.navbar-inverse
  .container
    .navbar-header
      a.navbar-brand Test Bigpipe
.container
  .row
    .content-sidebar.col-md-3
    .content-main.col-md-5
    .content-extra.col-md-4

## main.jade
.jumbotron
  h1 #{title}
  h3 This is bigpipe!

## package.json
{
  "name": "express-pipe-experiment",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node app"
  },
  "dependencies": {
    "express": "3.1.0",
    "jade": "*",
    "async": "~0.1.22"
  },
  "engines": {
    "node": "0.8.x",
    "npm": "1.2.x"
  }
}

## Procfile
web: node app.js

## sidebar.jade
ul.nav.nav-pills.nav-stacked
  for item in items
    li
      a(href='#') #{item}
	var express = require('express')
	, async = require('async')
	, path = require('path')
	, jade = require('jade')
	, fs = require('fs');

	var app = express();

	app.configure(function(){
	app.set('port', process.env.PORT \|\| 3000);
	app.use(express.favicon());
	app.use(express.logger('dev'));
	});

	app.configure('development', function(){
	app.use(express.errorHandler());
	});

	var loadView = function(name, locals) {
	var template = fs.readFileSync(path.join(__dirname, name + '.jade')).toString();
	return jade.compile(template)(locals);
	};

	var db = {
	search: function(callback) {
	setTimeout(function() {
	callback({items: ['test', 'test1', 'test2', 'test3']});
	}, 2000);
	},
	slowQuery: function(callback) {
	setTimeout(function() {
	callback();
	}, 5000);
	}
	};

	var renderLayout = function(req, res, next) {
	res.writeHead(200, {'Content-Type': 'text/html'});
	res.write('<html><head><title>Test</title></head><body>');
	res.write(loadView('layout', {}));
	next();
	};


	var renderSidebar = function (req, res, next) {
	db.search(function(items) {
	var content = loadView('sidebar', items);
	res.write('<script>$(".content-sidebar").html(\'' + content + '\');</script>');
	next();
	});
	};

	var renderContent = function (req, res, next) {
	var content = loadView('main', {title: 'Bigpipe!'});
	res.write('<script>$(".content-main").html(\'' + content + '\');</script>');
	next();
	};

	var renderExtra = function (req, res, next) {
	db.slowQuery(function() {
	var extra = loadView('extra', {});
	res.write('<script>$(".content-extra").html(\'' + extra + '\');</script>');
	next();
	});
	};

	var renderBody = function (req, res, next) {
	async.forEach([renderExtra, renderSidebar, renderContent], function(fn, done) {
	fn(req, res, done);
	}, next);
	};

	var renderEnd = function (req, res, next) {
	res.write('</body></html>');
	res.end();
	};

	app.get('/', renderLayout, renderBody, renderEnd );

	app.listen(process.env.PORT \|\| 3000);
	console.log("Express server listening on port " + app.get('port'));
	a.btn.btn-md.btn-primary Test
	a.btn.btn-md.btn-primary Test
	a.btn.btn-md.btn-primary Test
	a.btn.btn-md.btn-primary Test
	a.btn.btn-md.btn-primary Test
	a.btn.btn-md.btn-primary Test
	script(src='http://code.jquery.com/jquery-1.9.0.min.js')
	link(rel='stylesheet', href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css')
	<!--used to over 1k cache in chrome xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx -->
	<!--used to over 1k cache in chrome xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx-->
	nav.navbar.navbar-inverse
	.container
	.navbar-header
	a.navbar-brand Test Bigpipe
	.container
	.row
	.content-sidebar.col-md-3
	.content-main.col-md-5
	.content-extra.col-md-4
	{
	"name": "express-pipe-experiment",
	"version": "0.0.1",
	"private": true,
	"scripts": {
	"start": "node app"
	},
	"dependencies": {
	"express": "3.1.0",
	"jade": "*",
	"async": "~0.1.22"
	},
	"engines": {
	"node": "0.8.x",
	"npm": "1.2.x"
	}
	}