Use HTML 5 to enable local storage of mobile Web applications, htmlweb

Source: Internet
Author: User

Use HTML 5 to enable local storage of mobile Web applications, htmlweb

 

One of the most useful new features in HTML 5 is the standardization of local storage. In the end, Web developers can no longer try to pack all client data into 4 KB Cookies. Now you can use a simple API to store a large amount of data on the client. This is a perfect cache mechanism that can greatly increase the speed of applications-speed is a crucial factor for mobile Web applications, because they are relative to desktop applications, depends on a much slower connection. In this second article on HTML 5, we will learn how to use local storage, how to debug it, and how to use it to improve Web applications.
Local Storage Basics
Web developers have been trying to store data on clients for years. HTTP Cookies are abused for this purpose. Developers place a large amount of data on the 4KB allocated by the HTTP specification. The reason is simple. For various reasons, interactive Web applications need to store data, which is usually inefficient, insecure, or inappropriate on servers. Over the years, there have been several alternatives to this problem. Various browsers have introduced proprietary storage APIs. Developers also use the extended storage feature in Flash Player (implemented through JavaScript ). Similarly, Google has created the Gears plug-in for various browsers and contains storage APIs. Not surprisingly, some JavaScript libraries try to smooth these differences. In other words, these libraries provide a simple API and then check which storage functions are available (either a private browser API or a plug-in such as Flash ).
Fortunately for Web developers, the HTML 5 specification eventually contains a standard for local storage and is implemented by a wide range of browsers. In fact, this standard is the fastest to be adopted and is supported in the latest versions of all major browsers: Microsoft®, Internet Explorer®Mozilla Firefox, Opera, Apple Safari, and Google Chrome. More importantly for mobile developers, it is used in WebKit-based browsers (such as iPhone and mobile phones using Android (Version 2.0 or later) and other mobile browsers (such as Mozilla's Fennec. Remember this. Let's take a look at this API.

Http://html5.662p.com/thread-50-1-1.html


How does html5 web storage address local cache?

There is a specification called Application Cache, which specifically solves the problem of local Cache. If you are interested, you can search for related introductions on the Internet.
Reference: Tianyi space application Factory
 
How to Set Up html5 Local Storage

You can use JavaScript to access HTML5 Storage and use the localStorage object of the global window object. Before using it, we need to first check whether it is available:

Function supports_html5_storage (){
Try {
Return 'localstore' in window & window ['localstore']! = Null;
} Catch (e ){
Return false;
}
}

HTML5 Storage is based on key-value pairs. The data you want to store must have a name as the key, and then you can use this key to read the data. This key is a string; data can be any data type supported by JavaScript, including strings, Boolean values, integers, and floating-point numbers. However, we usually store data as strings. If you store and read non-string data, you have to use functions like parseInt () or parseFloat () to convert the number to the required JavaScript data type.

Var foo = localStorage. getItem ("bar ");
//...
LocalStorage. setItem ("bar", foo );
You can also write it as follows:

Var foo = localStorage ["bar"];
//...
LocalStorage ["bar"] = foo;

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.