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.

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

Support offline access + caching using Service Workers #100

Closed
KyleAMathews opened this issue Dec 6, 2015 · 10 comments
Closed

Support offline access + caching using Service Workers #100

KyleAMathews opened this issue Dec 6, 2015 · 10 comments

Comments

@KyleAMathews
Copy link
Contributor

KyleAMathews commented Dec 6, 2015

https://medium.com/google-developers/instant-loading-web-apps-with-an-application-shell-architecture-7c0c2f10c73#.d8r14ktfw

It'd would be really cool if Gatsby could support this architecture by default. Service workers are supported by ~50% of browsers now and this would make the initial paint instant for Gatsby sites on subsequent loads.

Not 100% sure how this would work though. It'd be a great research project if someone wants to investigate.

Some more readings:

@knpwrs
Copy link
Contributor

knpwrs commented Dec 9, 2015

As mentioned in #10, it's probably worth looking into offline-plugin.

@phlogisticfugu
Copy link
Contributor

Isn't the time-to-first-paint even better, however, if the main above the fold content of the page is in plain HTML?

That "static site" part of gatsby seems to be even simpler and faster than reading data from cache via service workers, and then injecting that into the page via JS execution. Plus plain static site content can also be saved offline naturally

@KyleAMathews
Copy link
Contributor Author

@knpwrs woah, offline-plugin looks perfect. I keep underestimating Webpack :) I hadn't thought to go looking for a plugin like this but now that I see it, it makes perfect sense.

@phlogisticfugu quite possibly! This is something we need to research a lot more I think to understand options/tradeoffs. 💯 to everyone who wants to play around with this and build a sample site and report back.

@gesposito
Copy link
Contributor

@KyleAMathews KyleAMathews changed the title Support instant loading application shell architecture Support caching using Service Workers Dec 28, 2015
@KyleAMathews
Copy link
Contributor Author

Been reading + thinking more about services workers. Current thought is best plan is a) finish #27 and then b) just add a simple pass-through cache for html and cache forever static assets. This is safe since all js, css, other static assets will have unique names.

To get true offline support working, will probably need a fallback html file which will load and render the site using the latest JS bundle.

@KyleAMathews KyleAMathews changed the title Support caching using Service Workers Support offline access + caching using Service Workers Dec 30, 2015
@addyosmani
Copy link
Contributor

Glad to see the application shell architecture being considered here. If y'all run into any challenges implementing and have questions feel free to reach out.

@KyleAMathews
Copy link
Contributor Author

@addyosmani thanks Addy! We really appreciate the offer. I've learned a ton from y'all's work there at Google and looking forward to incorporating ideas from App Shell/AMP/PWAs into Gatsby.

@KyleAMathews
Copy link
Contributor Author

KyleAMathews commented May 14, 2016

So interesting idea I just had heard. One way to use Service Workers + code splitting is that every page has a separate bundle. But then when creating the service-worker file, we first analyze the link structure of the site so that whatever page you land on, you initially load just that pages JS bundle but then the service worker async loads and caches the bundle for every page that page links to. So clicking around the site should be very fast with resources prefetched but the initial fetching remains as small/fast as possible. This could be configurable so say if the user is on a mobile network, you don't prefetch.

Relevant https://twitter.com/slightlylate/status/731203821335023616

@KyleAMathews
Copy link
Contributor Author

This would be sick (though probably create really big build times) https://github.com/gmetais/sw-delta

@KyleAMathews
Copy link
Contributor Author

Offline + caching is coming to 1.0! Plan is to turn them on by default. Wrote up plans at #431

Closing this issue in favor of that one.

pragmaticpat pushed a commit to pragmaticpat/gatsby that referenced this issue Apr 28, 2022

Unverified

This user has not yet uploaded their public signing key.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants