In a previous post, I mentioned HTML5 storage. I then went on to talk about cookies. I mentioned that I have gone away from using cookies to using HTML5 storage. It is not that cookies are bad, but HTML5 storage is so much easier and has advantages that I like better than cookies. So what are some of those advantages?
- More secure
- Faster
- Not included in every server request (makes app faster)
- Store larger amounts of data
- Data is stored in key/value pairs…easier for programming
There are two types of HTML5 storage…
- Local – lasts beyond the current browser session
- Session – goes away once the current browser session is over
Note: While all modern browsers use HTML5 storage, it is probably a good idea (depending on what environments you are supporting) to test for HTML5 storage capability. So how do we do that?
[code lang=”js”]
If(typeof(Storage) !== "undefined"){
// We can use HTML5 storage because it is not undefined
}
[/code]
So how do we use storage?
[code lang=”js”]
// Example of storing a last name in HTML5 local storage
localStorage.lastname = "Doe"
[/code]
So, we now have the last name of “Doe” stored in an HTML5 local storage variable entitled, ‘lastname’. So how do we retrieve it? We can use dot object notation…
[code lang=”js”]
// This code will pull the last name of ‘Doe’ from storage and alert it
alert(localStorage.lastname);
[/code]
This has been simply an introduction to HTML5 storage. I will be doing further posts giving other examples.
Happy Coding!
Clay Hess