HTML and CSS Reference
In-Depth Information
FIGURE 7.2
My time
application continues to work
while offline, pulling a different
resource for the server-time
JavaScript file.
Finally I've included a comment in the fi le, starting with the
#
symbol (note that comments must be on their own line, too).
This tells me the version number. This is important to cachebust
the manifest.
This doesn't have to be a number or anything in particular, but
to tell the browser to reload the contents of the manifest you
need to change the contents of the fi le, and not just the time-
stamp, to force a reload. I'm using a version number here, this
could be a revision ID from your favourite revision control sys-
tem, or it could be a datetime stamp, or something that's unique
and changes when you need to reload.
In addition to the
CACHE
and
FALLBACK
categories, there's the
NETWORK
category, which I've not needed in my example. The
NETWORK
category is a “whitelist” category, telling the browser
that all requests to fi les or paths in this category must go via the
Web and must not be cached. For example
NETWORK:
live-time.php
/realtime-stuff/
tells the browser that it must be on the Web to access
live-time.php
but also anything that matches the absolute path
of
http://mysite.com/real-timestuff/
. Equally, you can use
the
NETWORK
category to explicitly state that anything that isn't
cached must go via the web by using a wildcard
*
(note that this
is the default behaviour if omitted):
CACHE MANIFEST
index.html
time.js
time.css
NOTE
Cachebusting
means to use forceful
technique to prevent the
resource from being cached.
In the example of the manifest,
this is achieved by changing
its contents.
NOTE
Browsers like the
manifest and don't let go
of their cache easily. Make sure
you include a comment that has
a version number, revision, or
timestamp that you can change
and force an update to the
browser's manifest.
FALLBACK:
server-time.js fallback-server-time.js
NETWORK:
*
# version 10
