Html5 framerate?

It's largely dependent on the JavaScript engine. V8 (Chrome) and Carakan (Opera) are probably the two fastest production-quality engines. TraceMonkey (Firefox) and SquirrelFish (Safari) are far behind, with KJS bringing up the rear.

This will change as hardware acceleration enters the mainstream As for specific optimizations, we'd probably have to see some code. Remember that the canvas supports compositing, so you really only need to redraw areas that changed. Perhaps you should re-run your benchmark without the canvas so you know if the drawing operations really were the limiting factor If you want to see what can be done now, check out: js1k Bespin Canvas-stein.

It's largely dependent on the JavaScript engine. V8 (Chrome) and Carakan (Opera) are probably the two fastest production-quality engines. TraceMonkey (Firefox) and SquirrelFish (Safari) are far behind, with KJS bringing up the rear.

This will change as hardware acceleration enters the mainstream. As for specific optimizations, we'd probably have to see some code. Remember that the canvas supports compositing, so you really only need to redraw areas that changed.

Perhaps you should re-run your benchmark without the canvas so you know if the drawing operations really were the limiting factor. If you want to see what can be done now, check out: js1k Bespin Canvas-stein.

Js1k is what lead me to think that canvas was ready for the mainstream. Having a closer look it seems that some get really good performance and others don't doing similar things. I profiled my code using console.prolfile().

~90% of the time was spent drawing. I could possibly get some extra performance using composting but I would have to write a manager to work out what areas of the screen need to be redrawn. It would add a lot of complexity – skorulis Sep 11 '10 at 3:37.

I have written a simple bouncing ball which gives you points if you click it. It works fine in Firefox, Safari, Chrome and on the iPad. However, the iPhone 3G/3GS were horribly slow with it.

Same goes for my older Android phone. I am sorry but I do lack specific numbers.

Chrome is the only browser thus far that I've seen high framerate results with. You might also want to try the latest Preview of IE9. That should give you a decent benchmark of how the next generation of browsers (with hardware acceleration for HTML5) will handle your code.So far, I've seen that IE9, Chrome 7, and Firefox 4 will all sport some form of hardware acceleration.

That was one of the main things I wanted to target. No point making something if I'm going to have to wait 3-5 years for a decent amount of people to be able to run it. – skorulis Sep 10 '10 at 12:22 Well, what did you expect?

You will have to add a GeForce card to your iPhone to speed this one up (and I must say, I'd love to see a picture of that). By the way: Chrome and the iPhone use the same rendering engine. What you see are only differences in calculating power.

– Boldewyn Sep 10 '10 at 12:30.

There's loads of optimizations to be done with Canvas drawing. Do you have example code you could share?

In order to make animations more efficient, and to synchronize your framerate with the UI updates, Mozilla created a mozRequestAnimationFrame() function(1) that is designed to remove the inefficiencies of setTimeout() and setInterval(). This technique has since been adopted by Webkit for Chrome only. In Feb 2011 Paul Irish posted a shim(2) that created requestAnimFrame(), and shortly afterwards Joe Lambert extended it(3) by restoring the "timeout" and "interval" delay to slow down animation ticks.

Anyway, I've used both and have seen very good results in Chrome and Firefox. The shim also fallsback to setTimeout() if support requestAnimationFrame() is unavailable. Both Paul and Joe's code is online Joe's repository at github(4).

Hope this helps! (1): hacks.mozilla. Org/2010/08/more-efficient-javascript-animations-with-mozrequestanimationframe/ (2): paulirish.Com/2011/requestanimationframe-for-smart-animating/ (3): blog.joelambert.co.

Uk/2011/06/01/a-better-settimeoutsetinterval/ (4): gist.github. Com/1002116/ Sorry for the links, stackoverflow wouldn't let me post actual hyperlinks :(.

I should clarify, after applying it to your code I'm getting 60fps in chrome and firefox. This 60fps is intentional as it synchronizes the frame update with the UI update. For a proper technical explanation why, see nczonline.Net/blog/2011/05/03/… – adamrmcd Jul 11 at 18:42.

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.