Thursday, October 15th, 2009
Even Crazier Times: HTML Rendering… in Flash
>On Monday we saw someone rewriting an HTML renderer in Canvas. Continuing the fun times we see an open source project that does the same thing, but using Flash ActionScript thanks to one of the comments on our last post:
Wrapper is a cross-browser compliant HTML/CSS rendering engine written in ActionScript that sits on top of your standards compliant HTML page. Wrapper eliminates cross-browser issues and makes integrating ActionScript and HTML/CSS projects possible without needing to compile.Wrappers strives to answer the most common problems web designers face without forcing them to learn too many new things. Most web sites can be created in HTML or CSS, then when you need to extend Wrapper’s capabilities you can either use JSON to call functions within ActionScript or you can load compiled plug-ins. Wrapper also has built in methods within CSS to load custom fonts, display elements as any shape, and fill them with linear or radial gradient background colors. ActionScript’s event model is also implemented within Wrapper’s HTML. Wrapper’s best features are the ones that you get for free because of how it is set up. It’s like getting all the great features of the Flash Player without needing to deal with compiling and being able to create your content the same way any HTML page would be created. Wrapper is fully accessible to the search engines and integrates well with any back-end technology.
Wrapper is currently released as a fully functional open source beta for Flash Player 9. Wrapper is set up as a pre-compiled plug-in but can easily be integrated into any Flex or AIR applications or even as an ActionScript framework for creation of compiled projects.
Check out the demos:
- http://motionandcolor.com/wrapper/ ( WordPress example )
- http://motionandcolor.com/wrapper/examples/ActionScriptExample
- http://motionandcolor.com/wrapper/examples/WrapperWithEmbedFlex
- http://motionandcolor.com/wrapper/examples/FlexProjectExample
Related Content:












Whats next, ActionScript parsing JavaScript ;)?
The next big one will be a tool to convert Flash into JavaScript/HTML/CSS.
How about Google’s ChromeFrame in Flash? :)
There’s a few projects that can create output to Flash or HTML/JavaScript. Most of you probably know about Openlaszlo and there is also Haxe which can compile to a number of other languages also, JavaScript, Flash, PHP and many more.
Looks very good!
We’ve been working on an AS3 HTML/CSS parser, and we are currently including it in one of our projects. It works pretty well, but we’re just using it, because of some legacy systems spitting out HTML code, but the data needs to be rendered in Flash. We only support a small subset of HTML elements, as well as CSS properties, although we also incorporated a few HTML5 and CSS3 elements/properties.
We might release our code under an open license. What will the license of Wrapper be?
Ah, lovely. Reinventing the wheel by using 12 smaller wheels.
I honestly can’t decide if this is something that some people might consider useful or if it’s a joke.
Adobe could include the Webkit version they ship as part of AIR with the Flash Player. I head they don’t want to do this because it would increase the download size of the Flash Plugin… In my opinion this is stupid, if they included a current webkit with Flash and this new version of the Flash Plugin had spread across enough computers many web developers would consider using Flash for rendering in Internet Explorer. In comparison to Chrome Frame the Flash Plugin is already installed on most computers and is also allowed in most corporate IE6 environments.
I actually think it makes a lot of sense to ship your renderer with your document- call me tired of browser incompatibility. ;-P
There are actually a bunch of other actionscript projects that have been trying to do this for years, including one called DENG. There is also basic html support in the Flex Framework 4.x (and in Text Layout Framework – same code base).
http://deng.com.br/
” In the end we already have ActionScript which is much faster and more powerful then a runtime JavaScript parser will ever be”
.
So… How’s that cave you’ve been living in the last 2 years?
I don’t have any benchmarks, but javascript (at least in webkit) should not be much slower than AS3. The biggest problem ob JavaScript right now is the lack of a “ByteArray” binary data type. Strings or normals Arrays are just not as fast as a native ByteArray type can be. I hope this will change in near future.
The last commit date shows February 2008. Why took it so long for Ajaxian to publish this ? Just a late birthday present ?
“” In the end we already have ActionScript which is much faster and more powerful then a runtime JavaScript parser will ever be””
Firefox 3.5 and Actionscript 3.0 both use the Mozilla tracemonkey JIT engine to compile ecmascript to bytecode…
So ActionScript and JavaScript will use the same engine type in FF 3.5.
It does crash in Chrome.