performance

IE9’s Hardware-Accelerated Canvas in Action

by Joey deVilla on June 24, 2010

As announced in yesterday’s posting, Platform Preview 3 of Internet Explorer 9 is out, and it’s faster than snakes on ice. Some of the credit goes to “Chakra”, the new JavaScript engine, and some of it goes to IE9’s hardware acceleration, which bypasses the layers of abstraction between your web app and the “metal” (namely, your browser, and then the underlying OS).

Download Squad have posted a video showing IE9 Platform Preview 3 blazing past Chrome 6 in side-by-side sessions of the “FishIE Tank” canvas demo. Even on my “medium performance” machine – a Dell Latitude XT2 tablet whose graphics card gets a 3.2 on the Windows Experience Index – I have to push the fish count to 250 before the frame rate drops below 30 fps. Here’s a screenshot taken from that laptop running FishIE Tank, rendering 250 constantly moving and scaling fish sprites between 22 and 29 fps:

fishIE tanks screen shot

The Mr. Potato Gun canvas test is amusing. You load a reasonable facsimile of a popular toy into a potato gun, pull the trigger and watch the hapless tuber’s components fly all over the screen:

mr potato gun

Here’s a demo featuring a more practical use of canvas: Amazon Shelf, which presents a bookshelf of some of Amazon.com’s current bestsellers:

amazon shelf 1

Click on a book in Amazon Shelf to get a better look at its cover:

amazon shelf 2

Click on that cover and get the publisher’s blurb and customer ratings:

amazon shelf 3

Take IE9 out for a spin! Visit the IE9 Test Drive site, download IE9 Platform Preview 3 and hit some canvas-enabled sites.

download

This article also appears in Canadian Developer Connection.

{ 0 comments }

"nine" spelled using the IE logo for the "e"

Back in March, when the first platform preview of Internet Explorer 9 was released at the MIX10 conference, the IE9 team promised to release new previews of the browser about every eight weeks. Eight weeks after MIX10, they kept their promise and released Platform Preview 2. It featured improved JavaScript performance and better adherence to HTML5/CSS/JavaScript standards.

A red, green and blue "Pokeball", each with the IE logo on it

Eight weeks has passed since Platform Preview 2, and it’s time for another release. I’m pleased to announce the launch of Internet Explorer 9 Platform Preview 3! Go ahead, download it, and read on to find out what’s in this new Platform Preview.

V8 engine: "Hardware acceleration"

Not so long ago, if you were using an application, chances are that it was a desktop native app running on top of your operating system. These days, the odds are that the apps you’re running are web apps, which run inside your browser, which in turn run on top of your OS. Even if you’re not factoring in network latency, that extra layer of abstraction slows things down. Hardware acceleration is one fix to this problem, and that’s a major focus of Platform Preview 3. IE9 takes advantage of your computer’s GPU to render HTML graphics and text with greater speed.

Rocket-powered 18-wheeler truck: "JavaScript Performance"

When we say “HTML5”, we’re talking about more than just HTML and the associated styling, but JavaScript as well. Luckily, we’re not only speeding up HTML rendering; we’re also cranking up the JavaScript engine, codenamed “Chakra”, which is even faster in this release.

All this work means that IE9’s performance has been improving steadily since it was first shown (but not released) to the audience at the PDC conference in November. Here are the results of the SunSpider JavaScript benchmark for a number of IE9 iterations (and a Firefox thrown in for good measure):

Graph showing the performance of various version of IE9 previews

And here’s a “wider” version of that chart, showing more of the Esteemed Competition’s browsers:

WebKit SunSpider JavaScript Benchmark results, showing IE9 Platform preview 3 placing nicely

This puts IE9’s JavaScript performance within 50 milliseconds of the fastest browsers – that’s the time it takes sound to travel less than a couple dozen paces.

As the IE9 team will tell you, while JavaScript speed is important, many sites spend cycles in a browser’s subsystems that aren’t JavaScript. They’re always benchmarking against more than just the SunSpider test, but against some of the most popular sites on the net, a real-world test of a browser’s performance, and they’re not done optimizing yet.

