big swf file

[ibolui]

hi, i would like to ask a question regarding flex. this is my first time trying
out flex/flash. i have created a simple user profile form using flex as the
frontend UI. this form merely consist of some text fields, comboxbox etc. but
there are also a few array initialization. below are the codes..

the form is not yet finish, but the problem i have noticed is that the
generated swf is alreay over 500kb. i thought that this is just a simple form
with not much effects/animations etc, but already has quite a considerable
filesize.

hence i would like to ask if there is a better way to code the form, or any
other problems/solutions that will greatly reduce the swf filesize?

thanks :)

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
initialize="init()" backgroundColor="#FFFFFF"
backgroundGradientColors="[#FFFFFF, #FFFFFF]">

<mx:HTTPService id="retrieve_profile"
url="../***.php" useProxy="false" method="GET" resultFormat="text"
result="loadUser(event)">
<mx:request xmlns="">
<mode>retrieve_profile</mode>
</mx:request>
</mx:HTTPService>

<mx:Script>
<![CDATA[
import mx.rpc.events.ResultEvent;
import com.adobe.serialization.json.JSON;
import flash.net.FileReference;
import flash.net.URLRequest;
import flash.net.URLRequestMethod;
import flash.net.URLVariables;

var imageTypes:FileFilter = new FileFilter("Images (*.jpg, *.jpeg, *.gif,
*.png)", "*.jpg; *.jpeg; *.gif; *.png");
var allTypes:Array = new Array(imageTypes);
var fileRef:FileReference = new FileReference();
var user:Object;

private function loadUser(event:ResultEvent):void {
//get the raw JSON data and cast to String
var rawData:String = String(event.result);
user = JSON.decode(rawData);

first_name.text = user.first_name;
last_name.text = user.last_name;
email.text = user.email;

if (user.gender == "male") {
male.selected = true;
} else {
female.selected = true;
}

var bday:Date = new Date(user.birthday);
day.selectedIndex = bday.getDate() - 1;
month.selectedIndex = bday.getMonth();
year.selectedIndex = year_array.indexOf(bday.getFullYear().toString());

country.selectedIndex = country_array.indexOf(user.country);
timezone.selectedIndex = timezone_index(user.timezone);

setup_profile_pic();
}

private function setup_profile_pic() {
if (user.profile_pic !== "") {
image.source = ****;
remove_btn.visible = true;
browse_btn.visible = false;
upload_btn.visible = false;
file_name.visible = false
} else {
image.source = ****;

remove_btn.visible = false;
browse_btn.visible = true;
upload_btn.visible = true;
file_name.visible = true
}

fileRef.addEventListener(Event.SELECT, selectHandler);
// fileRef.addEventListener(Event.COMPLETE, completeHandler);
fileRef.addEventListener(Event.COMPLETE, uploadCompleteHandler);
// fileRef.addEventListener(DataEvent.UPLOAD_COMPLETE _DATA,
uploadCompleteHandler);
fileRef.addEventListener(ProgressEvent.PROGRESS, progressHandler);
fileRef.addEventListener(IOErrorEvent.IO_ERROR, errorHandler);
fileRef.addEventListener(SecurityErrorEvent.SECURI TY_ERROR, errorHandler);
}

private function init():void {
retrieve_profile.send();
}

private function timezone_index(tz:Number):Number {
if (tz == -12) {
return 0;
} else if (tz == -11) {
return 1;
} else if (tz == -10) {
return 2;
} else if (tz == -9) {
return 3;
} else if (tz == -8) {
return 4;
} else if (tz == -7) {
return 5;
} else if (tz == -6) {
return 6;
} else if (tz == -5) {
return 7;
} else if (tz == -4) {
return 8;
} else if (tz == -3.5) {
return 9;
} else if (tz == -3) {
return 10;
} else if (tz == -2) {
return 11;
} else if (tz == -1) {
return 12;
} else if (tz == 0) {
return 13;
} else if (tz == 1) {
return 14;
} else if (tz == 2) {
return 15;
} else if (tz == 3) {
return 16;
} else if (tz == 3.5) {
return 17;
} else if (tz == 4) {
return 18;
} else if (tz == 4.5) {
return 19;
} else if (tz == 5) {
return 20;
} else if (tz == 5.5) {
return 21;
} else if (tz == 6) {
return 22;
} else if (tz == 7) {
return 23;
} else if (tz == 8) {
return 24;
} else if (tz == 9) {
return 25;
} else if (tz == 9.5) {
return 26;
} else if (tz == 10) {
return 27;
} else if (tz == 11) {
return 28;
} else if (tz == 121) {
return 29;
} else {
return 24;
}
}

private function selectHandler(event:Event):void {
file_name.text = fileRef.name;
}

private function errorHandler():void {
image_info_text.text="Unsuccessful. Error uploading image."
image_info_text.visible= true;
}

private function progressHandler(event:ProgressEvent):void {
// display progress bar
progressbar.setProgress(event.bytesLoaded, event.bytesTotal);
}

private function uploadCompleteHandler(event:DataEvent):void {
progressbar.visible = false;
remove_btn.visible = true;
// display image
image.source = ****;
}

private function browse():void {
try {
image_info_text.visible= false;
fileRef.browse(allTypes);
} catch (error:Error) {
image_info_text.text = "Unable to browse for file.";
}
}

private function remove():void {
if (image.source != ****) {
// remove profile pic
}
}

private function upload():void {
try {
browse_btn.visible = false;
upload_btn.visible = false;
file_name.visible = false
progressbar.visible = true;

var params:URLVariables = new URLVariables();
params.type = "profile_pic";
var request:URLRequest = new URLRequest(****);
request.method = URLRequestMethod.POST;
request.data = params;
fileRef.upload(request);
} catch (error:Error) {
image_info_text.text = "Unable to upload file.";
}
}
]]>

