Optimizing Flex when multiple modules are used

Question

I have a Flex application where load time is extremely important (consumer site). i want to be able to get something up on screen and then allow additional modules to be loaded as necessary.

The issue I'm facing is that the sum total of all the modules is much larger than if i were to include all the components in a single .swf file.

Its pretty obvious why. For instance the classes needed for web service access seem to take about 100kb. If I dont use those classes in my main.swf then they'll be included in EVERY module that uses them. So if I have 5 modules thats an extra 500kB wasted.

In theory I want 3 levels

main.swf - minimum possible layout / style / font / framework type stuff common.swf - additional classes needed by module 1 + module 2 (such as web services) module1.swf - module 1 in site module2.swf - module 2 in site

I dont know if this is even possible.

I'm wondering if I can load swz/swf files for portions of the framework instead of the entire framework.

I really need to get my main app size down to 200Kb. It grows to 450kb when I add web services and basic datagrid functionality.

Any lessons learned would be appreciated.

Answer 1

I know this was awhile ago, but I figured I'd post another response in case anyone is still looking for an answer on this.

I've been looking into optimizing Flex apps and, after some checking into it, have decided to use Modules. Primarily 'cause they have such good options for optimization.

The two mxmlc commands you need are:

mxmlc -link-report=MyAppReport.xml MyApp.mxml

and

mxmlc -load-externs=MyAppReport.xml MyModule.mxml

My external swf (using the Flex Framework) is now only 21k. It's doing much (yet), but even as it does more and more, it will continue to use resources from the main app code.

Here's the batch file I created to speed up the process (you have to have put mxmlc in your Environment Path variable for it to work like this. Control Panel -> System -> Advanced -> Environment Variables, Edit the Path System Variable, adding the path to your mxmlc (requires a reboot)):

cd C:\Projects\MyProject\Develop\Modules
mxmlc -link-report=MyAppReport.xml C:\Projects\MyProject\Develop\Source\Main.mxml
mxmlc -load-externs=MyAppReport.xml MyModule.mxml
move /Y MyModule.swf ..\Runtime\Modules

More info here: http://livedocs.adobe.com/flex/3/html/help.html?content=modular_4.html

Hope that helps!