- HTML Tutorial
- HTML - Home
- HTML - Overview
- HTML - Basic Tags
- HTML - Elements
- HTML - Attributes
- HTML - Formatting
- HTML - Phrase Tags
- HTML - Meta Tags
- HTML - Comments
- HTML - Images
- HTML - Tables
- HTML - Lists
- HTML - Text Links
- HTML - Image Links
- HTML - Email Links
- HTML - Frames
- HTML - Iframes
- HTML - Blocks
- HTML - Backgrounds
- HTML - Colors
- HTML - Fonts
- HTML - Forms
- HTML - Embed Multimedia
- HTML - Marquees
- HTML - Header
- HTML - Style Sheet
- HTML - Layouts
- HTML References
- HTML - Tags Reference
- HTML - Attributes Reference
- HTML - Events Reference
- HTML - Fonts Reference
- HTML - ASCII Codes
- ASCII Table Lookup
- HTML - Color Names
- HTML - Entities
- HTML - Fonts Ref
- HTML - Events Ref
- MIME Media Types
- HTML - URL Encoding
- Language ISO Codes
- HTML - Character Encodings
- HTML - Deprecated Tags
How to use HTML5 localStorage and sessionStorage?
HTML5 introduced two mechanisms, similar to HTTP session cookies, for storing structured data on the client side and to overcome the following drawbacks.
- Cookies are included with every HTTP request, thereby slowing down your web application by transmitting the same data.
- Cookies are limited to about 4 KB of data. Not enough to store required data.
The two mechanisms for storage are session storage and local storage and they would be used to handle different situations.
The Session Storage is designed for scenarios where the user is carrying out a single transaction but could be carrying out multiple transactions in different windows at the same time.
You can try to run the following to set a session variable and access that variable
The Local Storage is designed for storage that spans multiple windows and lasts beyond the current session. In particular, Web applications may wish to store megabytes of user data, such as entire user-authored documents or a user's mailbox, on the client side for performance reasons.
You can try to run the following code to set a local storage variable and access that variable every time this page is accessed, even next time when you open the window.
- Related Articles
- How to store objects in HTML5 localStorage?
- Can a user disable HTML5 sessionStorage?
- How to store data in the browser with the HTML5 localStorage API?
- How to use drag and drop in HTML5?
- How to properly use h1 in HTML5?
- How to use SVG images in HTML5?
- How to use images with HTML5 canvas?
- How to use geolocation coordinates in HTML5?
- How to use HTML5 Geolocation Latitude/Longitude API?
- HTML Window sessionStorage Property
- How to use GoJS HTML5 Canvas Library for drawing diagrams and graphs?
- How to find the size of localStorage in HTML?
- How to use multiple click event on HTML5 canvas?
- How to use HTML5 GeoLocation API with Google Maps?
- How to we use global translate attribute in HTML5?