3 ms·
The 'happy path' (everything goes right) is easy, as you said. The hard part for me was making sure the state in the client is always in sync with server, in a
by hakanderyal 11y ago
The 'happy path' (everything goes right) is easy, as you said.
The hard part for me was making sure the state in the client is always in sync with server, in a valid state, even when things go wrong.
On a slow connection, another update made by someone else to board may arrive between the optimistic client update and the server confirmation, which can lead to a broken state on client.
Or, user may do an update on the optimistically added card, like editing, while the first action is not confirmed by the server yet. You either need to queue these actions, or generate the id of the card on client side. And you need to have reliable 'rollbacks' on the client when server rejects the action for some reason.
There are many more edge cases like that. I've solved all these problems eventually, but it took much more time for me than building the happy path.
- eric_bullington 11y ago> And you need to have reliable 'rollbacks' on the client when server rejects the action for some reason....'ve solved all these problems eventually, but it took much more time for me than building the happy path. I'm sure you figured this out, but having an immutable data structure at the root of your React application is great for rollbacks. And then maintain an array with a reference to the various data structures, however deep you need (within reason), and pop or push them as needed to rollback/roll forward.
- hakanderyal 11y agoYes, I'm using Redux, and never modify the state. But I also needed to rollback only the rejected action, and keep the rest of the actions that user did after the rejected action intact. That presented a whole lot of different edge cases. I created a solution based on redux-optimist[1], modified to my apps specific needs. [1]: https://github.com/ForbesLindesay/redux-optimist https://github.com/ForbesLindesay/redux-optimist