The SWF file format is incredibly compact, and if you know what you’re doing you can create quite gorgeous things in only a few kilobytes. Unfortunately to take advantage of the format you sometimes need to have an understanding of how it works, or at least have someone show you some best practices for creating content.

45Kbytes SWF v 4Kbytes SWF.

Take a look at both these virtual assets. At first glance they might look identical and to be honest they’re both similar enough that it wouldn’t concern a user. But the version on the left is 45 Kbytes while the one on the right comes in at a tiny 4 Kbytes!

So what’s the difference?

Well, it’s all down to how the flower pattern has been created. The optimized version contains only 3 movie clip symbols in the library – one for the pink flower, one for the blue flower, and a single leaf. The pattern is created by simply using multiple instances of each symbol then applying some scaling and transformations to keep things interesting.

Dress on the right uses movie clip instances to reduce SWF size.

The bloated version on the other hand doesn’t use library symbols. Instead the entire flower pattern has been hand drawn. Although it gives the same result, it seriously increasing the file size since the vector information for every single flower on the pattern has to be stored within the SWF. The optimised version however only needs to store the vector information for the 3 movie clip symbols stored in the library, giving a significant reduction in the final file size.

If you’ve been doing Flash for any length of time then this should all be fairly obvious to you. But sometimes when the pressure’s on, it’s very easy to rush something out and forget about the final size of your SWF.

  1. You could probably knock that down a little further given the similarity between the flowers. That would be 2 symbols, half of the flowers having a color transform instead of being a separate symbol.

  2. Yup, thanks for pointing that out.

    Christopher (Author)