Web Storage API
Web Storage keeps small string values in the browser. It can remember a harmless preference, but it is not a private vault or a guaranteed permanent database.
How it works
- localStorage is scoped by origin and can survive page reloads and ordinary sessions. sessionStorage is also tied to the tab’s page session. Users or browsers can clear either.
- Store strings directly and serialise structured values with JSON when appropriate. Storage operations are synchronous, so avoid large or frequent blocking writes.
- Access can fail because of privacy settings, quotas, or document restrictions. Handle errors and do not store secrets or authentication credentials as a casual preference.
A practical example
<p id="storage-status" role="status"></p>
<script>
const status = document.getElementById('storage-status');
try {
localStorage.setItem('workshop-theme', 'system');
status.textContent = 'Preference: ' + localStorage.getItem('workshop-theme');
} catch {
status.textContent = 'Preferences cannot be saved in this browser context.';
}
</script>
In a normal allowed origin, the harmless preference is stored as a string. Restricted frames and some browser settings can make the fallback message appear instead.