Platform: Rehydrate on browser refresh

[axtho]

I'm submitting a...

[ ] Regression (a behavior that used to work and stopped working in a new release)
[ ] Bug report  
[ ] Feature request
[x] Documentation issue or request

What is the current behavior?

A browser refresh is quite common during development. Each time this happens the App needs to be rehydrated. But what is the best way to do this?

Currently the developer does not have a clear indication on how to rehydrate his store data. In my case I am redirecting everything to the login component which then re-fetches the data out of the db. It works ok, but is annoying as it always loads the login screen and then returns to whatever url is next (mostly /).

The demo app has ngrx/db, which could serve as a local store which can be used to rehydrate without needing to reselect the entire lot.

Then there is Bryan Troncone's ngrx-localstorage, which does some sort of automatic mapping.

Expected behavior:

Ideally a browser refresh should return you to the same page you are on, with all the latest (or last) store rehydrated.

It would be great to have this as a doc/ wiki here, since (I am guessing) this issue surfaces often.

Minimal reproduction of the problem with instructions:

none

Version of affected browser(s),operating system(s), npm, node and ngrx:

Other information:

[bmayen]

Last I checked, ngrx-localstorage does not work with lazy-loaded modules. ngrx/db was not pulled under platform and appears to be stalled. This does seem like a major piece of missing functionality and would be great to get an official word on it. I know there are people commenting in the ngrx/db issues that they'd like to contribute to move the effort forward, but kind of in the dark on where it stands in general.

FWIW, we have a global REHYDRATE action but it feels pretty hacky :)

[dinvlad]

ngrx-store-localstorage does work great, unless you need to lazy-load parts of your state (even then I'm not sure you can't get it working). You can even sync state between different tabs using something like https://github.com/btroncone/ngrx-store-localstorage/issues/40#issuecomment-336283880.

Another consideration is to always make your Router the source of truth, so that on page refresh you get most (if not all) of the parameters needed to render this page from the url (see https://blog.nrwl.io/using-ngrx-4-to-manage-state-in-angular-applications-64e7a1f84b7b for more on that).