How to implement react-query in this use-case? And how to transition from Zustand to React Query?
Hey folks,
so i'm working on a web application. It is an online editor, for planning templates to use in a digital audio workstation (DAW). by making a list of tracks and giving each track a name and other properties. I'm struggling with how to handle state.
Until now i handled everything locally in a zustand store, with actions for adding/deleting and changing tracks. But of course i want a user to be able to save templates they are working on. It is expected today that apps like these auto-save, so I think auto-saving using debouncing would be best (to reduce db requests).
I kinda don't want to use RQ and just when loading a template it fetching the template from the database and populating the zustand store with it. Then all alterations/actions would happen locally and saving would happen like i explained above.
But now I've read the principle of RQ and seperating server state from client state etc. But most examples that are given are more related to apps where multiple users can fetch the same data. But here, the data is only specific to the user, so I feel like I don't need to worry that much about re-fetching etc. But of course, RQ does handle caching very well.
Would you say in this use case it would make sense to use RQ? Or just fetch the data and handle it all localy?
Secondly, how would I turn Zustand actions into RQ mutations? What is common practice for actions with RQ? Custom hooks? Regular functions?
If you have any questions or need more info to respond properly, or even curious about the repo i have so far, just let me know!
Thomas
1 Reply
deep-jadeOP•3y ago
I think i'll just do it "the easy way" for now and just fetch the data on load, alter it on the client side and "autosave" the template periodically.