Why is windowless mode (wmode) so bad?

I wrote up an explaination of wmode in April on why you should never enable it when building Flash or Flex sites — if you need to overlay DHTML type menus or controls over top of a flash control, you’re probably a great candidate for Flex and building an RIA.

There are pro’s and con’s to RIA development, and insomuch as the SEO community has turned their back on Flash as a viable platform for SEO compatible content (which is very shortsighted and misguided, but who’s going to argue with such frenzied zelots) i generally turn to Flash and Flex to solve problems not be a problem.

I had to justify not turning wmode on. wmode is a very bad thing, as opposed to how AJAX/DHTML devs will always want it on so they can build out more of the site and leave flash in the component level stuff only. Now, i’ve compiled a lot of references at the end, but if i need to correct or attribute anything i’ve missed in this please comment me here, i’ll correct it and make sure you’re properly listed. Also, i’ve come up with a number of my own assumptions from the years of leading application development in windows but some of my observations may be inaccurate but i believe the meaning is correct and clear. I would love Adobe to come up with a white paper that noted these issues and possible alternatives or SEO strategies that in the corporate world we could use that would turn back the barbarians at the gates.

Windowless Mode (WMODE)
Bela Korcsog
April 30, 2008
What is Windowless Mode?
There are three window modes available with the Flash player across most browsers and
platforms. The wmode parameter is available in the object/embed tags used to place the
Flash swf (compiled application) on stage. There are three options available for this
parameter:
“window” (default)
Use the Window value to play a Flash Player movie in its own rectangular window on a
web page. This provides the fastest performance.
The Flash Player is assigned a hWnd resource by default in Windows. This display instance
exists above the html page as rendered and is independently memory managed. Although
this appears as if it is part of the html page, it isn’t actually a member. Flash is at this point
independently managing the rendering of this component on stage and does not rely on
the redraw status of the html page (asymmetrical threading). This independence of the
current DOM allows for the best user experience, at the sacrifice of interaction using DIV
layers. This is why when using this mode you cannot place objects below or above the
flash object and have them appear as expected.
Macintosh browsers work differently and wmode is not required for interation with the swf,
but redraw issues will become evident when interacting with the swf during animated
sequences.
“opaque”
By using the Opaque value you can use JavaScript to move or resize movies that don’t
need a transparent background. Opaque mode makes the movie hide everything behind it
on the page. Additionally, opaque mode moves elements behind Flash movies (for
example, with dynamic HTML) to prevent them from showing through. Animation
performance and video playback will be affected by this setting.
In this mode, the swf content is drawn to the page directly using the intervals associated
with the browsers instance, which can affect performance. In this mode the redraw beacon
is managed by the browser, as opposed to the flash player instance, which can also be
affected by other redraw requests occurring on the page at the same time. This allows the
flash object to be a member of the current page’s z-order and allow elements of the page
to interact with the swf redraw region. The benefit of this option over transparent is that
the browser does not have to draw any elements below the swf on the page on interval,
which does provide an improved experience over the ‘transparent’ option.
“transparent”
Transparent mode allows the background of the HTML page, or the DHTML layer
underneath the Flash movie or layer, to show through all the transparent portions of the
movie. This allows you to overlap the movie with other elements of the HTML page.
Animation performance and video playback will be slower when you use this value.
In this mode the elements that appear below the flash movie are drawn into the
rectangular region where the swf resides on redraw beacon interval, then the contents of
the swf are drawn over top of this bitmap, once per interval. This is the poorest performing
option and should be avoided if possible. Generally there are alternatives that should be
investigated before using this option.
Windowless Mode is available in most modern browsers on all platforms, but behaves
differently in each platform and browser. The most consistent experience with use of Flash
swf’s is to set windowless mode to ‘window’.
Windowless Mode Issues.
Here’s a short list of wmode issues related to various browsers. Windowless mode can be
considered a function of the host browser, and as such has inconsistent behaviour between
different hosts.
Browser legend:
[IE] Internet Explorer, [FF] Firefox, [SF] Safari, [OP] Opera (Wii) [Any]
1. [Any] When using a transition between states the resize effect flashes the final
resize state before resizing (more apparent with wmode set to opaque or
transparent)
https://bugs.adobe.com/jira/browse/SDK-12421
2. [FF] When using wmode=opaque or transparent text input fields do not allow
special characters
https://bugs.adobe.com/jira/browse/SDK-12420
3. [FF] Wheel mouse does not work in Firefox when wmode is set to opaque or
transparent
https://bugs.adobe.com/jira/browse/SDK-12415
4. [Any] Flex TextInput does not gain focus when cursor is in text field of iframe
https://bugs.adobe.com/jira/browse/SDK-12377
5. [IE] Multiple SWF embeds, wmode enabled, fullscreen requested (FP 9.0.115 >), on
exit of fullscreen mode, out of focus flash movies will not be redrawn.
6. [IE] SetInterval will be constrained to enterframe count with wmode enabled. Will
cause redraw and performance issues.
7. [Any] Fullscreen not available with FP 9.0.23 – FP 9.0.100 when wmode enabled.
8. [Any] Animation sequences / Video will stutter and show empty frames (effect
more prevalent in FF). Animated sequences of bitmaps show blank frames (memory issues), video will stutter or skip frames unnecessarily. Generally the issue is related to memory management – with wmode enabled all aspects of the scripting engine is throttled and swapping of memory is
handled poorly.
9. [Any] Text fields may be offset from their natural location during text entry if page
is scrolled.
10. [Any] Text field tabbing will not function if wmode is enabled.

References:

http://blog.headlondon.com/2006/06/02/no-wmode-please-were-british/
http://www.adobe.com/devnet/flashplayer/articles/full_screen_mode.html
http://www.lostinactionscript.com/blog/index.php/2007/03/23/flash-on-flash-for-hybridsites/
http://www.dylansmith.info/2008/01/25/nasty-wmode-bug-in-firefox-2/
http://viconflex.blogspot.com/2007/11/using-floating-iframes-in-flex-3-beta.html
http://codingforums.com/archive/index.php?t-95109.htmlhtml
http://justin.everett-church.com/index.php/2006/02/23/wmode-woes/
http://www.mail-archive.com/wsg@webstandardsgroup.org/msg31205.html
http://forum.spreadshirt.net/showthread.php?t=1791
http://www.sephiroth.it/phpBB/showthread.php?t=9268
http://www.themidnightcoders.com/blog/2006/12/mixing-html-and-flex-usingiframe
http://www.flexforum.org/index.php?showtopic=719&pid=1529&mode=threaded&start=#entry1529
http://www.openlaszlo.org/jira/browse/LPP-5482
http://www.digitaljuice.com/community_forums/tm.asp?m=22787