Você precisa persistir algo no navegador. Como escolhe entre localStorage, sessionStorage, cookies e IndexedDB?

Use cookies apenas quando o servidor precisa do valor em toda requisição, e defina HttpOnly, Secure e SameSite para qualquer coisa sensível. Use sessionStorage para estado que deve morrer com a aba, localStorage para dados chave valor pequenos e síncronos que sobrevivem a reinícios, e IndexedDB para qualquer coisa grande, estruturada ou assíncrona. Nunca guarde tokens ou dados pessoais no localStorage, já que qualquer script na página consegue ler.

Minha primeira pergunta é se o servidor precisa daquilo. Se precisa, é cookie, e leva HttpOnly, Secure e SameSite, o que também significa que não é algo que meu JavaScript lê. Se só o cliente precisa, aí depende de tempo de vida e tamanho. sessionStorage para coisas com escopo de aba, como o passo de um wizard ou uma posição de scroll que não quero vazando para outra aba. localStorage para preferências duráveis e pequenas, tema, último filtro usado, esse tipo de coisa, e mantenho pequeno porque é síncrono, então um JSON grande sendo parseado na inicialização aparece direto no meu time to interactive. IndexedDB quando o dado é grande ou estruturado, por exemplo uma lista de registros em cache para uso offline, normalmente atrás de um wrapper pequeno porque a API crua é desagradável. A regra que eu não flexibilizo é que tokens de acesso não vão para o localStorage, porque qualquer script injetado consegue lê los; esses vivem num cookie HttpOnly ou apenas em memória.