Cookies :
Pros
– Legacy support (it’s been around forever)
– Persistent data
– Expiration dates
Cons
– Each domain stores all its cookies in a single string, which can make parsing data difficult
– Data is unencrypted
– Cookies are sent with every HTTP request Limited size (4KB)
– SQL injection can be performed from a cookie
Local Storage :
Pros
– Support by most modern browsers
– Stored directly in the browser
– Same-origin rules apply to local storage data
– Is not sent with every HTTP request
– ~5MB storage per domain (that’s 5120KB)
Cons
– Not supported by anything before:
IE 8
Firefox 3.5
Safari 4
Chrome 4
Opera 10.5
iOS 2.0
Android 2.0
– If the server needs stored client information you purposefully have to send it.
Cookies and local storage really serve difference purposes. Cookies are primarily for reading server-side, local storage can only be read client-side. So the question is, in your app, who needs this data — the client or the server?
If it’s your client (your JavaScript), then by all means switch. You’re wasting bandwidth by sending all the data in each HTTP header.
If it’s your server, local storage isn’t so useful because you’d have to forward the data along somehow (with Ajax or hidden form fields or something). This might be okay if the server only needs a small subset of the total data for each request.
Local storage is easier to work with because you don’t have to parse a string to get data. Instead you can make a call for the variable name and it’s value is returned. The same applies with creating and deleting data as well.But until everyone on the Web starts using HTML5-compatible browsers cookies will still be king.
For more information on Cookies read here
For more information on HTML5 Web Storage read here and here.