</mx:Script>

<mx:Canvas width="100%" height="350" backgroundColor="#FFFFFF">
<mx:Label x="109.5" y="10" text="Profile Image" fontWeight="bold"/>
<mx:Image width="250" height="250" id="image" x="25" y="36"/>
<mx:TextInput id="file_name" editable="false" x="25" y="294"
width="250"/>
<mx:Button x="210" y="324" id="upload_btn" label="Upload"
click="upload();"/>
<mx:ProgressBar x="25" y="294" id="progressbar" visible="false"
width="250"/>
<mx:Button label="Remove" id="remove_btn" x="202" y="294"
click="remove();"/>
<mx:Button label="Browse" id="browse_btn" textAlign="center"
click="browse();" x="134" y="324"/>
<mx:Text id="image_info_text" width="250" color="#FF0000"
fontWeight="bold" fontSize="11" x="25" y="296" visible="false"/>
</mx:Canvas>

<mx:Style>
.boldLabel {
fontWeight: bold;
}
</mx:Style>

<mx:Array id="country_array">
<mx:String>Afghanistan</mx:String>
<mx:String>Albania</mx:String>
<mx:String>Algeria</mx:String>
<mx:String>American Samoa</mx:String>
<mx:String>Andorra</mx:String>
<mx:String>Angola</mx:String>
<mx:String>Anguilla</mx:String>
<mx:String>Antarctica</mx:String>
<mx:String>Antigua and Barbuda</mx:String>
<mx:String>Argentina</mx:String>
<mx:String>Armenia</mx:String>
<mx:String>Aruba</mx:String>
<mx:String>Australia</mx:String>
<mx:String>Austria</mx:String>
<mx:String>Azerbaijan</mx:String>
<mx:String>Bahamas</mx:String>
<mx:String>Bahrain</mx:String>
<mx:String>Bangladesh</mx:String>
<mx:String>Barbados</mx:String>
<mx:String>Belarus</mx:String>
<mx:String>Belgium</mx:String>
<mx:String>Belize</mx:String>
<mx:String>Benin</mx:String>
<mx:String>Bermuda</mx:String>
<mx:String>Bhutan</mx:String>
<mx:String>Bolivia</mx:String>
<mx:String>Bosnia and Herzegovina</mx:String>
<mx:String>Botswana</mx:String>
<mx:String>Bouvet Island</mx:String>
<mx:String>Brazil</mx:String>
<mx:String>British Indian Ocean Territory</mx:String>
<mx:String>Brunei</mx:String>
<mx:String>Bulgaria</mx:String>
<mx:String>Burkina Faso</mx:String>
<mx:String>Burundi</mx:String>
<mx:String>Cambodia</mx:String>
<mx:String>Cameroon</mx:String>
<mx:String>Canada</mx:String>
<mx:String>Cape Verde</mx:String>
<mx:String>Cayman Islands</mx:String>
<mx:String>Central African Republic</mx:String>
<mx:String>Chad</mx:String>
<mx:String>Chile</mx:String>
<mx:String>China</mx:String>
<mx:String>Christmas Island</mx:String>
<mx:String>Cocos (Keeling) Islands</mx:String>
<mx:String>Colombia</mx:String>
<mx:String>Comoros</mx:String>
<mx:String>Congo</mx:String>
<mx:String>Congo (DRC)</mx:String>
<mx:String>Cook Islands</mx:String>
<mx:String>Costa Rica</mx:String>
<mx:String>C?te d'Ivoire</mx:String>
<mx:String>Croatia</mx:String>
<mx:String>Cyprus</mx:String>
<mx:String>Czech Republic</mx:String>
<mx:String>Denmark</mx:String>
<mx:String>Djibouti</mx:String>
<mx:String>Dominica</mx:String>
<mx:String>Dominican Republic</mx:String>
<mx:String>Ecuador</mx:String>
<mx:String>Egypt</mx:String>
<mx:String>El Salvador</mx:String>
<mx:String>Equatorial Guinea</mx:String>
<mx:String>Eritrea</mx:String>
<mx:String>Estonia</mx:String>
<mx:String>Ethiopia</mx:String>
<mx:String>Falkland Islands (Islas Malvinas)</mx:String>
<mx:String>Faroe Islands</mx:String>
<mx:String>Fiji Islands</mx:String>
<mx:String>Finland</mx:String>
<mx:String>France</mx:String>
<mx:String>French Guiana</mx:String>
<mx:String>French Polynesia</mx:String>
<mx:String>French Southern and

