localStorage salva dati nel browser che sopravvivono a refresh e riavvii, senza alcun backend. Perfetto per preferenze, temi, bozze, carrelli.
// salva (solo stringhe!)
localStorage.setItem("tema", "dark");
localStorage.setItem("utente", JSON.stringify({ id: 1, nome: "Ale" }));
// leggi
const tema = localStorage.getItem("tema") ?? "light";
const utente = JSON.parse(localStorage.getItem("utente") || "null");
localStorage.removeItem("tema");
Due insidie da ricordare. Primo: memorizza solo stringhe, quindi per oggetti e array passi da JSON.stringify in scrittura e JSON.parse in lettura. Secondo: è sincrono e limitato (circa 5 MB), quindi non ci metti dati enormi.
E soprattutto: niente segreti. Token di sessione, password, dati sensibili non vanno in localStorage: è leggibile da qualsiasi script sulla pagina, e una vulnerabilità XSS li esporrebbe. Per quelli servono i cookie con flag HttpOnly.
Per il resto è oro: un tema che resta scelto, un form che non perde i dati al refresh, una preferenza ricordata. Piccola API, grande comodità.