Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Offline support with service worker #978

Open
wants to merge 22 commits into
base: main
Choose a base branch
from
+8,261 −1
Open

Offline support with service worker #978

Changes from 1 commit
Commits
Show all changes
22 commits
Select commit Hold shift + click to select a range
85a014b
feat: support offline with service worker
xtuc Nov 15, 2016
1bd6f2d
refactor(offline): use sw-toolbox
xtuc Nov 21, 2016
ef6d78b
fix(sw): removed pre-cached CSS
xtuc Nov 21, 2016
2d6207d
feat(sw): add external cache origins
xtuc Nov 21, 2016
2936fad
feat(sw): add cache version
xtuc Nov 21, 2016
53458ba
feat(sw): offline indicator
xtuc Nov 21, 2016
49ca43f
Merge remote-tracking branch 'upstream/master'
xtuc Nov 23, 2016
39b7233
fix(sw): remove Algolia response cache
xtuc Nov 24, 2016
3e0ba2e
fix(sw): limit cache and cache only doc
xtuc Nov 24, 2016
e8ff8b1
feat(sw): separe content and cdn cache
xtuc Nov 25, 2016
c79524c
fix(sw): update cache strategies
xtuc Nov 26, 2016
1e75370
feat(sw): improved offline indicator
xtuc Nov 26, 2016
ae14615
fix(sw): remove site precaching
xtuc Nov 27, 2016
5ce2a31
Merge remote-tracking branch 'upstream/master'
xtuc Nov 27, 2016
ac3f4dc
lint: use single quotes
xtuc Nov 29, 2016
25e916d
Update service-worker.js
xtuc Dec 3, 2016
c8f206f
Resolved conflicts
thenamankumar Nov 4, 2017
d32e376
Imported sw-toolbox from unpkg
thenamankumar Nov 5, 2017
687842e
Added Offline.md page
thenamankumar Nov 6, 2017
7c90808
Made Cache Pattern Network First
thenamankumar Nov 11, 2017
6d557eb
Made multiple var declarations
thenamankumar Nov 13, 2017
18d2580
Removed sw-toolbox.js
thenamankumar Nov 13, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 11 additions & 7 deletions service-worker.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,15 @@

importScripts('/scripts/sw-toolbox.js');

const VERSION = '{{ site.time }}';
var VERSION = '{{ site.time }}';

toolbox.cache.name = "Babel-Cache-" + VERSION;
toolbox.cache.maxEntries = 150;
toolbox.cache.maxAgeSeconds = 604800;
var contentCacheOptions = {
cache: {
name: "Babel-Cache-" + VERSION,
maxEntries: 150,
maxAgeSeconds: 604800
}
}

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It'll be good to use a versioned cache name.

const VERSION = 1;

toolbox.cache.name = "Babel-Cache-" + VERSION;

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Also,

toolbox.cache.maxEntries = 20 // or 15

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, I will add cache versioning.

What do you think about a max age ? Like 7 days ?

I don't know if limiting entries is a good idea. I pre-cache already all pages.

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

TL for sw-toolbox and sw-precache here. Great to see you using it :)

If you're going to set maxEntries to 20, it means that after the 21st entry is cached, the least-recently used entry would be automatically deleted. Unless you're storing a number of really large assets, I'd consider whether this is really that valuable. I don't think the Babel site would benefit from setting this all that much.

I do think there's use in imposing a maxAgeSeconds age. @boopathi can probably comment to the length of time, but a week doesn't sound like a bad ballpark.

var preCachedRessources = [
{% for page in site.pages %}
Expand All @@ -17,7 +21,7 @@ var preCachedRessources = [

toolbox.precache(preCachedRessources);

toolbox.router.get('/*', toolbox.cacheFirst);
toolbox.router.get('/*', toolbox.cacheFirst, { origin: "cdnjs.cloudflare.com" });
toolbox.router.get('/*', toolbox.cacheFirst, { origin: "cdn.jsdelivr.net" });
toolbox.router.get('/*', toolbox.cacheFirst, contentCacheOptions);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

networkFirst or fastest - cacheFirst is never going to hit the network after first time.

toolbox.router.get('/*', toolbox.cacheFirst, { origin: "cdnjs.cloudflare.com", name: "cdn" });
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this should be { cache: { name: "cdn" } }

toolbox.router.get('/*', toolbox.cacheFirst, { origin: "cdn.jsdelivr.net", name: "cdn" });
toolbox.router.get('/*', toolbox.cacheFirst, { origin: "unpkg.com" }); // for repl