Last updated: Jan 3, 2013 DevRel Contact: Eric Bidelman (ericbidelman), Paul Irish (paulirish)
This page captures the implementation status of HTML5 feature support in Chrome (desktop) and Chrome for Android. The current release of Chrome for Android matches m18, any exceptions to this will be indicated below.
You have a few ways to watch these features more closely:
Many of these features have their own jumpoff point on html5rocks.com, with links to solid tutorials and resources. The near-daily-updated Chrome Canary lands these features much sooner than the stable or beta releases. (Though it's pre-alpha, so expect bugs!)
Note: In this page there are many references to "m6" and such. This refers to the stable Chrome release of that version.
File APIs
Handle file uploads and file manipulation.
Availability: Basic File API support in m5.
Notes: Limited form of drag-and-drop available in Firefox 3.6
File System
Availability: started to land in m8, but only available for apps & extensions. Synchronous APIs are in m9 for web workers. window.resolveLocalFileSystemURL() and Entry.toURL() were added in m11. Stable release for web pages [not apps/extensions] was m13.
Spec: w3c spec
Notes: devtools support coming. Needs flag --allow-file-access-from-files for testing from file:// URLs. Dev Contact: Eric Uhrhane (ericu)
Drag and Drop Directories Allows dragging and dropping entire folders using HTML5 Drag and Drop. Extends the DataTransferItem with a method to get a FileEntry/DirectoryEntry. (var entry = DataTransferItem.webkitGetAsEntry()) Dev Contact: Kinuko Yasuda (kinuko)
HTMLInputElement.webkitEntries
Get FileSystem API entries representing user selected files from an <input type="file" multiple>. Dev Contact: Kinuko Yasuda (kinuko)
FileWriter
Availability: basic in m8, sync api in m9 for web workers
Dev Contact: Eric Uhrhane (ericu)
FileReader
Can read local and parse local files.
Availability: m7.
Dev Contact: Jian Li (jianli)
BlobBuilder
Build blobs (files).
Availability: m8. As of m20, this API is deprecated. Use Blob() constructor instead (see below).
Notes: window.createBlobURL() changed to new spec's window.createObjectURL() somewhere around m8. As of M10, the call is prefixed under window.webkitURL.createObjectURL(). Chrome 23 unprefixes window.URL.
Removes the need for BlobBuilder API. Allows you to construct Blobs directly (var blob = new Blob(["1234"], {type: 'text/plain'})) Availability: M20 Blob() constructor ArrayBufferView supportBlob() constructor takes ArrayBufferView directly rather than constructing a blob with ArrayBuffer. Availability: M21
Unprefixed Blob.slice() supportBlob.slice() is un-prefixed (from webkitSlice()) in M21. Availability: M22 Typed Arrays
Buffers for holding binary data and working with WebGL & Audio API: ArrayBuffer, Float32Array , Int16Array, Uint8Array, etc.)
Availability: m7 for most. DataView is m9. Float64Array in m13.
Notes: worker.postMessage(TypedArray|ArrayBuffer) landed in m13 using structured cloning. postMesage(Object|Array) (e.g. any type) landed in M23.
a[download] attribute
When used on an <a>, this attribute signifies that the resource it points to should be downloaded by the browser rather than navigating to it. Availability: M14
Offline and XHR
App Cache
Enables web pages to work without the user being connected to the internet
Notes: Chrome's implementation is maxed at 260MB. Individual files max out at 32MB (260MB/8)
Availability: m5. Dev tools support added in m6
Dev Contact: Michael Nordman (michaeln)
XHR supports xhr.send(ArrayBuffer) Allows for sending a binary byte array using xhr. Availability: targeting m9 Dev Contact: Jian Li (jianli)
XHR supports xhr.send(Blob|File)
Allows for sending a Blob or File using xhr.
Availability: m7
Dev Contact: Eric Uhrhane (ericu)
XHR supports xhr.send(FormData)Availability: landed m6
XHR supports xhr.send(ArrayBufferView)Allows for sending a typed array directly rather than sending just its ArrayBuffer. Availability: m22
XHR.response, XHR.responseType
Allows reading an xhr response as a blob/arraybuffer (xhr.responseType = 'arraybuffer', xhr.responseType = 'blob')
restricts the usage of synchronous XHRs (xhr.open(..., false);) by throwing an error when .responseType is set.
Dev Contact: Michael Nordman (michaeln)
XMLHttpRequestProgressEvent
Availability: m7
Access the underlying network information (connection info) of the device.
Availability: target unknown Notes: In Android since 2.2, but not implemented yet desktop browsers. Dev Contact: -
navigator.onLine
Allows an application to check if the user has an active internet connection. Also can register 'online' and 'offline' event handlers.
Availability: m14
Dev Contact: adamk
navigator.registerProtocolHandler() Allow web applications to handle URL protocols like mailto:. Availability: m13 Tickets: crbug.com/11359Notes: Protocol whitelist: "mailto", "mms", "nntp", "rtsp", "webcal". Custom protocols require "web+" prefix (e.g. "web+myScheme"). There are no plans to implement registerContentHandler. Dev Contact: koz
Directory upload
Allow specifying a directory to upload (<input type="file" multiple webkitdirectory />), which is just be an extension of existing form mime-multipart file upload.
Availability: m8. m21 landed dragging and dropping a folder onto an <input type="file" webkidirectory> element).
Spec: W3C editor's draft
Protocol Spec: RFC 6455 + x-webkit-deflate-frame Planned: Implement permessage-compress extension and mux extension
Dev Contact: Yuta Kitamura (yutak)
Strict Transport Security
Header to inform the browser to always request a given domain over SSL, reducing MITM attack surface area.
Availability: m4
a[ping] attribute.Notify resource on link click. Availability: Chrome 7. Notes: webkit changeset. Can be disabled through a command line flag or in about:flags
Storage
Web SQL Database
API exposing an SQLite database
Availability: m4.
Notes: No spec progress or other implementations (outside of Webkit/Opera) expected.
Dev Contact: Dumitru Daniliuc (dumi)
Availability: Indeterminate status
Indexed Database API
Availability: Landed in m11. Prefixed as webkitIndexedDB pre M24.
Dev Contacts: dgrogan, jsbell, alecflett
Cross-Browser Status: - Firefox: through 4beta9 as
moz_indexedDB; through FF15 as mozIndexedDB; as of FF16 will be indexedDB - IE: in IE10 Platform Preview through 5 as msIndexedDB; as of IE10 Platform Preview 6 will be indexedDB
- IE10 will not support Array key paths
- Opera implementation is in progress
Known differences between Chrome (as of 23.0.1243.0 Canary) and the draft specification (as of July 16, 2012): - a "
blocked" event will fire against a request created by an open(name, version), a setVersion(version) or deleteDatabase(name) call even if all other connections are closed in response to a "versionchange" event - "
blocked" events may also fire multiple times against the same deleteDatabase(name) request - Blobs, Files, and FileLists in values are not supported.
- The Sync API is not supported - but neither IE nor Firefox support this either; it is marked as "At Risk" in the spec
Updates in M23 (from M22) - The new-style
open(name, version).onupgradeneeded API is now supported; the old open(name) followed by setVersion(version) API may still be used for now, but web applications should migrate as soon as possible.
Updates in M22 (from M21) deleteDatabase() and webkitGetDatabaseNames() can now be called from WorkersIDBKeyRange.upperOpen/lowerOpen flags are now reported correctly when lowerBound()/upperBound() used- Empty arrays are no longer valid key paths
- Requests can no longer be issued against transactions when not active (i.e. outside of creation context or callbacks, e.g. from a timeout or non-IDB event)
- "
versionchange" events are no longer fired against connections that are closing - Multi-entry indexes with invalid/duplicate subkeys now populated per spec
Updates in M21 (from M20)
Web Storage
Availability: localStorage in m4, sessionStorage in m5
Notes: localStorage serves basic use cases. For more comprehensive storage solution, consider IndexedDB. While the spec indicates anything that structured clone algorithm can clone can be stored, all browser implementations currently allow only strings. Chrome's storage capacity is currently 2.5mb. Tickets: webk.it/41645
Dev Contact: Jeremy Orlow (jorlow) -> Michael Nordman (michaeln)
Quota Management API
This API can be used to check how much quota an app/origin is using.
Availability: m13: FileSystem (TEMPORARY & PERSISTENT) and WebSQL (temp only). m14 : AppCache and IndexedDB were added (TEMP only)
Dev Contact: Kinuko Yasuda (kinuko)
CSS & Presentation
CSS3 3D Transforms
Availability: m12
Spec: w3 spec
Notes: Associated GPU rendering quirkiness actively being worked on in prep for beta channel release.
new semantic sectioning elements
section, article, aside, nav, header, and footer elements
Availability: m5
<progress> and <meter> elements
Offer a visual display of progress.
Ruby
Ruby annotations are short runs of text presented alongside base text, primarily used in East Asian typography as a guide for pronunciation or to include other annotations
Availability: m4
@font-face webfonts
Availability: OTF/TTF support in m4. WOFF in m6.
Notes: unicode-range support planned. Improved handling of text while font asset is being downloaded, also planned.
Notes: The legacy syntax will be retained for the foreseeable future.
Background printing
Opt-in ability to specify a background should be printed
Availability: landing in m16 with prefix: -webkit-print-background
Scoped style sheets
Boolean attribute for the <style> element (<style scoped>). When present, its styles only apply to the parent element.
Availability: m20 (enable webkit experimental feature in about:flags)
CSS3 FiltersApply (SVG-like) filter effects to arbitrary DOM elements.
Availability: m19 Spec: w3 spec
CSS3 Grid LayoutAvailability: work is just started behind a flag. No way to enable it. Dev Contact: Tony Chang (tony@chromium), Ojan Vafai (ojan@chromium)
CSS3 Flexbox Model (the new one)Note: The old box model (display: -webkit-box) and spec has been replaced by a new one (display: -webkit-flex). For now, chrome supports both. But you should use the new one!
Availability: started landing in m18. m21 has the latest and full implementation with a bunch of properties renamed. Spec: w3 specDev Contact: Ojan Vafai (ojan)
CSS3 RegionsMagazine-like content flow into specified regions.
Availability: Partial support in m19 (enable webkit experimental feature in about:flags) Spec: w3c
position: stickyposition: sticky is a new way to position elements and is conceptually similar to position: fixed. The difference is that a stickily positioned element behaves like position: relative within its parent, until a given offset threshold is met.
Availability: M23 (enable webkit experimental feature in about:flags) Proposal: www-styleCSS Intrinsic Sizingwidth: fill-available, width: min-content, width: max-content, etc.
Availability: ~M22 (vendor prefixed)
Other CSS3
box-shadow: inset keyword and spread value supported since m4, went unprefixed in m10
border-radius: went unprefixed in m4 cross-fade(): landing with prefix ( -webkit-cross-fade) in m17. demo
clip-path: landed for m24. Prefixed -webkit-clip-path. spec CSS viewport % lengths (vw, vh, vmin, vmax): spec, Availability: m20
Graphics
Canvas
Provides an API to draw 2D graphics
Availability: m1, Safari, Firefox, Opera, IE9 Notes: Accelerated 2D canvas targeting m14 for windows/linux; perhaps m15 for mac. Currently, available in about:flags. webp format: canvas.toDataURL("image/webp") added in m17 (WebKit 535), but m18 on Mac. In M20, canvas.getImageData(...).data returns a Uint8ClampedArray instead of a CanvasPixelArray.
WebGL (Canvas 3D)
3D rendering via the <canvas> element.
Availability: m9 Android Availability: TBD.
Notes: Originally project developed by Mozilla as a JavaScript API to make OpenGL calls - WebGL WikiDev Contact: Vangelis Kokevis (vangelis), Ken Russell (kbr)
requestAnimationFrame
Offload animation repainting to browser for optimized performance.
Availability: m10 , currently prefixed as window.webkitRequestAnimationFrame
Notes: As of FF4, Mozilla's implementation differs and offers lower framerates, but it will be addressed. This method should be used for WebGL, Canvas 2D, and DOM/CSS animation.
Dev Contact: jamesr
Accelerated Video: m10
WebP image format support: m9. alpha and lossless added to m22.
Multimedia
Video and Audio
Natively play video and audio in the browser
Provides API and built-in playback controls
Availability: m3. Also Safari 4, Firefox 3.5
Codecs: mp4, ogv, and webm ship with Chrome. webm shipped in m6.
Dev Contact: Andrew Scherkus (scherkus)
mediaElem.webkitAudioDecodedByteCount - m11
mediaElem.webkitVideoDecodedByteCount - m11
videoElem.webkitDecodedFrameCount - m11
videoElem.webkitDroppedFrameCount - m11
Web Audio API
Availability: dev channel since m12. stable channel in m14. m24 adds the ability for live mic input (enable in about:flags). m25 updated API calls to the latest spec. Notes: enable via about:flags. Also, Mozilla has an alternative Audio Data API proposal. M20 included support for oscillator nodes.
Dev Contact: Chris Rogers (crogers)
Media Source APIAllows appending data to an <audio>/<video> element.
Availability: dev channel m23 Notes: enable via about:flags or run with --enable-media-source flag. Dev Contact: Aaron Colwell (acolwell)
WebRTCReal time communication in the browser. Combines the following APIs: RTCPeerConnection, navigator.getUserMedia (MediaStream) and RTCDataChannel. (NB: many online resources refer to browsers with 'WebRTC implementations' but just mean getUserMedia).
Availability: M21 for getUserMedia (prefixed), M23 for RTCPeerConnection (prefixed and flagless from M23). RTCDataChannel is behind a flag from m25, requires an RTCPeerConnection { optional:[ { RtpDataChannels: true } ]} constraint and only supports unreliable data channels and text messages. Notes: - webkitRTCPeerConnection is the name for RTCPeerConnection implementation currently in Chrome: other names/implementations are obsolete; prefix will be removed when APIs stabilise - for the permission dialog: Chrome only show the "Always allow" for sites using https, for increased security - getUserMedia is implemented in Opera and Firefox Nightly/Aurora; RTCPeerConnection and DataChannel are implemented in Firefox Aurora/Nightly and planned for Firefox 18 (January 2013)
Resolution Constraints are enabled as of M24: Tab Capture (i.e. ability to get stream of 'screencast') currently available in Chrome Dev channel:
Dev contact: Serge Lachapelle (sergel)
Track elementAdd subtitles, captions, screen reader descriptions, chapters and other types of timed metadata to video and audio. Chrome currently supports the WebVTT format for track data.
Availability: m23 Notes: Rendering does not yet include CSS pseudo elements. Dev Contact: Andrew Scherkus (scherkus), Silvia Pfeiffer (silviapf)
Encrypted Media ExtensionsEnables playback of encrypted streams in an <audio>/<video> element.
Availability: m22: Clear Key only; WebM Encryption v0.3 & ISO Common Encryption; encrypted video only Spec: W3C Editor's Draft: v0.1b (m22); latest (object-oriented version not yet implemented) Notes: Enable via about:flags or run with --enable-encrypted-media flag. Dev Contact: David Dorwin (ddorwin)
JS Web Speech API
Enables web developers to incorporate speech recognition and synthesis into their web pages.
Availability: m25 Dev Contact: gshires
Other Open Web Platform features
Desktop notifications
Availability: m5
Notes: Additional functionality added in m6: in-place replacement of notifications, BiDi support, Worker support, and UI improvement. In M22, createHTMLNotification() was removed because of spec compliance. See this post.
Dev Contact: John Gregg (johnnyg)
Interactive widget to show/hide content.
Availability: m12
Predefined data/options for controls
<dialog>The dialog element represents a part of an application that a user interacts with to perform a task, for example a dialog box, inspector, or window.
Availability: Behind a flag in m25. Enable "Experimental WebKit Features" in about:flags. Dev contact: falken
<template>
HTML template element to allow creating fragment of inert HTML as a prototype for stamping out DOM.
Availability: targeting m26 Dev Contact: rafaelw
Device OrientationEnables real-time events about the 3 dimensional orientation of the device/laptop
Also called Server-sent Events, these are push notifications from the server received as DOM events. Availability: m6
Fullscreen API
Programmatically instruct content on the page to be presented in the browser's full screen (kiosk) mode. Availability: m15 Dev contact: jeremya
history.pushStateAvailability: m5. history.state was implemented in m18. popstate firing after page load: crbug.com/63040
Geolocation
Enables websites to get geolocation information from browsers
Availability: m5, also Firefox 3.5
Dev Contact: Andrei Popescu (andreip)
Gives JS access to a game controller via USB. Availability: targeting m18
Battery StatusAllows access to see the battery level of the device's battery Availability: unknown
Provides notifications when DOM nodes are rearranged or modified. Availability: m18, prefixed as WebKitMutationObserver; unprefixed in current Firefox Dev Contact: rafaelw
seamless The seamless attribute is used to embed and <iframe> in the calling page without scrollbars or borders (e.g. seamlessly).
Gives the content of an iframe as a src context to embed (e.g. <iframe seamless srcdoc="<b>Hello World</b>"></iframe>). Note: If both src and srcdoc are set, the latter takes precedence. Availability: m20
sandbox Method of running external site pages with reduced privileges (i.e. no JavaScript) in iframes (<iframe sandbox="allow-same-origin allow-forms" src="..."></iframe>) Availability: m19
API for testing if a given media query will apply. Availability: m9
Pointer Lock (TAPIFKA Mouse Lock)Gives access to raw mouse movement, locks the target of mouse events to a single element, eliminates limits of how far mouse movement can go in a single direction, and removes the cursor from view. Obvious use cases are for first person or real time strategy games.
Availability: m18 behind flag. On be default in m22 with a refined API similar to requestFullScreen.
Note, late breaking changes: Pointer lock can only work within one document. If you lock in one iframe, you can not have another iframe try to lock and transfer the target... it will error instead. The first iframe has to unlock, then the second iframe can lock.
Also, iframes work by default, but sandboxed iframes block pointer lock. Landed recently into WebKit the ability to use <iframe sandbox="allow-pointer-lock">, but that will not percolate into Chrome until 23. Provides an API to ask whether the current tab is visibile or not. If you, you might want to throttle back action or set an idle state. Availability: m13, prefixed as document.webkitHiddenNotes: Relatedly, setTimeout/Interval are clamped to 1000ms when in a background tab as of m11. Firefox 5 has the same behavior. Dev Contact: shishir
Availability: m18 exposed WebKitShadowRoot().Enable Shadow DOM in about:flags. DevTools support is in m20, behind the DevTools Experiments flag (and setting). m25 removes constructor and exposes element.webkitCreateShadowRoot() by default. Notes: As of m13, elements internally ported to the shadow dom: <progress>, <meter>, <video>, <input type=range>, <keygen>. Dev Contact: dglazkov WorkersProvides a threading API Availability: Chrome 3, Safari 4, Firefox 3.5. Shared workers available in m4. Android Availability: Dedicated workers in m16 (0.16). No shared workers, yet. Notes: Pre-M15, there were a limit to the number of workers that each page can start, as well as the number of workers that can be running globally across all pages. This was because a new process was started for each worker. As of M15, workers are started in-process, meaning less memory footprint and faster messaging. Transferrable objects landed in m17 (see next) Dev Contact: Dmitry Lomov (dslomov), Drew Wilson (atwilson)
Transferable Object messaging passingWith transferable objects/data, ownership is transferred from one context to another. It is zero-copy, which vastly improves the performance of sending data to a Worker or another window. Availability: m17 Notes: landed as prefixed. Unprefixed in M24. worker.webkitPostMessage(arrayBuffer, [arrayBuffer])
window.webkitPostMessage(arrayBuffer, targetOrigin, [arrayBuffer])
<link> load/error eventsSpecify and onload or onerror event for a stylesheet to load. Touch EventsAndroid Availability: m16 (0.16)
MathML
JS Internationalization API
Allows collation (string comparison), number formatting, and date and time formatting for JavaScript applications. More info here. Availablity: m24
Resource Timing API
Availablity: m25
User Timing API
Availablity: m25
Availability: See HTML5 Forms Status for all details. (Updated as recently as Nov 28th, 2012). Includes details in input types (like date and color), input attributes, datalist and more.
AutocompleteProvides hints to the autofill implementation to allow Chrome to better provide suggested values to the user.
formElement.requestAutocomplete()Allows a form to be filled out on demand by the browser's autofill. Availability: in development. Tickets: crbug, webkit meta bug
DOM APIs
Element.outerHTML - m1
Element.textContent (faster than innerHTML for plain text) - m1
window.onerror event - m10crypto.getRandomValues() - m11
selectionchange event - m11
Chrome Extensions
More resources for going deep with HTML5:
|
