Internet Explorer 11: “Don’t call me IE”

internet-ExplorerWith Internet Explorer 11, you get better compatibility with web standards, other browsers, and real-world websites. There’s updated support for popular web standards and changes that prevent older websites from displaying incorrectly.
For the first time in a long time, Microsoft has actually removed features from Internet Explorer. The user-agent string has also changed. It seems that Microsoft has gone out of their way to ensure that all existing isIE() code branches, whether in JavaScript or on the server, will return false for Internet Explorer 11. The optimistic view of this change is that Internet Explorer 11 finally supports enough web standards such that existing IE-specific behavior is no longer needed.

User-agent changes
The user-agent string for Internet Explorer 11 is shorter than previous versions and has some interesting changes.

IE 11 user-agent string:
Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv 11.0) like Gecko
IE 10 user-agent string (on Windows 7):
Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.1; WOW64; Trident/6.0)

The compatible ("compatible") and browser ("MSIE") tokens have been removed.
The "like Gecko" token has been added (for consistency with other browsers).
The version of the browser is now reported by a new revision ("rv") token.

The most glaring difference is the removal of the “MSIE” token, which has been part of the Internet Explorer user-agent from the beginning. Also noticeable is the addition of “like Gecko” at the end. This suggests that Internet Explorer would prefer to be identified as a Gecko-type browser if it’s not identified as itself. Safari was the first browser to add “like Gecko” so that anyone sniffing for “Gecko” in the user-agent string would allow the browser through.

Any sniffing code that looks for “MSIE” now will not work with the new user-agent string. You can still search for “Trident” to identify that it’s Internet Explorer (the “Trident” token was introduced with Internet Explorer 9). The true Internet Explorer version now comes via the “rv” token.

Legacy API additions, changes, and removals
Many websites look for browsers that support legacy (HTML4) features in order serve experiences optimized for earlier browsers. This can be a problem for browsers that support legacy features and modern standards, such as HTML5, CSS3, and so on. If a site detects legacy features before searching for modern standard support, it can serve legacy experiences to browsers that support modern standards and richer experiences.
As a result, IE11 adds, changes, and removes a number of legacy features by default:

=> The navigator.appName property now returns “Netscape” to reflect the HTML5 standard and to match behavior of other browsers.
=> The navigator.product property now returns “Gecko” in order to reflect the HTML5 standard and to match behavior of other browsers.
(This may seem like a sneaky attempt to trick developers, but this behavior is actually specified in HTML5. The navigator.product property must be “Gecko” and navigator.appName should be either “Netscape” or something more specific. Strange recommendations, but Internet Explorer 11 follows them. The side effect of these navigator changes is that JavaScript-based logic for browser detection may end up using these and will end up identifying Internet Explorer 11 as a Gecko-based browser)
=> The XDomainRequest object is replaced by CORS for XMLHttpRequest.
=> Supported for __proto__ has been added.
=> The dataset property has been added.
In addition, several legacy API features have been removed in favor of features specified by modern standards:

Removed API feature                   Replacement feature
============================================================
attachEvent                                     addEventListener
——————————————————————————————————-
window.execScript                           eval
——————————————————————————————————-
window.doScroll                               window.scrollLeft, window.scrollTop
——————————————————————————————————-
document.all                                    document.getElementById
——————————————————————————————————-
document.fileSize, img.fileSize         Use XMLHttpRequest to fetch the  source
——————————————————————————————————-
script.onreadystatechange              script.onload
& script.readyState
——————————————————————————————————-
document.selection                         window.getSelection
——————————————————————————————————-
document.createStyleSheet            dcument.createElement (“style”)                                                                               style.styleSheet style.sheet
——————————————————————————————————-
window.createPopup                       Use div or iframe with a high zIndex value
——————————————————————————————————-
Binary behaviors                             Varies; use a standards-based                                                                                equivalent,ie canvas, SVG, or CSS3                                                                        Animations
——————————————————————————————————-
Legacy data binding                       Use data binding from a framework, such                                                                 as WinJS
============================================================

URL character encoding
IE11 changes the character encoding for URLs. Specifically, query strings and XHR requests are now encoded using UTF-8 character encoding.
This change affects all URLs except for:

anchor name components (also called fragments).
username and password components.
file:// or ftp:// protocol links.

These changes match the behavior of other browsers and simplifies cross-browser XHR code.

Custom data attributes
IE11 adds support for HTML5 custom data attributes and the dataset property, which provides programmatic access to them. You can assign data attributes to elements using a data- prefix followed by the attribute name(HTML):

 <div data-example-data="Some data here"></div>

To get or set the value of the data attribute, use this syntax(JavaScript):

   // to get
   var myData = element.dataset.exampleData;
   // to set
   element.dataset.exampleData = "something new";

Ref: http://msdn.microsoft.com/en-us/library/ie/bg182625(v=vs.85).aspx
Ref: http://www.nczonline.net/blog/2013/07/02/internet-explorer-11-dont-call-me-ie/

Author : Rony T Sam

Leave a comment