Internet Explorer 11 preview

The first preview of IE11 has just been released. Let’s see what is new so far. I’ll update this post as more information becomes available.

The user-agent string

The new user-agent string for IE11 is as follows:

Desktop:

Mozilla/5.0 (Windows NT 6.3; WOW64; Trident/7.0; Touch; rv:11.0) like Gecko

Experience formerly known as Metro:

Mozilla/5.0 (Windows NT 6.3; Win64; x64; Trident/7.0; Touch; rv:11.0) like Gecko

The Touch token is only included when used on a devices that include a touch screen.

CSS

• The border-image shorthand and individual properties are now supported
• Flexbox support has been updated to the latest spec, and unprefixed
• The pointer-events property now works on HTML content.
• The text-combine-horizontal property from CSS Writing-Modes is now recognised with the -ms- prefix. However, I’m not sure to get this to work. I assume it only works with glyphs that are upright in vertical text, but IE doesn’t support the text-orientation property. Perhaps this is work in progress?
• :fullscreen pseudo-class and ::backdrop pseudo element, both with -ms- prefix. Not technically part of a CSS spec, but included in the Fullscreen API spec.
• IE10 had a bug where the rem unit could not be used in the font-size component of the font shorthand. This has thankfully been fixed in IE11.

HTML5, DOM4 and associated APIs

The following are now supported:

• The hidden attribute
• Fullscreen API
• Custom Data Attributes API (element.dataset)
• Device Orientation Events
• The Screen Orientation API
• DOM4 Mutation Observers (replacement for DOM Mutation Events)
• Input Method Editor API (scripted access to an IME)
• Media Source Extensions
• Encrypted Media Extensions (this will prove controversial I’m sure)
• Web Cryptography API
• Tracking Preference Expression (DNT)
• Dynamic TextTracks (addTextTrack, addCue, and removeCue)
• TTML Simple Delivery Profile for Closed Captions
• Streaming XHR cache control (msCaching attribute)
• Pointer Events have been updated to the latest Candidate Recommendation
• devicePixelRatio
• Navigation Timing 2
• pagehide/pageshow events
• The prefetch attribute

Web Graphics

The big news with IE11 is that WebGL is supported and enabled. Despite IE getting a lot of flack for not supporting WebGL, it looks like it beat Apple to the punch. WebGL is disabled by default in Safari.

Some new features of Canvas 2D Level 2 have been added, including image smoothing, the even-odd fill rule, and dashed lines.

Media

IE 11 supports the MPEG Dash (Dynamic Adaptive Streaming over HTTP).

Network

SPDY/3 is now supported. I was expecting it to be branded as HTTP 2, but this is not the case so far.

JavaScript/ES6

Support for the following ES6 features can be found in IE11 (via Kangax’s support tables and MS JavaScript documentation):

• let
• const
• Map
• WeakMap
• Set
• __proto__
• Block-level function declaration
• Non-standard __defineGetter__ and __defineSetter__

IE11 also supports the ECMAScript Internationalization API.

Performance

• More of IE11 is hardware accelerated, using DirectX 9
• Previous pages are cached for near instantaneous flipping through your browser history
• Pages are prefetched and pre rendered (like Chrome) for faster page loads (if the browser guesses right)

Windows Integration

• There are further live style sizes and further capabilities for what you can include in a live tile.
• Numbers in a web page can have click to call enabled. I don’t know if this is just done by heuristics, or if you can add something special to the markup.

Test scores

Test scores have to be taken with a huge bucket of salt, as they just cover a subset of features (for example HTML5 test doesn’t include many of the APIs above, and CSS3 test doesn’t cover CSS2.1, CSS Level 4, or many of the specs supported by IE like Grids, Regions, and Exclusions), and are sometimes incorrect (WebKit incorrectly parses things it doesn’t support like background-repeat). With that said, this is how IE11 preview performs on various popular tests:

HTML5 Test:

355 and 6 bonus points (up from 320)

CSS3 Test:

61% (up from 54%)

Rng.io:

Passed 476 tests (up from 465 passes)