By the bye, IE9’s JavaScript isn’t just fast, it adheres better to the ECMAScript standard and even implements new features in the 5th edition of the spec, known colloquially as ES5. They include new array and object methods, as well as other language enhancements for working with strings and dates, and the IE Test Drive site has some demos showing them in action.

"Three Keyboard Cats" pardoy of the "Three Wolf Shirt": "Audio and Video"

Speed is just one dimension of browsing – standards is an important one, too! The support for the <audio> and <video> tags we talked about at MIX10 has been baked into Platform Preview 3.

There is one tag that was conspicuous in its absence, leaving a number of cynics, wags and conspiracy theorists to jump to the conclusion that it would never be included in IE9. Well, it’s here…

Vincent Van Gogh: "Canvas!"

That’s right, Platform Preview 3 introduces the <canvas> tag to Internet Explorer. And it’s hardware-accelerated, too!

We’ve got a number of demos on the Test Drive IE site showing off hardware-accelerated <canvas>, including “Asteroid Belt”, shown below:

Screenshot of the IE9 "Asteroid Belt" demo

So how does Platform Preview 3 fare on the Acid3 test suite, the supposed bane of Internet Explorer’s existence? Not too shabby, jumping up to 83 out of a possible 100 (if you recall, Platform Preview 2’s score was 68):

Acid3 test result screen for IE9 Platform Preview 3: 83/100

There’s a lot more in Internet Explorer 9’s Platform Preview 3, but in the spirit of “Show, don’t tell”, I’m sending you to the IE Test Drive site to download it and take it for a spin, and please let us know what you think!

Download IE9 Platform Preview 3 now!

This article also appears in Canadian Developer Connection.

{ 3 comments }

Netbook Experiment Report #1

by Joey deVilla on January 18, 2010

the netbook experimentIn case you hadn’t read my article from Friday, I’m conducting a little experiment this week – I’m seeing what it’s like to use a “netbook“ computer (a Dell Latitude 2100, to be specific) as my primary machine for the whole week. I’m trying this out as a response to Jeff “Coding Horror” Atwood’s article, in which he rebuts my argument that the computers we typically classify as “netbooks”, occupy a neither-here-nor-there, worst-of-both-worlds middle ground between smartphones and laptop computers.

As I promised in that earlier article, I’d report on my experiences. This is the first of a number of such reports that I plan to file throughout the week.

Jeff Atwood Replies

Jeff saw my article and replied in Global Nerdy, warning me that I’d be disappointed with my particular netbook’s performance due to its Intel Atom processor:

I can guarantee you’ll be unhappy with the Atom CPU. It’s OK for light web browsing, but that’s it. That’s all. No mas.

I was disappointed, but not surprised, that Intel shows zero interest in making the next-gen Atom faster. Pineview is much better power wise but nil improvement in performance.

The good news is that the CULV Pentiums — like the dual core model in the Acer Aspire 4100 I wrote about — are about 2x faster than the Atom and surprisingly power efficient. Totally acceptable for medium duty laptop stuff.

The key to being satisfied with a netbook is to get out of the Intel Atom ghetto that Intel wants to keep them in…

Visual Studio Express 2010: Too Slow

visual studio 2010 icon As a Developer Evangelist for Microsoft, one of the tools I use most often is Visual Studio, the integrated development environment that’s typically used for developing applications for Microsoft-based platforms, from the desktop to web applications hosted on Windows Server, to mobile apps for Windows Phone and Zune to console apps for the Xbox 360. I currently run both Visual Studio 2008 and Beta 2 of Visual Studio 2010.

Visual Studio 2010 (along with the free Express versions) is the first version of Visual Studio to be built using WPF – Windows Presentation Foundation – the relatively new graphics framework for Windows desktop applications, which makes it easier to give apps the sort of modern appearance that users have come to expect these days. Visual C# Express 2010 and Visual Web Developer 2010 are based on the full version of Visual Studio 2010, and the combination of WPF and the fact that they’re beta 2 and not yet fully optimized proved to be too much for the netbook. I spent a lot of time waiting as they loaded, created new projects, switched views and built apps – more time than I thought was reasonable. I’ve since uninstalled them.

Visual Studio Express 2008: Works Just Fine

