Yes! HTML5 is designed, as much as possible, to be backward compatible with existing web browsers. New features build on existing features and allow you to provide fallback content for older browsers.
HTML5 is the next version of HTML 4.01, XHTML 1.0 and DOM Level 2 HTML. Its aim to reduce the need for proprietary plug-in-based rich internet application (RIA) technologies such as Adobe Flash, Microsoft Silverlight etc.
|Client side / Server side.||Data accessible both at client side and server side. Cookie data is sent to the server side with every request.||Data is accessible only at the local browser side. Server cannot access local storage until deliberately sent to the server via POST or GET.|
|Size||4095 bytes per cookie.||5 MB per domain.|
Cookies have following drawbacks-
Cookies are included with every HTTP request, thereby slowing down your web application by transmitting the same data.
Cookies are included with every HTTP request, thereby sending data unencrypted over the internet.
Cookies are limited to about 4 KB of data . Not enough to store required data.
HTML5 is the proposed next standard for HTML 4.01, XHTML 1.0 and DOM Level 2 HTML. It aims to reduce the need for proprietary plug-in-based rich internet application (RIA) technologies such as Adobe Flash, Microsoft Silverlight, Apache Pivot, and Sun JavaFX.
HTML5 offers two new objects for storing data on the client:
LocalStorage - stores data with no time limit
SessionStorage - stores data for one session.The data is deleted when the user closes the browser window.
Cookies are small text files that websites place in a browser for tracking or login purposes. Meanwhile,
sessionStorage are new objects,
both of which are storage specifications but vary in scope and duration. Of the two,
localStorage is permanent and website-specific whereas
sessionStorage only lasts as long as the duration of the longest open tab.
The Application Cache concept introduced by HTML5 means that a web application is cached, and accessible without an internet connection.
There are three advantages of Application Cache:
1. Offline browsing - Users can use the application when they're offline
2. Speed - Cached resources load faster
3. Reduced server load - The browser will only download updated/changed resources from the server
A Manifest file is a simple text file that tells the browser what to cache and what not to cache.
There are three sections of a Manifest file:
1) CACHE MANIFEST - Files listed here are cached after they are downloaded for the first time.
2) NETWORK - Files listed here require a connection to the server, and are never cached.
3) FALLBACK - Files listed here specify fallback pages if a page is inaccessible.
Along with HTML5, WHATWG Web Applications 1.0 introduces events which flow from web server to the web browsers and they are called Server-Sent Events (SSE).
Using SSE you can push DOM events continously from your web server to the visitor's browser.
The event streaming approach opens a persistent connection to the server, sending data to the client when new information is available, eliminating the need for continuous polling.
Server-sent events standardizes how we stream data from the server to the client.
To use Server-Sent Events in a web application, you would need to add an < eventsource > element to the document.
The src attribute of < eventsource > element should point to an URL which should provide a persistent HTTP connection that sends a data stream containing the events.
The URL would point to a PHP, PERL or any Python script which would take care of sending event data consistently.
server side script should send Content-type header specifying the type text/event-stream as follows-
print "Content-Type: text/event-stream\n\n";
print "Event: server-time\n";
$time = localtime(); print "Data: $time\n";
Once you get a Web Socket connection with the web server, you can send data from browser to server by calling a send() method, and receive data from server to browser by an onmessage event handler.
Following is the API which creates a new WebSocket object.
var Socket = new WebSocket(url, [protocal] );
Here first argument, url, specifies the URL to which to connect. The second attribute, protocol is optional, and if present, specifies a sub-protocol that the server must support for the connection to be successful.
The readonly attribute readyState represents the state of the connection. It can have the following values:
i. A value of 0 indicates that the connection has not yet been established.
ii. A value of 1 indicates that the connection is established and communication is possible.
iii. A value of 2 indicates that the connection is going through the closing handshake.
iv. A value of 3 indicates that the connection has been closed or could not be opened.
2. It is independent of other scripts and does not affect the performance of the page.
3. Web workers are usually used for CPU intensive tasks.
full set of drawing functions similar to other common 2D APIs, thus allowing for dynamically generated graphics. Some anticipated uses of the canvas include
building graphs, animations, games, and image composition.
• Timed media playback
• Offline storage database
• Document editing
• Cross-document messaging
• Browser history management
• MIME type and protocol handler registration
HTML5 supports < audio > tag which is used to embed sound content in an HTML or XHTML document. The current HTML5 draft specification does not specify which audio formats browsers should support in the audio tag. But most commonly used audio formats are ogg, mp3 and wav.
You can use < source > tag to specify media along with media type and many other attributes. An audio element allows multiple source elements and browser will use the first recognized format.
The new attributes provided in HTML5 for <form> are:
- It specifies if a form or input field should have autocomplete as on or off.
- If autocomplete is on, the browser is able to fill the values based on the values filled by the user earlier.
- autocomplete works for following input types: text, search, url, tel, email, password, datepickers, range, and color.
- This is a boolean attribute.
- When present, it signifies that the form-data should not be validated when submitted.
HTML5 is being developed as the next major revision of HTML (HyperText Markup Language), the core markup language of the World Wide Web. The Web Hypertext Application Technology Working Group (WHATWG) started work on the specification in June 2004 under the name Web Applications 1.0. As of March 2010[update], the specification is in the Draft Standard state at the WHATWG, and in Working Draft state at the W3C.