insight

Responsible Flash Development: File Size

by Matt Skoog June 12, 2009

In this installment of Responsible Flash Development I will give you some tips to keep your overall file size down in your Flash projects. File size is an important part of Flash development and, if left unaddressed, can quickly get out of hand. But, before we get into file size optimization in Flash, we’ll begin a step before: prepping assets outside of Flash.

Asset preparation
Asset preparation is a major step towards minimizing your Flash file size. First, take a look at the composition that you need to build in Flash. See what items can be a vector graphic versus what has to be imported into Flash as a bitmap graphic. When it comes to bitmap graphics, I could write an entire article over compression techniques. Take a look at these articles for a little more insight on graphic file types and compression.

Nine times out of ten you will save file size by using a vector asset over a bitmap. This depends on the complexity of the vector. If you’re not sure about what type of graphic to use for a particular shape/asset, import both of them into a new Flash file and place them on the stage. Select the option to “Generate a Size Report” in the publish settings and publish the movie. The asset with the smallest file size is your winner!

Once you have imported and/or created all of your assets in Flash, you can do additional optimization using tools inside the Flash IDE. Each bitmap in the Library can have its own additional compression settings. When doing this, you need to think about the importance of your bitmap. For example, if you have a bitmap that’s not going to have much face time in your project, you may get away with a little more compression on it. Vector assets can be optimized as well, by adjusting their curves and points. A word of caution, this optimization can severely alter the shape of your vector, so use these options sparingly.

Coding techniques
Get creative with your code. Let’s say that there are 5 balloons in the composition and all 5 are different colors. Instead of importing 5 different assets, just import one. Then build a class that allows you to change the base color of the balloon asset. You’ve now accounted for 5 balloons at 1/5 of the file size!

Fonts
Fonts can make or break your file size and are often overlooked. Take note of the fonts used in the composition. If you are using multiple fonts that will be dynamically updated, you may want to consider using fewer fonts. If a font is dynamic, you will have to embed the fonts. Basic font embedding can range anywhere from 5-30k in size. Lets say that you have 3 dynamic fonts that are around 20k, if you choose to use all 3, you’re already at 60k in file size just for fonts! Sometimes, this can’t be avoided so you’ll have to make up for that size in different parts of your project.

Tween types
Now that you have all of your assets completely optimized and your fonts squared away, it’s time to animate! If you prefer to use third-party tween libraries to animate in Flash, choose your library wisely. Some libraries have more capabilities, but are a bit heavier (Tweener). Others are lighter, but have a less capabilities (TweenLite). If I’m building a site, mini-site, or feature, I may use a library like Tweener. If I’m building banner I’ll use a library like TweenLite.

Use of these tips can greatly affect the size and performance of your project. Try to keep them in mind the next time you’re working on a Flash project and you’ll see that your end result will be a faster, slimmed-down Flash application.

Comments

Add comment


 

biuquote
  • Comment
  • Preview
Loading



The way we see it, people who share insight with each other innovate, grow and succeed together.

Subscribe

Log in

The opinions contained in these pages do not necessarily reflect those of Springbox or its parent company, DG FastChannel.