Localstorage Vs Cookies - Performance

Question

Since cookies are server-side and Localstorage is client-side, which is the fastest for the user to retrieve? (ref. Local Storage vs Cookies)

I assume if the client's machine is slow, then cookies are faster? Or that makes no diffrence?

I am using both localstorage & cookies for a project and both are retrieved using jQuery. That means, jquery has to get loaded, then the data is being retrieved.

How can I make this faster? I don't know how both work. For example, some say that Cookies are being retrieved once the HTML is trying to load before the style's and js files and others say when DOM is ready.

Does anyone know accurate details about which is faster for the user to retrieve?

Thank you

Answer 1

Since cookies are server-side and Localstorage is client-side, which is the fastest for the user to retrieve?

You're starting off with an incorrect assumption. Cookies are stored client-side as well. Both localStorage and cookies are stored client side.

The difference however, and that cookies can be set, manipulated from the server side. localStorage is only workable from the client side.

I assume if the client's machine is slow, then cookies are faster? Or that makes no diffrence [sic]?

They are such lightweight operations I wouldn't worry about speed.

Performance between the two is not a factor for choosing one. It's what are your needs.

Cookies:

1. Have worked in browsers for a long time. Every modern, and not so modern, browser support cookies.
2. Can be accessed and manipulated server side.
3. Are typically limited to a few kilobytes, depending on browser.

localStorage:

1. Is a relatively new concept. Not all browsers support it. IE 6, 7 for example, and you're out of luck.
2. Is inaccessible from the server side. You could make an AJAX call back to the server with data that is stored in localStorage.
3. Have a W3C recommendation of being able to store 5 MB.

How can I make this faster?

I don't think either one can directly introduce a performance problem. Other problems, like waiting for the DOM to be in ready state, waiting for script files to load; etc. can introduce slowdowns.

Answer 2

Both cookies and LocalStorage are stored locally on the client. There should be no noticeable difference in how quickly you can read from them.

Cookies do have the disadvantage of being transmitted to and from the server on HTTP requests and responses. This may increase the page size, increasing page load time.

If you are using jQuery to read cookies/LocalStorage, then the browser will have to wait for the jQuery script to be downloaded if it isn't in the browser's cache.