Recommended approach for handling async state management with Payload CMS?

default discord avatar
Jakey
2 months ago
14

My journey of handling state management with Next.js and Payload CMS had me using redux toolkit for state management, then react thunks for async management, then RTK query... but now I see that there's other options like Apollo and such.



I'm finding this whole situation more and more complex and confusing. Any recommendations out there? Or am I on the right path with RTK query at this point?

  • default discord avatar
    noheadphones
    2 months ago

    RTK query sounds like suffering to me, what exactly are you using it for?



    Are you just fetching data then caching it locally for the user?

  • default discord avatar
    Jakey
    2 months ago

    not sure if cache is even that necessary in my app. it's a game that's gonna make frequent calls... which as I type that makes me think I should look into websockets instead



    But just for sake of the question. I would ask what other prefer in terms of getting data from Payload (or any other GQL api) and updating a store (be it redux or another preferred framework).

  • default discord avatar
    noheadphones
    2 months ago

    I strongly recommend

    https://tanstack.com/query/latest

    (and other tanstack tech, really good stuff!



    i use it with rematch

    https://rematchjs.org/

    which kinda simplifies redux a lot and makes it a lot nicer to work with imo



    I also wrote a guide here on how to setup gql codegen with react query for payload

    https://nouance.io/articles/how-to-use-graphql-codegen-with-payload-and-react-query-in-nextjs


    react-query already gives you local caching and control over the interval of re-fetching and w/e you need out of the box



    it also has server side fetching and the ability to use rehydration for that server side fetched data



    so you have a lot of flexibility out of the box in a really easy to use lib



    just make sure you follow its setup steps carefully to get the client setup

  • default discord avatar
    Jakey
    2 months ago

    Btw, this is looking really fantastic. I'm having a team member just swap our redux for rematch on a project. Thanks for the suggestion!

  • default discord avatar
    noheadphones
    2 months ago

    Yeah I've used redux toolkit, jotai and a few others and now im on rematchjs...it still has some problems but overall its much cleaner and still powerful

  • default discord avatar
    Jakey
    2 months ago

    what kind of things have you run into? (so i can prep for it 🙂 )

  • default discord avatar
    noheadphones
    2 months ago

    no problems, more about design philosophy, it still has quite a bit of boilerplate to setup, luckily its pretty simple



    but i wouldnt be able to set it up without ts 😂

Open the post
Continue the discussion in Discord
Like what we're doing?
Star us on GitHub!

Star

Connect with the Payload Community on Discord

Discord

online

Can't find what you're looking for?

Get help straight from the Payload team with an Enterprise License.