I told you, a lot of stuff is happening lately for Flash developers. I am happy to announce that we just posted a new Flash Player 10.2 Beta on labs. I will not cover here all the questions that are covered already in the FAQ and release notes but I would like to focus on the new features introduced in this new beta:
- Internet Explorer 9 hardware accelerated rendering support – Flash Player takes advantage of hardware accelerated graphics in Internet Explorer 9, utilizing hardware rendering surfaces to improve graphics performance and enable seamless composition.
- Stage Video hardware acceleration – A new method for video playback in Flash Player allows developers to leverage complete hardware acceleration of the video rendering pipeline, enabling best-in-class playback performance. Stage Video can decrease processor usage by up to 85% and enables higher frame rates, reduced memory usage, and greater pixel fidelity and quality.
- Native custom mouse cursors – Developers can define custom native mouse cursors, enabling user experience enhancements and improving performance.
- Support for full screen mode with multiple monitors – Full screen content will remain in full-screen on secondary monitors, allowing users to watch full-screen content while working on another display.
Obviously, there is no much code I can show you regarding IE9 GPU compositing, the Flash Player does this automatically by leveraging the new GPU compositing APIs on IE9 to actually render the Flash Player frames as surfaces and push them on screen through Direct3D9 whatever wmode value you use. Note that graphics computing is still done by the CPU but we use GPU APIs to composite and blit the Flash Player frames on screen. It is similar to what we did in the past with CoreAnimation on MacOS with Safari. This will improve rendering performance on existent content without any modifications.
Concerning Stage Video, this feature has been sneaked at FOTB earlier this year and at Max last month by Tinic. We are very happy to announce that YouTube is already leveraging Stage Video. This will dramatically change the way video performs in Flash and bring native video performance on MacOS, Windows and Linux. For more infos about the YouTube work, check the Flash Player team's blog post.
I wrote a complete article on Devnet which goes into the details of StageVideo and wrote a very simple video player to illustrate how the StageVideo APIs work. Check also Lee Brimelow's great video tutorial about it.
Here is a snaphost of the demo using Stage Video, playing the Big Buck Bunny movie in 1080p on my MacBook Pro :
For comparaison, here is a 720p video playing on YouTube, using about 40% of my MacBook Pro CPUs with Flash Player 10.1 :
Now, let's browse to same video with Flash Player 10.2 with Stage Video, CPUs usage drops to 9% :
Pretty cool, hu ? If you make the test on YouTube, make sure you wait a few seconds, some ActionScript logic in the YouTube player makes the CPU usage go wild for a few seconds before reaching its normal state.
For info, the performance improvements are way bigger if you overlay content on top of video. In some cases, CPU usage can drop from 200% to 10% using Stage Video, check my first post about Stage Video for more infos.
While listening to my track and browsing the web through another tab, the pause and resume feature introduced in Flash Player 10.1 stops rendering the frames and only decodes sound. Flash Player CPU usage then drops to 5% :
But that is not all, we added another nice feature related to cursors. A highly requested feature. The idea is simple, no more Mouse.hide() or onMouseMove handler or startDrag to have a custom cursor. You can now directly work at the OS level and assign your own custom native bitmap-based cursors. Here is a little code sample which illustrates the idea:
// we create a MouseCursorData object var cursorData:MouseCursorData = new MouseCursorData(); // we specify the hotspot cursorData.hotSpot = new Point(15,15); // we pass the cursor bitmap to a BitmapData Vector var bitmapDatas:Vector.<BitmapData> = new Vector.<BitmapData>(1, true); // we create the bitmap cursor (bitmaps should not be bigger than 32x32 pixels, this is an OS limitation) var bitmap:Bitmap = new zoomCursor(); // we pass it to the bitmapDatas vector bitmapDatas = bitmap.bitmapData; // we assign the bitmap to the MouseCursor object cursorData.data = bitmapDatas; // we register the MouseCursorData to the Mouse with an alias Mouse.registerCursor("myCursor", cursorData); // whenever we neeed to show it, we pass the alias to the existing cursor property Mouse.cursor = "myCursor";
Pretty cool? But wait, there is even better, you can also pass a series of BitmapData objects, then pass a specific frame rate and get automatic native animated cursor:
// we create a MouseCursorData object var cursorData:MouseCursorData = new MouseCursorData(); // we specify the hotspot cursorData.hotSpot = new Point(15,15); // we pass the cursors bitmap to a BitmapData Vector var bitmapDatas:Vector.<BitmapData> = new Vector.<BitmapData>(3, true); // we create the bitmap cursor frames (bitmaps should not be bigger than 32x32 pixels, this is an OS limitation) var frame1Bitmap:Bitmap = new frame1(); var frame2Bitmap:Bitmap = new frame2(); var frame3Bitmap:Bitmap = new frame3(); // we pass it to the bitmapDatas vector bitmapDatas = frame1Bitmap.bitmapData; bitmapDatas = frame2Bitmap.bitmapData; bitmapDatas = frame3Bitmap.bitmapData; // we assign the bitmap to the MouseCursor object cursorData.data = bitmapDatas; // we register the MouseCursorData to the Mouse Mouse.registerCursor("myAnimatedCursor", cursorData); // we just pas a frame rate cursorData.frameRate = 1; // whenever we neeed to show it, we pass the alias to the existing cursor property Mouse.cursor = "myAnimatedCursor";
Very simple, but so cool. Game and RIA developers will love this feature.
Another addition, we enhanced the full screen behavior by allowing one screen to stay full screen while working on the other screen. This feature was also highly requested by the community and video industry. Very nice feature for Hulu, YouTube and other video websites.
A lot of people expressed the need to actually detect if the current context allowed the SWF to go full screen. This would allow you to detect this at runtime and react appropriately. Departing from Flash Player 10.2, you will be able to use the allowFullscreen property on stage:
if ( !stage.allowFullScreen ) throw new Error ("Please use the allowFullScreen HTML tag.");
Finally, a little improvement regarding Flash Player version info in the context menu, Here is what you have today when right click, no way to know which exact version you have running :
Here is what you will get starting from 10.2 :
I agree, it was about time. But yes, way easier now
To use those new APIs you need to use the special build 18623 of the Flex SDK 4.5, from the Hero Stable Builds table here.
You also need to use a specific compiler argument –swf-version=11 to target SWF11.
I hope you guys will enjoy those features. Give it a try and let us know about bugs or any feedback you may have, thanks!