Flex Builder Optimization and You
So you’ve been working on a Flex project for nearly a year and you have a few dozen modules and even more Actionscript classes and suddenly you realize that the project is taking an eternity to compile. Three minutes 26 seconds in my case. This snuck up on me too as compile times gradually became longer and longer. It all came to a head yesterday as I was doing some debugging but couldn’t really accomplish anything as I had to wait three and a half minutes between compiles. After quite a bit of searching I’m come up with a two-pronged solution.
The two prongs are rather simple: move your Actionscript classes and MXML components to a library project, and set Flex Builder to only compile the module or modules you are currently working with rather than all modules for the project. I know it sounds really simple but it took me about five hours to dig around Adobe’s documentation and piece everything together. The payoff has definitely been worth is though with compile times down to about twenty seconds, or about 10% of the previous time. In the hope of saving others a few gray hairs I’ve put together a handy little guide.
I started by creating a separate library project for all my classes and reusable components. The official Adobe docs on this are here (for Flex 3). There are a lot of benefits to doing this besides decreased compile times. Having all your Actionscript classes and MXML components in a library project allows you to easily reuse them in multiple projects. Taking this a step further you can also add other libraries to a library project. So rather than link multiple libraries into your Flex project you could set up a library to do this and link that single library into your project. In the end library projects are quite useful for many things. Use them.
But how, you ask? The process is pretty much identical to creating a standard Flex project, just select File > New > Flex Library Project and follow along through the wizard. Once you have your project setup just add your code and compile it into a .swc file (if you have Build Automatically checked Flex Builder will do this for you automagically). You then link this swc into your main project’s build path. To add the swc to your project’s build path:
- Right-click your project in the Flex Navigator, choose Properties.
- In the Properties window select Flex Build Path.
- Click the Library Path tab.
- Click the Add SWC… button.
- Browse and find your library’s swc. By default this is in the bin folder of your library project.
You can now import your classes and components just as if they were physically in the project. Using a seprate library project decreases compile time because now your classes and components are only being recompiled when you make changes to the library project.
One thing to consider when adding your library to the Build Path of your project is the library’s Link Type (you can see this by clicking the rollout tab next to you library in the list of build path libraries). There are three options; I went with Runtime Shared Library (RSL). As far as I could tell there was no substantial difference in compile times with the three link types, but RSL has the advantage of seriously reducing module file size. I went from having an average module weigh in around 230KB to around 70KB. The catch is that the library is exported as a separate swf that needs to be uploaded along with your application and module swfs. The library swf is then loaded in by the application at start up, making the initial application start up a tad slower but drastically increasing load speeds for modules.
Employing runtime shared libraries offered a nice performance boost both for my application’s compile times and load times but selectively compiling my app’s modules is what really decimated compile times. To select which modules to compile:
- Right-click your project in the Flex Navigator, choose Properties.
- In the Properties window select Flex Modules.
- You should see a list of all the modules in your application. Select the ones you aren’t working with and click the Remove button.
When you need to add a module to compile click the Add… button in the Flex Modules window and browse for it. Any new modules you add should automatically be added to the list to compile. There are two downsides to this. The first is that anytime you make a change to the list of modules Flex has to rebuild your project’s workspace which can take some time. The second is that it’s a complete pain in the ass to add modules back into the compile list since you can only add one at a time and you have to browse through a few windows to do so. In practice though, you’re not likely to be constantly adding and removing all your modules so this second point is probably moot.
And that’s it. As I said at the top I saw a 90% decrease in compile times just by doing these two things. I’ve also been far more productive as a result since I don’t have an interminable wait while debugging.