delta-cache-browser

Partially cache dynamic content and send only the changes over the wire.

When used with dynamic content, delta encoding can provide 62%-65% savings for HTML files.

There's no need to change any of your requests - simply include the following code and the service worker will automatically intercept all GET requests on your domain and use delta encoding if available.

Usage

Copy dist/delta_cache_sw.js into your project.

// register the service worker if service workers are supported
if ('serviceWorker' in navigator) {
  // register the service worker (will activate with document reload)
  navigator.serviceWorker.register('delta_cache_sw.js').then(function() {
    console.log('delta cache service worker registered');
  });
}

Browser Support

Delta-Cache relies on services workers, which are currently only supported in Firefox and Chrome.

If service workers are not supported, it will fallback to normal browser control.

Server Support

Works with any RFC 3229 compliant server. The encoding used for the deltas is vcdiff, an efficient and flexible binary delta encoding format.

Server Implementations:

• delta-cache-node
• delta-cache-express (DEPRECATED)

How it Works

All GET requests go through the service worker.

The first time the URL is requested, it will get the content from the server as usual. The service worker will then cache the response, so the next time the same URL is requested, it'll ask the server to use delta encoding. The server then sends the difference between the old and the new file. The service worker will use this delta to compute the new file using the cached version.

Because only the changes are sent from the server, the file sizes are much smaller.

When to Use

Delta encoding works well with content that barely changes, such as server generated templates and some web API endpoints.

Identical Responses

The service worker always returns a response that is identical (including headers) to one without using the service worker. However, the service worker will add a X-Delta-Length header if it uses delta encoding. The value of this header is the integer size of the delta request body (without headers) in bytes.

Demo

npm run-script run-demo

Testing

npm test

This command will open a browser page. Then reload the page. Then, the service worker will install and the Mocha test suite will run. The service worker is automatically removed when the mocha test finishes.

Open chrome://serviceworker-internals/ in Chrome to debug or remove the service worker.