Flex graphic assets: SWF or SWC? - apache-flex

Which is a better format to store graphic assets for a Flex application, SWF or SWC?
Are there any real differences, and if so what are they?

Assets in a seperate SWF are loaded and included at runtime.
Assets in a SWC are loaded and included / compiled at compile time.
You can also directly embed assets within the main app SWF at compile time (check out the Embed meta data).
Of course, you can also load individual assets (such as a PNG) directly at runtime.
As far as which is better, it really depends on what you are trying to do, and how the assets are used.
mike

SWC is what you use when you're looking for a library to compile into your app. You have access to the classes and can import individual parts. SWF is more likely what you're looking for when embedding graphics.
Here's the docs you might be interested in:
http://livedocs.adobe.com/flex/3/html/help.html?content=layoutperformance_06.html#223998
I've been having good success with SVG for images, but there's some caveats since Flex only implements a subset of the features.

I have no real reason for doing this so it may be incorrect but I usually create SWF's for things that need to be loaded during runtime and SWC's for things that need to be available for design time.

A SWC is simply a SWF and some metadata wrapped into a zip file. Other than the fact that runtime loading of SWC isn't supported, I don't think there are any major differences between using the two formats.

Related

Exported charts won't work in certain folders?

My exported charts won't work depending on where I move the bin-debug folder.
They work if I move it from my workspace:
C:\Users\Flexer\Adobe Flash Builder 4.5\charts\bin-debug
to my desktop:
C:\Users\Flexer\Desktop\bin-debug
But not if I move it to:
C:\Users\Flexer\Desktop\test\bin-debug
or
C:\bin-debug
What's going on?
Mats
You mean they don't operate, as opposed to not loading your data?
In your project properties, Flex Build Path - Library Path, assure you are merging into code dependent libraries. Otherwise, be sure SWC, SWZ, RSL also exist at the location you move your application.

Setting up Flex / AIR project structure for a large number of images?

We build prototypes and demo applications in Flex 4.5.1 and AIR 2.7 for mobile and desktop use. These tend to involve a large number of full-screen .PNG files. Lately we have been looking at ways to segment our code for flexibility and multi-screen re-use.
What suggestions do people have for segmenting the project and libraries such that compile times are minimal and images are easy to replace?
A couple of strategies pop to mind:
Externalize the assets from in-line [Embed] statements, to using a CSS file.
Configure the CSS to compile as a seperate SWF, and load it at runtime. This should minimize the amount of PNG encoding the compiler is doing during your normal compilation process.
If that still doesn't speed it up enough (I've found that the incremental compiler sometimes gets mixed up and re-encoded the embedded assets, killing compiler speed), move the CSS files to a separate project altogether.
This option is preferable, as loading your images at runtime gives you better flexibility in your multi-screen projects.
Alternatively:
If using CSS isn't an option for some reason, move your [Embed]'s from your main project to a separate SWC project, and embed them on classes.
Add the swc as a dependant project
Reference the assets via the classes.
eg:
// assets-project/src/Images.as
public class Images {
[Embed('/assets/img/defaultAvatar.png')]
public static var defaultAvatar:Object;
}
// main-project/src/SomeView.mxml
<s:BitmapImage source="{Images.defaultAvatar"} />

Min. Flex Module size is ~30kb and contains Framework classes. How to remove them?

Compile the following module with all framework SWC-s excluded in release mode in Flex 4:
<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"/>
The SWF size will be 35,658 bytes.
Now generate link report via -link-report for this SWF and load it via -load-externs. Size of the SWF now is 33.174 bytes.
If you check link report now, you will see that some framework classes like mx.modules:IModuleInfo or mx.utils:LoaderUtil are still there.
How to exclude them from SWF?
You are excluding framework SWCs by using RSLs, right?
If I had to guess, those classes are required by Modules and there is a reason for compiling them into the class. I'm sure Adobe was meticulous when creating RSLs and put a lot of thought into what should or should not be included in the main SWF.
I wonder why this is important, though. A 30K swf is really small.
The problem is that the standard components are not in the client runtime enviroment.
For example, in Flash with AS2 or AS3 if you use a ComboBox you have more than 20KB of overhead because the binaries for the component must be packed with your swf. This happend with Flex too. To make an small binary I used an small footprint library with the flash components, but this was for Flash AS2.
Good Luck.
I guess you have to dig through the link report. Find out which classes depend on mx.modules:IModuleInfo and mx.utils:LoaderUtil, and you're likely to understand how or why this happens.
It must be quite many classes, because the once mentioned including their dependencies have 6 KB raw and 2.8 KB optimized size.
greetz
back2dos

How to determine code and assets size within a SWF?

Is there a way to take a compiled SWF file and figure out how much of it's size is used by code and how much is assets (images, etc)? I'd like to see if I can get my Flex SWF smaller but I'm unsure what's taking up the most space.
You can use the -link-report MXMLC compiler parameter or you can use the swfdump tool in the open source Flex SDK to see what is in a SWF.

Flex linking: Why is the size of my swf file smaller than the sum of it's swc's?

Here's a dumb question. I compile my Flex application with several swc's (libraries) and it creates a swf file. The sum of the swc's is roughly 4 MB yet the actual swf generated is only 1.6 MB. How is this possible?
Thanks!
The compiler only compile classes from the swc that your application need, unless you specify which classes you want to 'embed'. Hence the smaller size of the swf at the end.
To expand on PeZ's response a bit, typically SWCs supplied to the Flex application compiler using the "library-path" compiler argument:
library-path path-element [...]
Links SWC files to the resulting application SWF file. The compiler only links in those classes for the SWC file that are required. You can specify a directory or individual SWC files.
You can use "include-libraries" instead:
include-libraries library [...]
Links all classes inside a SWC file to the resulting application SWF file, regardless of whether or not they are used.
Contrast this option with the library-path option that includes only those classes that are referenced at compile time.
You'll typically want to use "library-path" to help keep the size of your SWF as small as possible. However you may need to use "include-libraries" if your application instantiates classes from a SWC via reflection only. Since these classes are not actually linked to in the application, they won't be included if you use "library-path" to reference the SWC, and you'll get a runtime error during instantiation since the type is not available. However if you use "include-libraries" the class (and all other classes in the SWC) will be available to the app.
1) in swf file only required classes are included
2) more files result in additional header information that will also increase size slightly.
To reduce the size of flex swf you can use these techniques mentioned in this article :
http://askmeflash.com/article_m.php?p=article&id=9

Resources