Leg uit wat het verschil is tussen cookies, sessionStorage en localStorage.

Mechanisme	Grootte (bij benadering)	Levensduur	Toegang	Wordt naar de server gestuurd	Gebruik
Cookies	4 KB	Vervaldatum ingesteld door server of browser	Huidig document en subdomeinen (afhankelijk van instellingen)	Bij elke HTTP-verzoek	Authenticatie, tracking, aangepaste gebruikersinstellingen
localStorage	5-10 MB	Onbeperkt (zolang de gebruiker niet verwijdert)	Alleen de huidige origin (protocol, domein, poort)	Nee	Opslag van gebruikersvoorkeuren, applicatiestatusgegevens
sessionStorage	5-10 MB	Tot het sluiten van tabblad/venster	Alleen de huidige origin (protocol, domein, poort)	Nee	Tijdelijke opslag van gegevens binnen een sessie van de gebruiker

Cookies:

• Worden bij elke HTTP-verzoek naar de server gestuurd, wat het verkeer kan verhogen.
• Hoofddoel: gebruikersidentificatie (sessie-cookies), voorkeuren onthouden, gebruikersactiviteiten volgen.
• Beschikbaar zowel aan de clientzijde (JavaScript) als aan de serverzijde.
• Kunnen beperkt worden door domein en pad.
• Worden als minder veilig beschouwd voor het opslaan van gevoelige gegevens vanwege automatische verzending naar de server.

localStorage:

• Gegevens worden lokaal opgeslagen in de browser van de gebruiker.
• Gebruikt voor permanente opslag van gegevens die niet bij elk verzoek naar de server hoeven.
• Heeft een eenvoudige JavaScript API.
• Gegevens worden opgeslagen als sleutel-waardeparen.
• Niet toegankelijk vanaf andere origins.

// Waarde instellen
localStorage.setItem('username', 'john.doe');

// Waarde ophalen
let username = localStorage.getItem('username');

// Waarde verwijderen
localStorage.removeItem('username');

// Alles wissen in localStorage
localStorage.clear();

sessionStorage:

• Vergelijkbaar met localStorage, maar gegevens worden alleen opgeslagen tot het sluiten van het huidige tabblad of venster.
• Ideaal voor tijdelijke opslag van gegevens gerelateerd aan de huidige sessie van de gebruiker (bijvoorbeeld formuliergegevens, winkelwagen).
• Heeft ook een eenvoudige JavaScript API, vergelijkbaar met localStorage.
• Gegevens zijn alleen beschikbaar binnen de huidige origin.

// Waarde instellen
sessionStorage.setItem('sessionId', 'abc123');

// Waarde ophalen
let sessionId = sessionStorage.getItem('sessionId');

// Waarde verwijderen
sessionStorage.removeItem('sessionId');

// Alles wissen in sessionStorage
sessionStorage.clear();