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

AppCache / ServiceWorker support #192

Closed
NekR opened this Issue Jul 25, 2016 · 10 comments

Comments

Projects
None yet
5 participants
@NekR

NekR commented Jul 25, 2016

Do you need AppCache / ServiceWorker support in this project? I wrote a offline-plugin for webpack and it's currently used in react-boilerplate. If you think it would be good to have "offline" support in this project, I will send a PR for it.

Thanks.

@gaearon

This comment has been minimized.

Member

gaearon commented Jul 25, 2016

What would adding such support entail from user’s point of view? Would we have to generate some files by default that are not used in most apps? Or can those files be optional?

@NekR

This comment has been minimized.

NekR commented Jul 25, 2016

If by user you mean a user of this project (developer), then for them it means that their app this work offline by default. Of course, if the app is complicated than a static website, then it doesn't mean full offline capability, but rather caching of the app and its assets (all output of webpack).

I don't want to came here and just promote usage of offline-plugin or something like that, so I'm going to list possible disadvantages of its usage too:

  • It might be complicated. For project where you cannot change the config we have to carefully configure everything in offline-plugin.
  • It's hard to get working with CDNs. It's possible, but not trivial and may require dancing with CDN headers.
  • App won't be updated right away. ServiceWorker has very unnatural update flow, at least for devs who see it first, maybe because they expect it to work as AppCache. In general, usage of AppCache/SW means that your app will be update on next visit, which might not be suitable for some apps. There is a way to force update though.
  • There probably are others, I just cannot remember all of them right now.

Would we have to generate some files by default that are not used in most apps? Or can those files be optional?

Not sure I get the question, but yes, offline-plugin generates some files. Those files are ServiceWorker's JS file and AppCache's manifest & html page. Those files of course cannot be optional if you use those technologies, but if your don't use AppCache for example, its files aren't generated.

Also usage of offline-plugin requires this like of code to be added in some JS / HTML file:

require('offline-plugin/runtime').install();

If it will be the issue, I think it's possible to make plugin auto-attach runtime to the main entry of webpack.

@NekR

This comment has been minimized.

NekR commented Jul 25, 2016

Oh, one more thing, it cannot work fine with Hot Reloading :-)

@sejoker

This comment has been minimized.

sejoker commented Jul 26, 2016

IMO, adding ServiceWorker support in the app is too specific to make it enabled by default.create-react-app should allow integrating nicely with different libraries be it offline-plugin or google-precache but not forcing a user into how it should be implemented.

@jeffposnick

This comment has been minimized.

Contributor

jeffposnick commented Jul 27, 2016

I work on the team at Google that develops the sw-precache and sw-toolbox libraries, which are similar in scope (though implemented differently) than the offline-plugin project that @NekR maintains. Hopefully this does not come across as upstaging @NekR's request, but creating a separate issue and having a parallel discussion there doesn't make much sense.

We had a similar question about how open the maintainers of this project would be to integration. To give an example of what that might look like, a member of the community, @localnerve, developed https://github.com/localnerve/react-pwa-reference as a boilerplate React project with those libraries baked in.

If your preference is to keep what ships by default minimal, or if you'd prefer default integration with another library like offline-plugin, we could focus on providing guidance in our own documentation, explaining how developers who start with create-react-app can explicitly add and configure sw-precache after the fact.

CC: @addyosmani

@NekR

This comment has been minimized.

NekR commented Jul 27, 2016

I'm actually completely fine with using sw-* tools. My intention here is to popularize SW and enable it in popular boilerplate / generator. So if one tool makes sense than another, then it should be used.

@sotojuan

This comment has been minimized.

Contributor

sotojuan commented Jul 29, 2016

I love offline-plugin and it's actually my favorite Webpack plugin (it just works with no config) but it's a bit out of scope for this project.

Also here's a funny story: the first time I used offline-plugin I didn't know I was using it (either because it wasn't documented or I just skipped it). I eventually stopped the app I was working on, but for a few days I was wondering why every time I started something on port 3000 the app I was working on days before came up 😅 It was because it was cached in Chrome!

Anyway, that's something that may happen to others.

@gaearon

This comment has been minimized.

Member

gaearon commented Jul 29, 2016

Thank you for the suggestion!
We’ll evaluate this after more basic features are in place.
Let’s keep this open for now.

@jeffposnick

This comment has been minimized.

Contributor

jeffposnick commented Aug 11, 2016

As an exercise, I put together a repo that illustrates the modifications needed "Progressive Web App-ify" the create-react-app output, assuming sw-precache is used to generate the service worker.

There are details in https://github.com/jeffposnick/create-react-pwa/blob/master/README.md and a rundown of the (minor!) changes that were needed can be found in the diff: jeffposnick/create-react-pwa@starting-point...pwa

I'll probably spread the word a bit via my personal blog in case there are other folks who want to manually make those changes to their local create-react-app output.

@gaearon gaearon added this to the 1.0.0 milestone Sep 23, 2016

@jasanst jasanst referenced this issue Nov 22, 2016

Closed

PWA features #1086

@gaearon

This comment has been minimized.

Member

gaearon commented Nov 22, 2016

A new discussion here: #1086 (comment)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment