Best way to persist state in React?
Unanswered
Acacia-ants posted this in #help-forum
Acacia-antsOP
I'm currently building a search page and I want the filters to persist on forward/back/refresh.
The way I'm doing this at the moment is to store everything in local storage but it seems to cause a lot of main thread work... I think because each trip to local storage is blocking?
Is there a better way?
The way I'm doing this at the moment is to store everything in local storage but it seems to cause a lot of main thread work... I think because each trip to local storage is blocking?
const [keyword, setKeyword] = useLocalStorage<Keyword[]>({
key: "talentKeyword",
defaultValue: initialKeyword,
});
const [country, setCountry] = useLocalStorage<CountryOrTimezone[]>({
key: "talentCountry",
defaultValue: initialCountry,
});
const [sort, setSort] = useLocalStorage<TalentSortOptionKeys>({
key: "talentSort",
defaultValue: "relevant",
});
const [talentData, setTalentData] = useLocalStorage({
key: "talentData",
defaultValue: [initialData],
});
const [sizeData, setSizeData] = useLocalStorage({
key: "talentPageIndex",
defaultValue: 1,
});Is there a better way?
4 Replies
Acacia-antsOP
Ah yep, that makes sense...Thanks @joulev 🙂 I assume this advice still holds when you have a lot of different filters that can have multiple things chosen from each filter?
yes
add as many search params as you wish