MXML Posts

Flex Binding & Compile Times

Binding in flex has been playing on my mind for a little while now, so I have decided to finally sit down and try to resolve the issue.

The worry has been that on large projects that make heave use of the flex automatic binding, compile times could be dramatically increased. This is because behind the scenes the flex compiler must convert those syntax sugar ([Bindable] and {}) into actual AS3 code. The exact way this is done I wont go into, but I recommend you google it, its a fascinating topic.

I really like the ease of use of automatic binding but at the same time I was worried about how much slower compile times are because of them. So I decided I would try to run some tests and see.

To compare the compile time performance of binding I ran three tests. The first, a control to define how long compilation takes with an empty Flex Application. The second tests how long non-binding takes and is comprised of a single group with 4000 labels that are assigned values. The third test is for binding and is 4000 labels that are bound to 4000 [Bindable] public variables.

For testing metrics I used the -benchmark=true compile flag along with -incremental=false to stop any sort of compile-caching. The full command line compile looks like:

“E:Program FilesAdobeAdobe Flash Builder 4sdksflex_sdk_4.5.0binmxmlc.exe” -load-config+=MainConfig.xml -debug=true -incremental=false -static-link-runtime-shared-libraries=true +configname=air -benchmark=true

I ran each test three times and took the average of each. I then ran the entire thing again but with -debug=false to see if that would make any difference.

I recorded all the results in this google doc: https://spreadsheets.google.com/ccc?key=0AoHeesrTENc9dEFqamdCc2ZldHcyZkJmQkZsaDBOT0E&hl=en&authkey=CLP8r-MF

The general gist is that it seems binding adds about 20% onto compile times both- debug=true and -debug=false. This isnt as bad as I was fearing but still a 20% increase on a 30 second compile time can be annoying.

Im not sure if the tests I did were fair so I would love to hear feedback from others.

I have bundled the project up incase anyone wanted to test it themselves: http://mikecann.co.uk/wp-content/uploads/2011/02/CompileTestGen.zip

1046: Type was not found or was not a compile-time constant

Came across this little oddity the other day. Took me ages to work out what was going on, so thought I would share in case anyone else ran into the same issue.

One day, for a reason I couldn’t fathom, my project stopped compiling. I kept getting these odd “1046: Type was not found or was not a compile-time constant” errors all over the place. Not only that, when I tried to include the class in question either via auto-complete (control & space) or via manual import the error persisted.

To cut a long story short it seems that if you try to new a member property that is of type Class from another class and the constructor takes in at least one parameter the error will occur.

So for example take the two following classes:

[codesyntax lang=”actionscript3″]

package package2
{
	import package1.MyTestClass;

	public class MyTestClass2
	{
		public var type : Class = MyTestClass;
	}
}

[/codesyntax]

And

[codesyntax lang=”actionscript”]

package package1
{
	public class MyTestClass
	{
		public function MyTestClass(someVar:String)
		{
			trace(someVar);
		}
	}
}

[/codesyntax]

Now try using them in the following fashion:

[codesyntax lang=”mxml”]

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark" 
			   xmlns:mx="library://ns.adobe.com/flex/mx" creationComplete="application1_creationCompleteHandler(event)">

	<fx:Script>
		<![CDATA[
			import mx.events.FlexEvent;			

			protected function application1_creationCompleteHandler(event:FlexEvent):void
			{
				var class2 : MyTestClass2 = new MyTestClass2();
				var class1 : MyTestClass = new (class2.type)("hello");
			}

		]]>
	</fx:Script>

</s:Application>

[/codesyntax]

And uh oh, bad times:

[codesyntax lang=”php”]

1046: Type was not found or was not a compile-time constant: MyTestClass.	FlexBugExperiment.mxml	/FlexBugExperiment/src/main	line 14	Flex Problem

1046: Type was not found or was not a compile-time constant: MyTestClass2.	FlexBugExperiment.mxml	/FlexBugExperiment/src/main	line 13	Flex Problem

1180: Call to a possibly undefined method MyTestClass2.	FlexBugExperiment.mxml	/FlexBugExperiment/src/main	line 13	Flex Problem

[/codesyntax]

The bad line is:

[codesyntax lang=”actionscript”]

var class1 : MyTestClass = new (class2.type)("hello");

[/codesyntax]

If you take away the “hello” part or you split it out into two lines like so:

[codesyntax lang=”actionscript”]

var tmpC : Class = (class2.type);
var class1 : MyTestClass = new tmpC("hello");

[/codesyntax]

Then everything is gravy

Anyway, I hope this helped someone out!

Multi-Line Flex Label [MXML]

Just stumbled across this one while writing some mxml for a personal project and thought I would share.

Have you ever wanted to have multi-line text in your label component in spark and thought the following should work?

[codesyntax lang=”mxml”]

<s:Label text="I like text on the n next line" />

[/codesyntax]

But all it produces is:

Yep me too.

After some playing however I stumbled accross the following solution:

[codesyntax lang=”mxml”]

<s:Label text="I like text on the {'n'} next line" />

[/codesyntax]

It then produces the expected result:

Im just guessing but I suspect its something to do with the black art of the flex life cycle. By adding the {‘n’} we are turning the property initialisation on the label component from a simple literal assignment into a delayed binding assignment and therefore gets parsed differently.

Just a guess, let me know if im way off.