Most of my Flash apps or websites use XML files, either for communication or initial data. They can get quite large, reaching about 100 kb or more is not seldom. You might say: so what?! 100 kb is like nothing for a bandwidth nowadays! Well, if you’ve every used iPhone tethering in an area where there is no 3g network, you start appreciating every single byte you won’t have to suck from the net. (On a side note: That’s when Opera really comes in handy.)

XML files compress really well

Because XML usually contains a lot of repetitive elements (noticably tags and attributes), they are like a compressor’s darling. Just zip a few of your XML files and you’ll see.

Now I kind of always thought that on nowadays webservers gzip compression is activated by default anyway. Which was wrong, at least for quite a bunch of servers I use.

Activate GZip compression

If your server installation contains the deflate module (which is the case for all of the ones I use), then you can simply add the following line to your .htaccess file:

# compress all html, plain text, xml, css and javascript:
AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css application/x-javascript

AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css application/x-javascript

http://www.gidnetwork.com/tools/gzip-test.php

I also like this one, although it only gives you little info on content-encoding. But very much on top of that :-)
http://www.wmtips.com/tools/info/

This little Firefox addon will tell you wether any site you visit has GZip activated:
https://addons.mozilla.org/en-US/firefox/addon/54647 (Content Encoding Detector)

Conclusion

HTML websites will profit a lot from this compression, as well as Flash sites (if just for your swfobject.js) that use textual communication. And best of all: it won’t need any kungfu effort on your side! And: practically all browsers support it. (I’ve only heard of problems with IE6, but then, you know, f*** IE6)

Update:

A more complete solution for your .htaccess file:

<IfModule mod_deflate.c>
	AddOutputFilterByType DEFLATE text/html
	AddOutputFilterByType DEFLATE text/xml
 
	AddOutputFilterByType DEFLATE image/x-icon
 
	AddOutputFilterByType DEFLATE text/css
 
	AddOutputFilterByType DEFLATE text/javascript
	AddOutputFilterByType DEFLATE application/javascript
	AddOutputFilterByType DEFLATE application/x-javascript
	AddOutputFilterByType DEFLATE text/x-js
	AddOutputFilterByType DEFLATE text/ecmascript
	AddOutputFilterByType DEFLATE application/ecmascript
	AddOutputFilterByType DEFLATE text/vbscript
	AddOutputFilterByType DEFLATE text/fluffscript
 
	AddOutputFilterByType DEFLATE image/svg+xml
	AddOutputFilterByType DEFLATE application/x-font-ttf
	AddOutputFilterByType DEFLATE application/x-font
	AddOutputFilterByType DEFLATE font/opentype
	AddOutputFilterByType DEFLATE font/otf
	AddOutputFilterByType DEFLATE font/ttf
	AddOutputFilterByType DEFLATE application/x-font-truetype
	AddOutputFilterByType DEFLATE application/x-font-opentype
	AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
	AddOutputFilterByType DEFLATE application/vnd.oasis.opendocument.formula-template
</IfModule>

(Source)

Sometimes you need to test your Flash stuff with different plugin versions. Even if you just want to run some performance tests, it is very useful to switch to the release player (see below for another example).

For windows there is a neat Firefox Plugin that makes switching quite a snap. On Mac there is one too – I haven’t tested it, but it’s supposed to work (though I’m not too sure about that when I read these comments here). Still I prefer to work with Safari and I kind of dislike the thought of starting Firefox to just switch Plugins.

Fortunately I’ve found another solution: WSPluginSwitcher. This one comes as a Cocoa app and once configured (you really should read this wiki page), it works real well for me. Also they have prepared plugin versions for you to download (though the most recents are missing, but no big deal really).

As for the speed tests, let me just give you another example (impressing enough for me to wanna switch players for real world testing).

In Debug Player:

method...................................................ttl ms...avg ms
tare [2]                                                      0     0.00
CSSFastParser                                               603   120.60
CSSRegExpParserFast                                         987   197.40
CSSRegExpParserFastAdvanced                                1457   291.40
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––

In Release Player:

method...................................................ttl ms...avg ms
tare [2]                                                      0     0.00
CSSFastParser                                               354    70.80
CSSRegExpParserFast                                         972   194.40
CSSRegExpParserFastAdvanced                                1469   293.80
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––

Both 10.0.22.87, and exported as release swf. Oh, and by the way tested with another useful tool from Grant Skinner: AS3 Performance Testing Harness.

Most of the Flash application deal with server side data like images, xml files etc. We tend to forget about that because the default Run or Debug commands in Flex will open a local html file (and also because we developers often have quite a nice internet connection when testing remotely). Thus all data is loaded nearly instantely.

In Flash we have a menu command called «Simulate Download» to see how things run at different bandwidth situations. But how to achieve this in Flex?

I’ve been using Sloppy for a long time. It’s little java app that can be started via a simple web click. It’s really easy to use and does very well what it does. For debugging your app (your flash website) throttled in Flex Builder simply follow these steps:

1. Open the Sloppy website
2. Click the little Sloppy icon:
   
   
3. A «sloppy.jnlp» file is downloaded. Open it if doesn’t open automatically.
4. The actual application will be downloaded and started. If it asks you to trust: trust! :-)
5. Enter the address of your html file in the bin-debug or bin-release folder. It should be a webserver address. I usually create a symbolic link of my project directory and put it into my local webserver directory.
   
6. Click «Go» – this will start the Sloppy proxy and open the page in your default browser. 
7. Copy the address from the browser window (usually http://127.0.0.1:7569/your/path)
   
8. You may close the window. Go to Flex Builder and open the project properties (right click on project folder, last item). In an Actionscript Project, switch to ActionScript Build Path.
    
9. Enter the copied address into «Output folder URL», clear the html name (e.g. App.html).
   
10. Click «OK» and you’re done. You can now Run and Debug as if your website was hosted on some server and you had a 256K ADSL connection (instead of your T1).

Note: I tried to automate the whole thing (with Ant of course) and succeeded to a certain limit. What I did was download Sloopy’s source code (java), modify it so it can handle more terminal attributes and build the  .jar file. This can be run on command line, which will start the sloopy server. So I created an ant file that does all that for me, but this ant file would only be cool, if it could also trigger the run or debug commands and modify the output folder url. I haven’t found a way (at least not a satisfying one) to do this, so I might just follow the manual street for once ;)

Another note: If you are windows user, you might wanna try this Firefox plugin: Firefox Throttle