02 June 2009 ~ 4 Comments

What Makes Flex 4 different from All the Previous Versions?

Now that the Flash Builder and Flash Catalyst betas have been released on labs, we are going to see a huge influx of people taking their first look at what Flex 4 has to offer. Many of them are going to be migrating from Flex 3 and they are going to see a lot of changes about how things work. Concepts that were very familiar in Flex 2 and 3 are now overlayed with new options that make cause for a lot of study. So what really has changed about Flex 4? I believe there are 2 themes that need to be discussed to answer that question.

The first theme is the idea of what Flex is. For every release up until this point there has been this concept of a namespace. We were required to declare the mx prefix and alias it to a URI for Flex. We have always done it, it was required, but not many have dug into what that is actually doing for us. At the bare minimum it references a manifest file which has a list of components that should be included in the library associated with the prefix. But at a deeper level you are also selecting what version of the MXML language you were using. Because in every single previous release there was only one MXML language available and one component set available for the release, we only had to declare one namespace. But in that regard Flex 4 is completely different. When you consider Flex 4 its not just one MXML version and one component library. In fact when working with the Flex 4 SDK you have three (3) languages (MXML 2006, MXML 2009 and FXG 2008 )available and two (2) visual component libraries (Halo and Spark) to choose from. The fact that we have lost that one-to-one pairing necessitates the use of multiple namespaces to make use of all these features. You will choose from the primary MXML language namespace and then potentially include a second namespace which accesses the component library of your choice. However the beauty of this is that MXML 2006 and MXML 2009 languages can be intermixed when using the Flex 4 SDK. The primary note to take away with theme 1 is the version of the framework you use is no longer as important to the version of the MXML language you choose as your base.

The second theme is about leveling the playing field around implementation. In the MXML 2009 language and in the Spark component set, I think the greatest achievements have been the ones that allow us to adapt and build components without having to override core built in behaviors. A perfect and wonderfully simple example of this is skinning. The skins for the visual components in Spark assign their initial UI in exactly the same manner we use to override it. That is the full visual implementation of a component is in a Skin class which we can copy, or completely replace. The life cycle for components has been adjusted so that we can very easily replace the built in skins with our owns, and we have been given the visual tools required to build those skins. In that same manner Adobe has opened the door for alternate UI frameworks to live right along side the built in Halo and Spark component sets. By separating the language from the list of component implementations you can now choose to use MXML with Spark and Halo, or with a completely separate UI framework like OpenFlux or OpenPyro. These UI frameworks can take full advantage of the MXML language for layout, but without having to be built on top of the existing Halo components to be displayed. This is an amazing treat and something that could allow us to truly take the Flex SDK and MXML as a language beyond the boundaries we currently abide by. It is completely feasible that we could create a component framework specifically for mobile that takes advantage of FP 10 in the browser of mobile handsets and through devices on the Open Screen Project.

In the end I think its important to keep in mind that Flex 4 is not just an increment in the version number. It is truly a step forward for the framework in terms of openness, functionality and design. The upgrade may cause some changing in how you relate to it, but it is all for the best.

4 Responses to “What Makes Flex 4 different from All the Previous Versions?”

  1. Arpit 2 June 2009 at 2:03 pm Permalink

    Well said. The Flash Builder release is definitely a big step towards a really potent IDE and not tying it down to Flex in either name or the choice of framework is great to see. Some initial tests done by you and another developer on the OpenPyro mailing list show a lot of promise in making frameworks available to developers whose projects cannot afford the Flex framework for different reasons.

    Integration of FlexUnit, ASDoc preview, Network Monitor etc is just icing on the cake.

  2. marc esher 2 June 2009 at 7:06 pm Permalink

    thanks for the explanation, Sim. I can see how some folks might see the multiple namespaces as potentially confusing, but to me, it makes a hell of a lot more sense compared with the non-namespaced fxg stuff from the gumbo alpha. as a developer, I feel… I don’t know… empowered, maybe? yeah, that’s the right word. To me it says, “here’s your tools, now go kick some ass”, in a way that the alpha implementation didn’t.

  3. Jay 3 June 2009 at 2:11 am Permalink

    Loved the article. Thanks for educating the masses.

  4. Jason Langdon 3 June 2009 at 3:17 pm Permalink

    Well where was that explanation when we needed it? It sure could have come in use on this thread – http://iamdeepa.com/blog/?p=34

    Thanks for putting things so succinctly!


Leave a Reply

