Over a million developers have joined DZone.

The Top 10 Things You Should Know About Flex

DZone's Guide to

The Top 10 Things You Should Know About Flex

· Web Dev Zone ·
Free Resource

Access over 20 APIs and mobile SDKs, up to 250k transactions free with no credit card required

Flex is getting a lot of buzz lately. A lot of people may be interested in using it just because they’ve heard good things, but they aren’t really sure if it fits in with their current skills or their project needs. In this article I’ll discuss the top 10 things you need to know about Flex, whether you’re considering using it for your personal site or for your business.

1. Flex is Web Standards, Redefined

MXML is the standard language for Flex applications, as it allows a developer to draw up the structure of the application—including not only the layout but the class structure as well—in easy-to-ready markup. This makes it easy for people coming from a web design or development background, as MXML markup is analogous to HTML. Similarly, the ActionScript within a Flex application is comparable to JavaScript, and Flex uses web-standard CSS to control layout. It’s also a great way to build the structure of an application, as the tree-like nature of the language melds perfectly with a typical application’s container-component model. Along with this, source code is easy to distribute, as it’s not a binary IDE-specific file, but simple human-readable text files.

[img_assist|nid=5241|title=|desc=|link=url|url=http://oreilly.com/catalog/9780596517328/|align=right|width=187|height=225]It’s worth mentioning that MXML is a kind of shorthand for ActionScript, the ECMA-compliant scripting language. This is because MXML gets converted into ActionScript 3 at compile time. Thus, it's entirely possible to build a Flex application in ActionScript 3, without using or learning MXML. For many applications, however, MXML interspersed with ActionScript is the way to go.

2. Flex is Flash (and then some)

If you're familiar with the lightweight vector animations and advanced user interfaces that Flash has provided in the past, you're no stranger to Flex. Flex is built on top of Flash Player, the engine behind all Flash content. In this regard, there's nothing Flash can do that Flex cannot.

All of the filters, display programming, drawing API, and animations that are inherent in Flash are completely visible to Flex. However, Flex gives structure to Flash applications, providing a nice set of user interface components and containers that help developers write powerful and scalable applications.

3. Flex Just Works

Many companies are switching their software from Java to Flex. This is because Flex offers many of the same benefits as Java—namely, cross-OS "write once" abilities and a modern object-oriented architecture, but in a much smaller package and with loads of extras. Flex applications have the ability to work both as web-based software as well as desktop software (with Adobe AIR), and doing so can utilize a single code base.

Because Flex is built on top of the ubiquitous Flash Player, whatever you write will work on any machine that has the player installed. And that's a lot of machines—the vast majority of Internet-enabled computers—with Flash Player 9 reaching into the high 90th percentile. Flash Player shelters you from cross-browser inconsistencies, keeping your software free of silly bugs and bloated code, and software rewrites with new browser releases. Animations and video will play the same on one machine as they do another. When you build your code for Adobe AIR, you'll instantly have a cross-OS desktop application, running on Mac OSX, Windows, and Linux in one fell swoop.

4. Flex is Server Agnostic

Flex was made for data, and it can accept data in the most common formats and interact with the most common servers. This includes XML loaded either locally or remotely, JSP, PHP, ASP, ColdFusion—you name it. You can download information via HTTP or SOAP web services, and can even hook directly up to Java server objects or transfer binary data over-the-wire. Adobe AIR has the additional ability to read and write to SQLLite databases. If you have a particular back-end service, chances are Flex is going to be able to use them—and in most cases it's going to be simple.

With a great set of service components in the framework, more often than not you'll be able to grab your data in a few lines of code, and bind it directly to UI components. If you find you need more refined control, you even have access to binary sockets and (in Flash Player 10) even local files.

5. Flex is the Look You Want

The default look-and-feel of a Flex application is highly configurable. Due to the programmatic skinning at its core, a Flex application can be styled to your heart's content—changing colors here and there, modifying opacity, or changing the shape and size of the most common UI controls. And all of this can be done through standard CSS. Although, CSS is not a requirement, as MXML also allows one to modify styles and skins through simple markup. If you're using Flex Builder, you have an entire WYSIWYG editor for your application, allowing you to draw or plug in graphics and have all of the CSS written for you. In addition to this, there's a ton of themes for Flex applications, allowing you to change the entire look with a single line of MXML code.

It's worth noting that Flex, unlike Java or JavaScript, does not inherit the UI from the operating system in which it is run. That is to say, a Flex application running in Mac OSX will not have buttons that look like Mac buttons, and calling a Flex Alert box will not display a Mac alert sheet. Flex has its own look and feel built in—but if that operating-system look is one you're going for, there are a few themes available which can closely mimic this.

6. Flex is Light, and Fast

Built on ActionScript 3, the Flex framework is surprisingly speedy. Initialization times have been improved dramatically over ActionScript 2, and built-in support for lazy instantiation helps a great deal. Using a new JIT (Just-in-Time) compiler, your code runs blazingly fast. Rich data visualization and advanced animations are entirely possible without hogging the user's CPU. While lots of 3D animations have been the bottleneck in the past, new support in Flash 10 may help. There's even hardware acceleration for video, to take advantage of modern graphics processing cards.

Although some will argue otherwise, Flex is light, as well. While using a set of UI components will definitely be larger than made-from-scratch ActionScript coding, the components are small considering how powerful they are. In fact, a typical application built using an AJAX framework can oftentimes run larger than a similar Flex application. The Flash Player itself is a download of a few megabytes, though it's often pre-installed on computers. It's also worth mentioning a new feature, called framework caching, can shave off a good part of the download for the framework components. This feature can store the standard Flex UI components on the user's machine so that other Flex applications will load instantly, without the overhead of downloading the entire framework. This can allow advanced applications that run under 100kb.

7. Flex is Accessible

There has been a fuss over the accessibility of Flash for some time, and for good reason. It's often misunderstood that Flash content is inherently not accessible, but that's far from the case. While there's a lot left to be desired, Flash has the ability to interact with screen readers. In fact, the Flex framework of components has a very good implementation for accessibility for screen readers and keyboard navigation, and all that most Flex developers will need to do is flip a switch to turn this on (it's off by default).

