Current Stack: Angular 1.6, BreezeJS (to handle offline/online), .net web api, azure sql
Moving to Stack: Angular 5, NgRx (to handle offline/online), .net core Web API, Azure SQL
Background: I have a web application that has to work offline/online. While users are in a connected environment, I use web workers to pull down the most recent data for the projects that they are working on and store that data in local storage. When they go offline, I push/pull data from that local storage to allow the user to work offline. Right now, the system is built using Angular 1.6 and BreezeJS handles the metadata entities while offline and the subsequent syncing once back online. This has worked well because BreezeJS does a great job handling all the offline metadata and subsequent syncing pretty transparently and consistently.
I need to upgrade the system to Angular 5 and I want to remove BreezeJS from the stack (mainly because they dont have a typescript update built for Angular and there doesnt seem to be any plan to create one) but I'm not sure how to handle the offline data and the syncing of offline data to online. The plan I have currently has NgRx take the place of BreezeJS.
I was thinking of using Service Worker to dump requests to a locally stored queue when offline while updating the current store (using ngrx via a distinct action that will denote the record as unconfirmed) no matter what. Then when the user comes back online, I run the queue of requests and then update the user's local store as responses come in as normal. I would also update my web workers so that they push actions upon data retrieval that update the ngrx store which then subsequently dumps its contents to local storage so that it's ready for offline use when that need arises.
Question: I've realized that I'm essentially forcing NgRx to work both offline/online. Is this good usage of the NgRx library or is this taking that library out of context and using it for something that it was never intended for?
Is there an existing production ready and maintained library that is built to handle offline data and syncing in Angular applications?
THanks in advance for any help.
Whoa. Much that is wildly incorrect here.
BreezeJS works great with all versions of Angular. It was re-coded in TypeScript and is now maintained as a TypeScript library. We use it extensively in our practice, building large, enterprise apps in the latest Angular versions. And it is maintained by its original authors.
I ought to know. I’m a founder and the current president of IdeaBlade, the makers of Breeze.
I also know a lot about ngrx. You can serialize the state of the store and restore it but it won’t be trivial to do so and isn’t as easy as with the Breeze entity cache. You could try capturing the stream of actions and replaying them. That will be fraught with difficulty too.
You do not sound like someone who has tried ngrx to manage entities. That is a daunting task for any but the smallest entity models. You better study a bit before you take that leap. I say this as someone who is pioneering a library to make ngrx entity management easier (lookup ngrx-data).
But the most important barrier IMO is the utter lack of support for entity relationships in ngrx or redux, something essential to relational entity models and something which is one of the Breeze core strengths.
If you are used to Breeze, look very, very carefully before you ditch it.