particles
Flash / Canvas Comparison
With the canvas being a bit more prevalent and wanting to learn more about this HTML5 thing I decided to port Orion (one of my favorite projects) into JavaScript. I was curious to see the perfomance difference between the Flash Player and the (currently) fastest browser Google Chrome.
Now, I’m no JS expert so please let me know if there are any optimizations I could make but the logic is pretty sound in Flash. Keep in mind I don’t care how fast the page loads up, just how fast it performs afterward.
I also have it separated into two pages to keep the browsers from crashing or taking up too much memory. Also, to prevent crashing both demos auto throttle. As long as they can stay above 29fps they’ll add more particles. If not, it’ll throttle down and remove particles. This is checked every 3 seconds.
Below is the current test results I’ve experienced on my computer here at work. Just from what I’ve been able to experience, the Flash Player performs about 600% faster than Google Chrome. Which makes me wonder when HTML will be able to replace Flash in the interactive realm.
Also something to note, is the memory usage (which you can see in Chrome) is about the same in Canvas or Flash. Which leads me to believe that if people are complaining about performance in Flash now. Wait till people try to do the same thing in JavaScript. Same memory usage, same CPU usage, just slower.
| Browser | Particles | Particles Added Per Render |
|---|---|---|
| Canvas – Firefox 3.6.4 | 14,000 | 600 |
| Canvas – Chrome 6.0.427.0 | 50,000 | 2,100 |
| Canvas – Opera 10.60 Beta | 50,000 | 2,100 |
| Flash 10.0.45.2 | 260,000 | 11,000 |
| Flash 10.0.45.2 Debugger | 150,000 | 6,400 |
| Flash 10.1.53.64 | 270,000 | 11,500 |
| Flash 10.1.53.64 Debugger | 225,000 | 9,500 |
* All results tested with a minimum FPS of 29
Flash (Bitmap) Particle Speed Test
Update June 17
Here are the specs for my work computer as a reference:
MS Windows XP Professional 32-bit SP3
Intel Core 2 Duo E6550 @ 2.33GHz
2.0GB Dual-Channel DDR2 @ 332MHz
256MB ATI Radeon HD 2400 Pro (Dell)
78GB Western Digital WDC WD800ADFS-75SLR2 (IDE)
As you can see, nothing terribly impressive.
Orion 2.0 Preview
It’s been a while since I’ve posted anything project related. It’s not to say I haven’t been busy, quite the opposite. One of the projects I’m ready to debut is the next iteration of Orion. I posted earlier about some of my findings in loop optimizations and this is the project that I learned them on. This is just a glimpse for now, I’ll be updating Orion’s page with the source and more details. Below is a comparison of Orion 1.0 versus Orion 2.0.
Orion 1.0 – 8.6k running about 1500 – 3000 particles at 30fps
Orion 2.0 – 6.7k running about 100,000 – 130,000 particles at 30fps
Edit: (Sept 22nd 2009) Turned off scaling on the 1.0 demo, and made some updates to 2.0 (it’s still a work in progress after all)
Orion Particle Engine
- Compatibility: Flash Player 9 and later (ActionScript 3.0)
- File Size: About 2Mb
- Usage Size: 5.5kb+
Download Now (1.0.0)
What’s New
- Initial Release – Read below to find out more.
Description
Orion is an all around simple and flexible particle generator. I created Orion in order to have an easy method of creating and controlling particle effects. Orion is very fast and can handle thousands of particles and still keep frame rates high. It’s also very small weighing in at around 5.5kb.