In comparison with many AJAX components, Flex fairs extremely well. This is because, while HTML is accessible as-is, creating a JavaScript framework around this often breaks many native accessibility features. In contrast, Flex has been built with accessibility in mind from the get-go.

8. Flex is SEO-Compatible

In the past, building a website on top of the Flash Player was a Search Engine Optimization (SEO) nightmare. This is because the software that's used to view web pages was not aware of .swf files, the binary file which Flex applications are compiled into. Modern search engines eventually added the capability to read the internals of .swf files, such as hyperlinks and blocks of text, and this helped a bit.

However, the problem with building a site completely in Flash/Flex is that the relationship of different views of the site—tabs, etc.—are not understood by the search engine bots. To them, it's just a single page (with maybe a bit of text). With the way that Flex applications are compiled, the readability of the .swf is even more difficult. Fairly recently, Adobe released a special version of Flash Player just for search engine bots which will allow the bots to go much deeper, so expect better results soon. However, if SEO is a primary goal of yours, it's not advisable to solely use Flash for your site. It's still better to use HTML interspersed with Flash content, or to have the main page in HTML with a separate section in Flash. Note that MXML code gets compiled into a .swf, and this markup isn't viewed by search engines.

9. Flex is Free, and Open

Flex is now fully open-source. The source code for the entire framework is released, and comes with every copy of the Flex SDK or Flex Builder. This means you can see how things work internally, as well as debug the framework and even modify it for your own use. What this means is a better framework, aided by you and other Flex developers, from here on out.

Flex is also free— it's free to develop with the Flex SDK and compile it using the free mxmlc compiler. Unlike earlier versions, Flex does not require a special (i.e. expensive) server to run. You simply create a compiled application and distribute this on your server of choice. Of course, a copy of Flex Builder will cost you, if you decide to develop using this Eclipse-based IDE. But the cost is not great, and prices were recently lowered on this premier development tool.

10. Flex is Easy to Learn

Flex is—dare I say it—easy to learn. MXML markup is surprisingly simple to understand, and takes away a lot of the complicated syntax of developing in pure ActionScript. If you've ever used HTML and CSS before, you're halfway there. Once you've learned the basics of MXML, you can begin to gently learn ActionScript, making your applications more interactive. The Flex framework provides a robust set of user interface components that speed up development, and learning their basic use is a manageable task.

This is true especially once you begin using ASDocs, the provided documentation for Flex. ASDocs is probably the most sophisticated and streamlined set of documentation for any programming language today. Add to this the fact that the primary development environment, Flex Builder, helps you get started quickly, letting you visually structure your applications in Design mode, and giving you the most common tasks at your fingertips. There are also a number of good books out there, ranging from absolute beginners in programming, to those switching to Flex from another language, and everything in between.

Original Author :

Alaric Cole, author of “ Learning Flex 3,” published by O’Reilly Media, has been working with Flash technologies since the introduction of ActionScript. Once Flex came on the scene, he has focused primarily on Flex development, creating enterprise applications with rich data visualization, interactive media, and advanced components. Alaric continues to use Flex in his daily work at Yahoo's prestigious Flash Platform team, leading development and consulting on the newest Flash and Flex projects across the company.

#1 for location developers in quality, price and choice, switch to HERE.


Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}