GitHub - plotnikoff/connect-diffable: Client-side differential patching of static resources implemented for Connect and Node.js

plotnikoff / connect-diffable Public

Notifications You must be signed in to change notification settings
Fork 1
Star 29

Client-side differential patching of static resources implemented for Connect and Node.js

Notifications

Name		Name	Last commit message	Last commit date
Latest commit History 20 Commits
resources		resources
vcdiff.js @ e354e5c		vcdiff.js @ e354e5c
.gitmodules		.gitmodules
LICENSE		LICENSE
README		README
diffable.js		diffable.js
fileResourceManager.js		fileResourceManager.js
requestHandler.js		requestHandler.js

Repository files navigation

Diffable.
"Diffable is a method for reducing page load latency by transmitting 
differential encodings of static files. It works by sending deltas between 
versions of files that reside in a browser's cache. In web applications, files 
such as Javascript, HTML, and CSS are often updated every week or more, but 
change very little between versions. This method significantly reduces the 
bandwidth and transmission time for these files and is implementable on all 
legacy browsers that support Javascript."
How it works and reference Java implementation: http://code.google.com/p/diffable/

Connect-diffable.
Middleware for Sencha's Connect (https://github.com/senchalabs/connect/) stack 
that implements algorithm described in previous section.

Installation.
git clone git://github.com/plotnikoff/connect-diffable.git
cd connect-diffable
git submodule init
git submodule update 

Usage.
require('../connect-diffable/diffable') - Module exports constructor for 
Diffable.

Constuctor accepts configuration object:
{
    'diffableDir' : './diffable',
    'resourceDir' : './static'
}
where 'diffableDir' points to directory where versions and deltas will be kept 
and 'resourceDir' is directory where static files reside.

serve(fileName...) - method returns middleware function for Connect stack and 
adds files passed as parameters to diffable control, so when you change static 
file changes are tracked by middleware and appropriate delta and version files 
are created. Path is relative to 'resourceDir'

Also it is possible to generate docs by running jsdoc-toolkit on diffable.js

Example.
Say we'd like to serve file app.js with diffable.

Simple server that serves static files.

server.js
var Connect = require('connect'), 
    diffable = require('../connect-diffable/diffable'), 
    diff = new diffable({
        'diffableDir' : './diffable',
        'resourceDir' : './static'
    });

module.exports = Connect.createServer(
    diff.serve('/js/app.js'),
    Connect.staticProvider('./static')
);


Also we need to change index.html in which we use this secondary resource:

index.html
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>New Web Project</title>
    </head>
    <body>
        <h1>New Web Project Page</h1>
	{{DIFFABLE res="/js/app.js"}}
    </body>
</html>

Pattern {{DIFFABLE res="/js/app.js"}} will be replaced with javascript that 
will load appropriate version file, delta if necessary and will eval the source.
Html file can contain references to several diffable controled files.