[Mitek17]

You can't really go below 300-500Kb as this is the Flex framework components
sitting in your SWF.

If you need something very small and quick - use Flash instead.

With Flex you have to expect that the app size will be at least 300K.

You should start to worry when you app will reach 1Mb limit, then you can
start using other techniques as modules, RSL or just dynamic loading of
external SWFs.

Cheers,
Dmitri.

[atta707]

How about taking all the arrays out and store them on the server and load them after your application loads to start with.

[atta707]

one more thing: are you reporting size of debug version or release version SWF?

Relase version SWF should be much smaller than debug version.

Look into FB help for "Release Builds"

[ibolui]

ohh.. i didnt know there are two different types of build. yup the release
build is 316kb now. if a flex swf is at least 300kb, i guess is ok then :)

another thing.. how do i know whether it is a release or debug version from
the swf file itself?
is there any tools to further optimize a swf file :p

[Mitek17]

ibolui, did you try to do the Export Release in another directory?
Then you can compare the sizes.
PS this is for Flex Builder 3

Cheers,
Dmitri.

[ibolui]

yup. i build it using export release in another directory. and the swf is
nearly 200kb smaller :)

but in general, how do i know whether it is a release or debug version from
the swf file itself?
is there any tools to further optimize a swf file :p

[Mitek17]

AFAIK there will be no trace() output from the release version.