This isn't meant to be a comparison of html/css/javascript to flex. That would be akin to bringing the 17th mac n' cheese casserole to the neighborhood potluck.

I may be late to the party, but there were some refreshing things about developing in flex that weren't part of the official pitch that folks might be interested in. Specifically, I was very impressed by the ubiquitous support for vector graphics in the flash runtime.

You don't have to know a lot about graphics in general to appreciate this: using vector graphics makes implementing more flexible user interfaces a heck-of-a-lot easier. And when I say heck-of-a-lot, I mean a whole heck-of-alot (as in non-fractional). The reason for this is simple: vector graphics can be rendered at any size, and still look the same.

One of my least favorite activities in HTML is making workaday components like buttons, tabs, headers more graphically spicy. It's a necessary task, but assembling them takes time, and they're always brittle. There's usually several contexts in which you place them where they don't look right, or require some tweaking, and worst of all, they're almost never resizeable along both the X and Y axis. That's because the gradients, borders, and images on cross browser HTML components use raster graphics.

Like I said, the thing I found nicest with flex was that you can use vector graphics to skin components so that if the the scale of a component (or the scale of one of it's parents!) changes, so do all the backing graphics. That includes borders, gradients, hover-effects, you name it. All with absolutely no effort on you, the programmer's part.

That doesn't mean that you can't play with pixel data to your heart's content. After all, even vector images have to be rendered to a set of pixels so that they can be displayed on your screen.... and that's the best part, with it's component filtration system, flex gives you raw access to all of the pixels of your entire user interface before they are actually painted onto the display. That means you can cut, displace, color, twist, swirl not just graphics, but your actual UI to your heart's content. Of course, you don't need to do all those things except once in a blue moon, but all the same, it's a comforting thought to know that it's there.

Mainly, the idea that you can scale and stretch components to the particular task at hand is the big time saver.

But, enough talk. A picture is worth a thousand words. Here is a little demonstration of what I'm talking about. This is my first Flex toy application which I built using only a text editor and the freely available flex SDK. It is an SVG image of a tournament bracket with buttons as the starting team names. As you can see, you can adjust the scale of the tournament bracket and everything, including background and buttons, scales accordingly.

To demonstrate the pixel data munging, I've overlayed it with a magnifying glass which displaces the pixels to produce the magnification effect. While it is in place, you can use the arrow keys to adjust the size and magnification of the glass itself.

Pretty neato, and very little code indeed!