Tip 46: Maintain State Over Time with LocalStorage

Preserving user data

Users love to personalize applications. Conversely, they hate entering the same data every time they visit an app or a page. When you’re working with front-end JavaScript, you’re in a bit of a bind. How do you preserve user data with minimal interference?

An obvious solution is to create a login. The problem is that many users will abandon a site if they’re forced to log in. A better, albeit imperfect, solution is to store data locally. When you save data locally, you can preserve information on a particular browser on a particular device.

Of course, everyone uses multiple devices. So saving data to a browser won’t help a user who works across multiple devices. Still, it’s far less intrusive than demanding a user make yet another account.

Using localStorge to store user data

You can easily save user information with localStorage. localStorage is like a tiny database that exists only ...