jeudi 23 janvier 2020

From a network dependant web app to an network independant web app

I'm a full stack web developer and curently I'm mostly building single page app using front end framework such as angular and backend framework such as spring boot.

Usually the design of my web app (let's say it's a CRUD) is as follow : Let's say I'm on the update page and I update an entity. Then a request is made to the backend that update the entity in the database. When the backend respond saying everything is allright your entity has been updated (status code 200) I go through the next page which is the read page with an url such as entityName/{id} where I pass the id of the entity to the next page through the url. Then on the read page I get that id, make a request to the backend, retreive the entity data and display them.

The problem arise when the user lost the connectivity to the internet, so the request to the backend can not be made and consequently data cannot be displayed to the ui or be updated.

An other design would be this one : I'm on the update page and I update my entity. A request is made to the backend but also the state is being kept on the client side. So let's say the connectivity is lost I still can go to the read page and display the updated entity. Moreover as the state / data is kept on the client side I don't have to make that second request to the backend to get the entity from the id since the entity lives on the client side. During the time the user spent on the app the connectivity comes back and the update request is made to the server to synchronize the data in the db and on the client side.

It would seem to me that the second approach is more convenient for the user since the ui does not rely as much on the request made to the backend to display its informations making it more fluent and more agreable.

I very well know that the first approach is in use. I develop like this and so my question is : Is it possible to go from the first design to the second design and if yes with what technologies ?

What I would do to implement the second design would be to share data accross components using services (when implementing with angular). In this way the state of the app can be kept on the client side. But maybe there is a better way. I heard about the NgRx library to manage the state of an application. Is it the right way to go to manage the state of the application on the client side ?

Also there is a second problem that is to make sure that the requests that could not be made when the connectivity was lost is made when the connectivity is back. And so I wonder : Is it possible to use a tool that enable to queue the requests and rerun them when the connectivity is back ? I have notion of progressive web app and service workers but only notion (like I know that a service worker can be used to cache data exchanged with the server) and I wonder if it is a way to solve this problem ?

I'm waiting for your comments on my post. I hope it was not too long. Thanks in advance.




Aucun commentaire:

Enregistrer un commentaire