connect-diffable/README at master · plotnikoff/connect-diffable · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
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 (http://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.