visual studio 2008 icon On the other hand, Visual C# Express 2008 and Visual Web Developer 2008 work just fine. I’m having no trouble building apps in ASP.NET MVC, Silverlight or XNA and experiencing no slow-downs. It remains to be seen if the final versions of Visual Studio 2010 with their final optimizations will run without the slowdowns.

I’ll post more updates as I have more experiences!

This article also appears in Canadian Developer Connection.

{ 5 comments }

"Extreme JavaScript Performance" (from JSConf.eu, November 7)

thomas fuchsTake a look at the slides from Extreme JavaScript Performance, a presentation by Thomas Fuchs, creator of the script.aculo.us JavaScript library, collaborator on the book Agile Web Development with Rails and one of the people behind FailCamp. He gave the presentation last week at JSConf.eu in Berlin.

In the presentation, Thomas looked at six simple things you can do to boost the performance of your JavaScript:

  • Use inline functions instead of function calls.
  • Embrace the language – using the language’s conventions yields unexpectedly faster code. Instantiate arrays using var myArray = [] instead of var a = new Array, and instantiate objects using var myObject = {} instead of var o = new Object.
  • Unroll your loops! (A trick so old that we covered it when I was in school!)
  • Cache globals. If you’re going to access a global object, store a local reference and use that instead.
  • Tune your boolean expressions: in logical “AND” (&&) operations, make the operand most likely to be false the first one.
  • Watch out for slow constructs such as with blocks, try/catch and features that JIT compilers don’t support well.

The presentation includes benchmarks for the four most common JavaScript engines:

  • SpiderMonkey (Firefox 3.5)
  • JavaScript Core (Safari 4)
  • JScript (Internet Explorer 8)
  • V8 (Google Chrome)

And yes, he does warn you – at least twice – of the dangers of premature optimization.

JavaScript Performance Rocks

JavaScript performance rocks

If you liked Extreme JavaScript Performance, you’ll love the ebook Thomas co-authored with Amy Hoy, JavaScript Performance Rocks! Actually, it’s more than just a book – it’s four books and a profiling tool:

  • Book 1: Understanding and Measuring Performance (or: “Dude, Where’s My Performance?”) – “In which our brave hero or heroine (that’s you!) apprentices to the cryptic-but-charming Master (that’s us) and learns how to get into the enemy’s head—the better to eat it alive, my dear.”
  • Book 2: Loadtime (or: “The Land of Unicorn Tears”) – “Loadtime is a sad time, a time of of enormous, slow-loading assets; of maxed-out request queues; of bloated, waddling DOMs. Of limp white screens. Most of the world’s worst web performance woes? They live and breed in Loadtime. That’s why it’s the Land of Unicorn Tears, because unicorns hate slow web apps just as much as the rest of us. And they have magical horns. So there.“
  • Book 3: Runtime (or: “’Cuz Tuning Loops is Hardcore”) – “The vast majority of the problems that the vast majority of apps will have can be solved with loadtime fixes of various stripes. But just in case you’re unique, and special, and have particularly intractable issues—or are just a glutton for punishment—we have written a third booklet, all about speeding up code when it runs.”
  • Book 4: Interface Coping Strategies (or: “If You Can’t Fix It, Fake It”) – “Come across a performance problem that you really can’t fix? Long-running calculations? Slow server you can’t tune up? If you can’t make it, fake it. You can make your app feel faster to your customers, even if you can’t fix the underlying problem. And, let’s face it, that’s what your customers care about.”
  • The DOM Monster profiling tool.

JavaScript Performance Rocks! isn’t your ordinary ebook, with material laid out for a dead-tree book simply cast in PDF form. It was designed from the ground up for onscreen reading, written in an entertaining way to keep you amused and your mind ready to learn, and written in a fun, irreverent way so that you don’t zone out. I know Thomas and Amy personally and have seen them teach; trust me – you want to learn from them.

JavaScript Performance Rocks! usually sells for US$49, but there’s a special deal right now – the first 500 books are selling for 10 dollars less — US$39. You’ve got two good reason to buy immediately: first, there’s this $10 discount, and second, the US/Canada exchange rate’s pretty good right now (as I write this, the PayPal exchange rate is CAD$1 = US$0.92).

I’ve already ordered my copy.

This article also appears in Canadian Developer Connection.

{ 2 comments }