Internet Explorer 9: The Most Comprehensive Developer Guide (and Not Only), Part 4
What else is new in IE9 PP3, besides canvas and video? A huge description, lots of pictures.
![HeaderLeft [1]](http://www.gotdotnet.ru/upload/blog/XaocCPS/34a/HeaderLeft_1__af7f68ac-8518-4986-b125-36cadf758c50.png "HeaderLeft [1]")
On June 23, the third test build of IE9 was released on schedule (period of 8 weeks). On Habré already managed to write about this release and in the most common words describe innovations. In addition, right there on Habré they managed to compare the canvas performance in IE9 and Chrome.
')
This post will reveal much more details of the third test version of Internet Explorer 9 and will tell about browser innovations that will be important for developers.
This is the fourth article in a series of articles about innovations in IE9 for developers. You can get acquainted with the previous parts here: part 1 (CSS3, HTML5, DOM) , part 2 (SVG, GPU) , part three (ICC profiles, image formats, JavaScript) .
In IE9 Platform Preview 3, the following elements have been updated or implemented that were not fully implemented in previous versions or that were completely absent:
The developers have added a couple of demonstrations of CSS3 and DOM changes:
An animated IE logo that is built on border-radius elements alone.
Alas, Opera 10.6 Beta due to bugs in the implementation of CSS3 properties displays the logo incorrectly, and the animation is torn and jerked.
This demonstration shows the capabilities of the DOM Traversal mechanism for filtering DOM elements.
IE9 PP3 passes the ACID3 test for 83 points out of 100. The previous test versions scored 55 and 68 points, respectively. The progress is obvious.
IE9 Platform Preview 3 adds support for WOFF, TrueType and OpenType embedded fonts. EOT is also supported.
Implementing embedded font support is, in my opinion, a very important step. And again, IE9 shows its superiority in rendering support and smoothing fonts using the GPU. Below are examples of WOFF rendering in different browsers.
The developers have prepared an excellent test page with embedded fonts, where anyone can try the way their browser supports the standards of web fonts and how it renders them.
The new test version of IE9 has once again increased JavaScript performance:
The updated version of IE9 contains a massive update of ECMAScript 5 support. The new elements are listed in the following list:
The developers have added several demonstrations of new ECMAScript 5 features:
With regard to the implementation of ECMAScript 5, Internet Explorer 9 has taken the lead. Tests show the following results:
Many people are not satisfied with the fact that these tests were sent to W3C by Microsoft, probably, they are too lazy to follow the link and see the test on their own, since the source materials are available to everyone and everyone.
However, if you need an “independent” opinion, then please read the independent testing , which shows full support for ECMAScript 5 objects using IE9:
The developers of Internet Explorer 9 have added support for the Performance API to the third test version, which is part of the W3C Web Timing specification. With this tool you can test your websites with some test load. The API can be changed over time, so for now it has the prefix “ms”. Look at the work of this API can be on a special page .
The most anticipated new feature of IE9 PP3 is HTML5 Video. About it, unlike canvas was known in advance. Work with video in IE9 was shown during the MIX conference, but neither in the first test version nor in the second support was there.
The third version of IE9 brought support for HTML5 Video and, of course, video playback is accelerated through the GPU (but so far only in Windows 7, not in Vista).
Currently, support for video playback with H.264 codec is implemented. WebM support will be implemented later, probably in the first beta version of IE9, which is expected in August.
In addition to the video tag, support for the audio tag has been added. MP3 and AAC codecs are supported for this tag. Developers warn about a known bug: in Windows Vista, MP3 files that are encoded with LAME may not play correctly.
The developers have prepared a couple of interesting demonstrations.
With the support of IMDB.com, a demonstration was launched with a number of trailers on popular released and awaited films. The FPS meter will show the performance of your browser.
To demonstrate the audio tag, developers have prepared a music player with a list and shortcuts.
The big surprise of this release of IE9 was support for HTML5 Canvas . Rumors of support for canvas once leaked to the Internet, but did not receive confirmation.
The IE9 PP3 is fully supported by the Canvas Element API and most of the Canvas 2D Context API. Work with canvas is fully accelerated through the GPU and this is noticeable at the demonstrations.
Below is a list of what is not fully implemented in canvas IE9:
Working with the best-selling Amazon books directory, choosing a book comes close and you can look through it. In IE9, all operations happen instantly with FPS = 60.
Demonstration, which has already become famous. It is quoted on many sites and shown in numerous videos. In the aquarium swim fish, the number of which can be increased. Above is a screenshot of 1000 fish, fish swim quite well. In Opera 10.6 Beta under these conditions - 2 FPS. About Chrome 6 can not speak, watch the video with an independent test from Download Squad .
Remember the video with high-speed chrome and potatoes? The IE9 team responded with a potato dough. Try this fast Chrome in this test?
The next test is an asteroid cloud with some satellites in one of them. The satellites rotate in orbit and you can increase their number and see how it affects the performance. An increase in IE9 does not affect anything at all.
The following demonstration shows the implementation of DeepZoom technology, which previously worked on either Ajax or Silverlight, based on canvas.
Before you gigapixel panorama by which you can move freely approaching and distancing details of interest to you.
The last demonstration is a small catalog of implemented canvas functions with a demonstration. For example, the screenshot shows the animation on canvas:
The developers of IE9 have created for the W3C another 118 new tests on a variety of standards implementation options. Plus, another 1309 ECMAScript 5 implementation tests were created. The current situation with these tests is:
As you can see, IE9 itself does not pass all tests. You can get acquainted with them in more detail and check each test yourself on this page .
The IE9 developer tools have also been updated:
Additional videos are available on Channel 9 :
Extensive official IE9 developer guide in English .
Overboard of IE9 there are still such things as geolocation, web workers, web sockets, css3-transformations, WebGL and other standards, many of which have not yet emerged from the drafts status. It is likely that we will see some of this in August in the beta version of IE9. Let's wait for surprises, as in the case of canvas.
As you can see, the third test version of IE9 has added a lot of new features, functions, API, new standards.
The development of IE9 is moving at full speed. In many places, IE9 caught up, and even overtook its competitors. Let's hope that the pace will remain the same and the final version of IE9 will be even better.
On June 23, the third test build of IE9 was released on schedule (period of 8 weeks). On Habré already managed to write about this release and in the most common words describe innovations. In addition, right there on Habré they managed to compare the canvas performance in IE9 and Chrome.
')
This post will reveal much more details of the third test version of Internet Explorer 9 and will tell about browser innovations that will be important for developers.
This is the fourth article in a series of articles about innovations in IE9 for developers. You can get acquainted with the previous parts here: part 1 (CSS3, HTML5, DOM) , part 2 (SVG, GPU) , part three (ICC profiles, image formats, JavaScript) .
HTML5 / CSS3 / DOM / SVG / XHTML
In IE9 Platform Preview 3, the following elements have been updated or implemented that were not fully implemented in previous versions or that were completely absent:
HTML5
- handling of free space according to HTML5 rules (HTML5-conformant whitespace handling).
CSS3
- Full support for CSS3 Values ​​& Units
- deg: degrees (angle unit)
- grad: grads (angle unit)
- rad: radians (angle unit)
- turn: turns (angle unit)
- ms: milliseconds (time unit)
- s: seconds (time unit)
- rem: font size of the root element (relative length unit)
- vw: viewport width (relative length unit)
- vh: viewport height (relative length unit)
- vm: smaller size of viewport width or relative length (relative length unit)
- ch: zero-width
- Added calc () property, which allows calculating CSS element values.
- Full support for the CSS3 Namespaces module
- Full support for CSS3 Background & Borders , in addition, support for SVG-code as a background, including for multiple backgrounds.
- CSS3 Fonts support: include TrueType, OpenType, Open Font Format in @ font-face. The CSS3 Fonts properties are not yet implemented: font-size-adjust and some others.
Dom
- full support for DOM L2 / L3 Events;
- full support for DOM Style;
- in the DOM Core added functions and features: adoptNode, compareDocumentPosition, CDATASection, importNode, inputEncoding, isDefaultNamespace, isEqualNode, isSameNode, isSupported, lookupNamespaceURI, lookupPrefix, replaceWholeText, textContent, xmlEncoding, xmlStandalone, xmlVersion, wholeText.
Svg
- implemented elements: gradients, patterns, masking, clipping, markers, linking & views;
- SVG embedding in <embed>, <iframe>, <img>;
- support for .SVGZ files from a remote server;
- SVG manipulation support Text: Fill, stroke, positioning (x, y, dx, dy, rotate).
XHTML / XSLT and text / xml, application / xml documents
- XML documents display SVG and XHTML content;
- XML engine upgraded from MSXML3 to MSXML6;
- XSLT can be applied to SVG and XHTML documents.
Demonstrations
The developers have added a couple of demonstrations of CSS3 and DOM changes:
IE Logo
An animated IE logo that is built on border-radius elements alone.
Alas, Opera 10.6 Beta due to bugs in the implementation of CSS3 properties displays the logo incorrectly, and the animation is torn and jerked.
DOM Traversal Gallery
This demonstration shows the capabilities of the DOM Traversal mechanism for filtering DOM elements.
ACID3
IE9 PP3 passes the ACID3 test for 83 points out of 100. The previous test versions scored 55 and 68 points, respectively. The progress is obvious.
Web fonts
IE9 Platform Preview 3 adds support for WOFF, TrueType and OpenType embedded fonts. EOT is also supported.
Implementing embedded font support is, in my opinion, a very important step. And again, IE9 shows its superiority in rendering support and smoothing fonts using the GPU. Below are examples of WOFF rendering in different browsers.
The developers have prepared an excellent test page with embedded fonts, where anyone can try the way their browser supports the standards of web fonts and how it renders them.
ECMAScript 5 and JavaScript Performance
The new test version of IE9 has once again increased JavaScript performance:
The updated version of IE9 contains a massive update of ECMAScript 5 support. The new elements are listed in the following list:
- for Object:
- Object.defineProperty, Object.defineProperties, Object.create, Object.getPrototypeOf, Object.getOwnPropertyDescriptor, Object.getOwnPropertyDescriptor, Object.keys, Object.seal, Object.freeze, Object.isSealed, Object.isFrozen, Object.prealExtensions, Object. isExtensible;
- for Array:
- indexOf, lastIndexOf, forEach, every, some, map, filter, reduce, reduceRight;
- other useful methods:
- String.prototype.trim, Date.prototype.toISOString, Date.parse, Date.now, Array.isArray, Function.prototype.bind
The developers have added several demonstrations of new ECMAScript 5 features:
- ECMAScript 5 Arrays - work with the new array API;
- ECMAScript 5 Game is a game built on different ECMAScript APIs similar to the legendary Bejeweled.
With regard to the implementation of ECMAScript 5, Internet Explorer 9 has taken the lead. Tests show the following results:
Many people are not satisfied with the fact that these tests were sent to W3C by Microsoft, probably, they are too lazy to follow the link and see the test on their own, since the source materials are available to everyone and everyone.
However, if you need an “independent” opinion, then please read the independent testing , which shows full support for ECMAScript 5 objects using IE9:
window.msPerformance
The developers of Internet Explorer 9 have added support for the Performance API to the third test version, which is part of the W3C Web Timing specification. With this tool you can test your websites with some test load. The API can be changed over time, so for now it has the prefix “ms”. Look at the work of this API can be on a special page .
HTML5 Video / Audio
The most anticipated new feature of IE9 PP3 is HTML5 Video. About it, unlike canvas was known in advance. Work with video in IE9 was shown during the MIX conference, but neither in the first test version nor in the second support was there.
The third version of IE9 brought support for HTML5 Video and, of course, video playback is accelerated through the GPU (but so far only in Windows 7, not in Vista).
Currently, support for video playback with H.264 codec is implemented. WebM support will be implemented later, probably in the first beta version of IE9, which is expected in August.
In addition to the video tag, support for the audio tag has been added. MP3 and AAC codecs are supported for this tag. Developers warn about a known bug: in Windows Vista, MP3 files that are encoded with LAME may not play correctly.
The developers have prepared a couple of interesting demonstrations.
IMDb Video Panorama
With the support of IMDB.com, a demonstration was launched with a number of trailers on popular released and awaited films. The FPS meter will show the performance of your browser.
HTML5 Audio XML Playlist
To demonstrate the audio tag, developers have prepared a music player with a list and shortcuts.
Canvas
The big surprise of this release of IE9 was support for HTML5 Canvas . Rumors of support for canvas once leaked to the Internet, but did not receive confirmation.
The IE9 PP3 is fully supported by the Canvas Element API and most of the Canvas 2D Context API. Work with canvas is fully accelerated through the GPU and this is noticeable at the demonstrations.
Below is a list of what is not fully implemented in canvas IE9:
- there is no support for the globalCompositeOperation attribute;
- no support for Canvas 2D Context DOM Exceptions;
- no drawFocusRing () support and focus management APIs.
Amazon shelf
Working with the best-selling Amazon books directory, choosing a book comes close and you can look through it. In IE9, all operations happen instantly with FPS = 60.
Fishie tank
Demonstration, which has already become famous. It is quoted on many sites and shown in numerous videos. In the aquarium swim fish, the number of which can be increased. Above is a screenshot of 1000 fish, fish swim quite well. In Opera 10.6 Beta under these conditions - 2 FPS. About Chrome 6 can not speak, watch the video with an independent test from Download Squad .
Mr. Potato gun
Remember the video with high-speed chrome and potatoes? The IE9 team responded with a potato dough. Try this fast Chrome in this test?
Asteroid belt
The next test is an asteroid cloud with some satellites in one of them. The satellites rotate in orbit and you can increase their number and see how it affects the performance. An increase in IE9 does not affect anything at all.
Deep zoom
The following demonstration shows the implementation of DeepZoom technology, which previously worked on either Ajax or Silverlight, based on canvas.
Before you gigapixel panorama by which you can move freely approaching and distancing details of interest to you.
Canvas pad
The last demonstration is a small catalog of implemented canvas functions with a demonstration. For example, the screenshot shows the animation on canvas:
Tests
The developers of IE9 have created for the W3C another 118 new tests on a variety of standards implementation options. Plus, another 1309 ECMAScript 5 implementation tests were created. The current situation with these tests is:
As you can see, IE9 itself does not pass all tests. You can get acquainted with them in more detail and check each test yourself on this page .
Developer Tools
The IE9 developer tools have also been updated:
- Profiler tab for profiling scripts, DOM and built-in functions returned;
- Initiator column appeared in the Network tab, which shows what exactly caused the content download;
- XML parsing errors are now displayed in the tool console.
Additionally
Additional videos are available on Channel 9 :
- Internet Explorer 9 Platform Preview 3: A Look at the New Demos
- Internet Explorer 9 Platform Preview 3: A Look at ECMAscript 5
- Internet Explorer 9 Platform Preview 3: A Look at Canvas
- Internet Explorer 9 Platform Preview 3: A Look at HTML5 Video Support
- Internet Explorer 9 Platform Preview 3: A Look at Canvas and Amazon.com
Extensive official IE9 developer guide in English .
Overboard
Overboard of IE9 there are still such things as geolocation, web workers, web sockets, css3-transformations, WebGL and other standards, many of which have not yet emerged from the drafts status. It is likely that we will see some of this in August in the beta version of IE9. Let's wait for surprises, as in the case of canvas.
Conclusion
As you can see, the third test version of IE9 has added a lot of new features, functions, API, new standards.
The development of IE9 is moving at full speed. In many places, IE9 caught up, and even overtook its competitors. Let's hope that the pace will remain the same and the final version of IE9 will be even better.
Source: https://habr.com/ru/post/97386/
All Articles