CODEWITHSUNDEEP
reactjs
Dvir Naim
Dvir Naim

Reputation: 119

Recoil - single atom vs multiple atoms

I have an index file that contains a lot of atoms for a wizard I've created.

I thought about moving all the creations -

export const foo1State = atom<string>({
    key: "foo1State",
    default: "",
});
export const foo2State = atom<boolean>({
    key: "foo2State",
    default: false,
});

into one using JSON -

    export const fooStates = atom<fooState>({
        key: "fooStates",
        default: {
                     foo1State: string = "",
                     foo2State: boolean = false,
                  }
     });

Is that a better approach? I'll mention that all that inputs are changing frequently so need to consider the renders.

What do you think?

Thanks

Upvotes: 2

Views: 433

Answers (1)

user20386762
user20386762

Reputation: 177

If you have separate atoms for each state, then you can independently subscribe to each one. If you combine them all into one, a component that renders foo1State will re-render every time you update foo2State and vice versa. This can be problematic if the atom gets really big.

If you don't have any particular reason why you would need to hold foo1State and foo2State in single atom, go with your first approach, and keep them in separate atoms.

Upvotes: 3

Related Questions