A sneak peek at OpenPyro: A lightweight alternative to Flex 9

For the last few months, I have worked quite a bit with Flex and at times, the complexity of the framework really makes it hard to work with. I have mentioned my problems with Flex in an earlier post but the gist of it was:

  • A lot of our projects are widgets rather than apps that are as big as the webpage itself. The smaller the apps get in dimensions, the more unacceptable the load time becomes, so we could not create apps that compiled to swfs greater than 250k (even with framework caching).
  • Flex apps are memory intensive on their own and I really need that memory for other things like rendering high def video (which a lot of our apps do).
  • I want to build apps that are more expressive that what Flex lets me do.

Given these requirements, I have started working on an open source framework modeled after the Flex framework but with the primary goal of being really light and easy to extend. The project is actually being developed within the Flash team at Comcast Interactive Media to allow us to develop apps faster and give all the developers here a common standard to develop against. It started out as an R&D project but is now an official CIM project, so will definitely evolve in the next few months.

OpenPyro is not really complete but its at a good point where I can show it off a little bit and get some feedback. Here is what the framework does so far:

  • A bunch of pre-built components like Buttons, Sliders, Scrollbars, etc (1.0 release should have most of the components we are used to)
  • Has an explicit component lifecycle very similar to Flex with the concept of invalidation and differed UI update
  • Layout management including using percent based layouts (so you can set a dimension of a control as a percent of the container its sitting in using percentWidth or percentUnusedWidth). Also there are no layout specific containers (like H or VBox) but rather a container can be assigned any layout.
  • Runtime skinning
  • Separation the look of the controller (based on a skin file) with its behavior (like Flex 4 or OpenFlux) [work in progress]
  • Concept of Painters (not as complex as Degrafa yet but still pretty good and getting better)
  • The components are not tied to the framework. So you can just use a component like a Scrollbar or Slider in your As3 / Fla project.

The best part is even some pretty complex layouts like the image below weigh only around 23k. Imagine doing that with separate V and HBoxes.

There is also a bunch of other classes (a collections framework-esque package as well as a host of utility classes) that I will migrate to OpenPyro once the core components are at a good point. So stay tuned for that.

Of course with all its wins, there are still things in Flex that OpenPyro will not be able to do:

  • Data Binding: Since Flex does this at compile time using code generation, this has not been done.
  • XML based layout: This may happen later (and may or may not be compile time) but this is definitely a phase 2 thing.

I will post more examples in a couple of days to show some actual apps built with OpenPyro, but in the meanwhile take a look at the video below and let me know if you have any comments on the direction the framework is taking. If you want to look through the source code, the project is hosted at the github. OpenPyro will be released under the MIT license. There is also a google group for the project at http://groups.google.com/group/as3-pyro-user-group/.

Re: Bit-101 on putting the Flash back in Flash 9

I have this love/hate thing going with Flex off late (if you know me personally, this would be no surprise to you). While I do love the Flex IDE with code completion and language intelligence, the Flex apps that I see on the web are a far cry from the kind of experiences that got me into Flash. So when I heard Keith Peters, aka Bit-101, gave a talk on “Bringing the Flash back into Flash” at Flash Forward ‘08, I pinged him over Twitter asking him if he could share what he presented (as I am sure others did as well). So he did and it was a good read, I strongly recommend reading it here.

Having worked a lot with both technologies, I kind of feel let down by both of them just about as much. Unlike Keith, the experience I would like to see isn’t the ostentatious experiences that made 2advanced and such studios famous. While they definitely caught the eye, the crazy zap zoom effects wear thin on the second or third visit. The experience I would like to see Flash/Flex enable is closer to the experiences that Apple seems to enable (disclaimer: I am no Apple fanboy, and find a lot of things they do completely wrong). They are simpler effects but dont make you stop doing what you are doing and wait till the animation ends. I love my IPhone and just compare the experience there to any other Flash experience on a RIA. Both Flash and Flex fail pretty bad on that front. Here is why:

Flex 2/3:

  • Poor user experience by default
  • I dont get it how the core Flex 3 experience is acceptable by Flex developers. Non scrolling lists ? C’mon ! No control over itemRenderers in List controls (can you grow one’s width and height without having it clipped off by its neighbour ? ). Hacks to get any kind of custom Tooltips ? These are few in a long list of gripes I have with the framework

  • Really hard to extend core components
  • Its really amazing how hard it is to extend any Flex component, so much so that entire frameworks have been built just to do that (read about OpenFlux here). Flex 4 promises to ease this but thats still a year away.

  • Tightly coupled framework
  • It really kills me how tightly coupled the Flex framework is. There is no way to use, for example, just the collections framework without pulling in the UI framework. Why cant dataBinding be used in pure AS3 projects ?

  • Transitions/Effects an afterthought
  • Out of the box, Flex has no effects or transitions built in. So you have to explicitly create transitions but I wish out of the box some effects were enabled.

  • File Size
  • The huge swf size of a Flex app makes it unusable for any kind of widgets or smaller dimension swfs, and Flex 4 will not change this (their roadmap states that Flex 4 files will be around the same file size as Flex 3). The size of the swf goes beyond the load time. Heavy core objects mean they are more taxing on your CPU, which explains why complex animations with more than a few UIComponent objects stutter.

Flash

  • Really poor code editor
  • The quality of the code editor is really poor in Flash, enough for me to never use it.

  • Version control nightmare
  • Any code within the timeline is a nightmare for version control so you have no idea when your project is a few months old what the changes were. Same thing with any changes to a graphical element.

  • Write everything from scratch
  • I am not a fan of the Flash components architecture, which offers less capabilities than the Flex component set. So I end up writing components from scratch.

So what I am really looking for is a framework I can use in Flex Builder that is lighter than Flex and is more expressive by default. I have been working on a project that may enable those features that I am hoping to release soon, so do stay tuned.