PHVsPjxsaT48c3Ryb25nPndvb19hYm91dDwvc3Ryb25nPiAtIEhpISBNeSBuYW1lIGlzIFNpbWVvbiBCYXRlbWFuIGFuZCBJIGFtIGEgd2ViIGFwcGxpY2F0aW9uIGRldmVsb3BlciBzcGVjaWFsaXppbmcgaW4gdGhlIEFkb2JlIEZsYXNoIFBsYXRmb3JtLiAgSSBhbSBhbiBBZG9iZSBDb21tdW5pdHkgUHJvZmVzc2lvbmFsIGFuZCBhbiBBZG9iZSBDZXJ0aWZpZWQgVHJhaW5lciBmb3IgRmxleCBhbmQgQUlSLiAgSSBhbSBhbHNvIHRoZSBQcmluY2lwbGUgSW5zdGlnYXRvciBmb3IgUE5XIFJhaW4gTExDIGEgUklBIGNvbnN1bHRpbmcgYW5kIG1lbnRvcmluZyBjb21wYW55LjwvbGk+PGxpPjxzdHJvbmc+d29vX2Fkc19yb3RhdGU8L3N0cm9uZz4gLSB0cnVlPC9saT48bGk+PHN0cm9uZz53b29fYWRfaW1hZ2VfMTwvc3Ryb25nPiAtIGh0dHA6Ly93d3cud29vdGhlbWVzLmNvbS9hZHMvd29vdGhlbWVzLTEyNXgxMjUtMS5naWY8L2xpPjxsaT48c3Ryb25nPndvb19hZF9pbWFnZV8yPC9zdHJvbmc+IC0gaHR0cDovL3d3dy53b290aGVtZXMuY29tL2Fkcy93b290aGVtZXMtMTI1eDEyNS0yLmdpZjwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX2ltYWdlXzM8L3N0cm9uZz4gLSBodHRwOi8vd3d3Lndvb3RoZW1lcy5jb20vYWRzL3dvb3RoZW1lcy0xMjV4MTI1LTMuZ2lmPC9saT48bGk+PHN0cm9uZz53b29fYWRfaW1hZ2VfNDwvc3Ryb25nPiAtIGh0dHA6Ly93d3cud29vdGhlbWVzLmNvbS9hZHMvd29vdGhlbWVzLTEyNXgxMjUtNC5naWY8L2xpPjxsaT48c3Ryb25nPndvb19hZF90b3A8L3N0cm9uZz4gLSBmYWxzZTwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX3RvcF9hZHNlbnNlPC9zdHJvbmc+IC0gPC9saT48bGk+PHN0cm9uZz53b29fYWRfdG9wX2ltYWdlPC9zdHJvbmc+IC0gaHR0cDovL3d3dy53b290aGVtZXMuY29tL2Fkcy93b290aGVtZXMtNDY4eDYwLTIuZ2lmPC9saT48bGk+PHN0cm9uZz53b29fYWRfdG9wX3VybDwvc3Ryb25nPiAtIGh0dHA6Ly93d3cud29vdGhlbWVzLmNvbTwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX3VybF8xPC9zdHJvbmc+IC0gaHR0cDovL3d3dy53b290aGVtZXMuY29tPC9saT48bGk+PHN0cm9uZz53b29fYWRfdXJsXzI8L3N0cm9uZz4gLSBodHRwOi8vd3d3Lndvb3RoZW1lcy5jb208L2xpPjxsaT48c3Ryb25nPndvb19hZF91cmxfMzwvc3Ryb25nPiAtIGh0dHA6Ly93d3cud29vdGhlbWVzLmNvbTwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX3VybF80PC9zdHJvbmc+IC0gaHR0cDovL3d3dy53b290aGVtZXMuY29tPC9saT48bGk+PHN0cm9uZz53b29fYWx0X3N0eWxlc2hlZXQ8L3N0cm9uZz4gLSBraGFraS5jc3M8L2xpPjxsaT48c3Ryb25nPndvb19hdXRvX2ltZzwvc3Ryb25nPiAtIGZhbHNlPC9saT48bGk+PHN0cm9uZz53b29fY2F0X21lbnU8L3N0cm9uZz4gLSBmYWxzZTwvbGk+PGxpPjxzdHJvbmc+d29vX2NvbnRlbnRfYXJjaGl2ZXM8L3N0cm9uZz4gLSBmYWxzZTwvbGk+PGxpPjxzdHJvbmc+d29vX2NvbnRlbnRfaG9tZTwvc3Ryb25nPiAtIGZhbHNlPC9saT48bGk+PHN0cm9uZz53b29fY3VzdG9tX2Nzczwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2N1c3RvbV9mYXZpY29uPC9zdHJvbmc+IC0gPC9saT48bGk+PHN0cm9uZz53b29fZmFjZWJvb2s8L3N0cm9uZz4gLSBzaW1iYXRlbWFuPC9saT48bGk+PHN0cm9uZz53b29fZmVlZGJ1cm5lcl91cmw8L3N0cm9uZz4gLSA8L2xpPjxsaT48c3Ryb25nPndvb19mb290X2NhdF9tZW51PC9zdHJvbmc+IC0gZmFsc2U8L2xpPjxsaT48c3Ryb25nPndvb19mb290X25hdl9leGNsdWRlPC9zdHJvbmc+IC0gPC9saT48bGk+PHN0cm9uZz53b29fZ29vZ2xlX2FuYWx5dGljczwvc3Ryb25nPiAtIDxzY3JpcHQgdHlwZT1cInRleHQvamF2YXNjcmlwdFwiPg0KdmFyIGdhSnNIb3N0ID0gKChcImh0dHBzOlwiID09IGRvY3VtZW50LmxvY2F0aW9uLnByb3RvY29sKSA/IFwiaHR0cHM6Ly9zc2wuXCIgOiBcImh0dHA6Ly93d3cuXCIpOw0KZG9jdW1lbnQud3JpdGUodW5lc2NhcGUoXCIlM0NzY3JpcHQgc3JjPVwnXCIgKyBnYUpzSG9zdCArIFwiZ29vZ2xlLWFuYWx5dGljcy5jb20vZ2EuanNcJyB0eXBlPVwndGV4dC9qYXZhc2NyaXB0XCclM0UlM0Mvc2NyaXB0JTNFXCIpKTsNCjwvc2NyaXB0Pg0KPHNjcmlwdCB0eXBlPVwidGV4dC9qYXZhc2NyaXB0XCI+DQp0cnkgew0KdmFyIHBhZ2VUcmFja2VyID0gX2dhdC5fZ2V0VHJhY2tlcihcIlVBLTExMTUwNTYtNFwiKTsNCnBhZ2VUcmFja2VyLl90cmFja1BhZ2V2aWV3KCk7DQp9IGNhdGNoKGVycikge308L3NjcmlwdD4NCjwhLS0gUGl3aWsgLS0+DQo8c2NyaXB0IHR5cGU9XCJ0ZXh0L2phdmFzY3JpcHRcIj4NCnZhciBwa0Jhc2VVUkwgPSAoKFwiaHR0cHM6XCIgPT0gZG9jdW1lbnQubG9jYXRpb24ucHJvdG9jb2wpID8gXCJodHRwczovL3N0YXRzLnBud3JhaW4uY29tL1wiIDogXCJodHRwOi8vc3RhdHMucG53cmFpbi5jb20vXCIpOw0KZG9jdW1lbnQud3JpdGUodW5lc2NhcGUoXCIlM0NzY3JpcHQgc3JjPVwnXCIgKyBwa0Jhc2VVUkwgKyBcInBpd2lrLmpzXCcgdHlwZT1cJ3RleHQvamF2YXNjcmlwdFwnJTNFJTNDL3NjcmlwdCUzRVwiKSk7DQo8L3NjcmlwdD48c2NyaXB0IHR5cGU9XCJ0ZXh0L2phdmFzY3JpcHRcIj4NCnRyeSB7DQp2YXIgcGl3aWtUcmFja2VyID0gUGl3aWsuZ2V0VHJhY2tlcihwa0Jhc2VVUkwgKyBcInBpd2lrLnBocFwiLCAxKTsNCnBpd2lrVHJhY2tlci50cmFja1BhZ2VWaWV3KCk7DQpwaXdpa1RyYWNrZXIuZW5hYmxlTGlua1RyYWNraW5nKCk7DQp9IGNhdGNoKCBlcnIgKSB7fQ0KPC9zY3JpcHQ+PG5vc2NyaXB0PjxwPjxpbWcgc3JjPVwiaHR0cDovL3N0YXRzLnBud3JhaW4uY29tL3Bpd2lrLnBocD9pZHNpdGU9MVwiIHN0eWxlPVwiYm9yZGVyOjBcIiBhbHQ9XCJcIiAvPjwvcD48L25vc2NyaXB0Pg0KPCEtLSBFbmQgUGl3aWsgVGFnIC0tPjwvbGk+PGxpPjxzdHJvbmc+d29vX2xvZ288L3N0cm9uZz4gLSAvYXNzZXRzL2ltYWdlcy9iZWNhdXNlSVNhaWRTby5wbmc8L2xpPjxsaT48c3Ryb25nPndvb19tYW51YWw8L3N0cm9uZz4gLSBodHRwOi8vd3d3Lndvb3RoZW1lcy5jb20vc3VwcG9ydC90aGVtZS1kb2N1bWVudGF0aW9uL21haW5zdHJlYW08L2xpPjxsaT48c3Ryb25nPndvb19uYXZfZXhjbHVkZTwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX3Byb2ZpbGU8L3N0cm9uZz4gLSBodHRwOi8vaTMueXRpbWcuY29tL3ZpL3I5YWRpTU5aNEY0L2RlZmF1bHQuanBnPC9saT48bGk+PHN0cm9uZz53b29fcmVzaXplPC9zdHJvbmc+IC0gdHJ1ZTwvbGk+PGxpPjxzdHJvbmc+d29vX3Nob3J0bmFtZTwvc3Ryb25nPiAtIHdvbzwvbGk+PGxpPjxzdHJvbmc+d29vX3RoZW1lbmFtZTwvc3Ryb25nPiAtIE1haW5zdHJlYW08L2xpPjxsaT48c3Ryb25nPndvb190aHVtYl9oZWlnaHQ8L3N0cm9uZz4gLSAxMDA8L2xpPjxsaT48c3Ryb25nPndvb190aHVtYl93aWR0aDwvc3Ryb25nPiAtIDEwMDwvbGk+PGxpPjxzdHJvbmc+d29vX3R3aXR0ZXI8L3N0cm9uZz4gLSBzaW1iYXRlbWFuPC9saT48L3VsPg==