How Not to Code Flex Applications (RIA Unleashed: Boston 2009)
Jeff Tapper
What is bad code
* Doesn't meet needs of the project: efficiency, maintainability, time to develop
* Code which doesn't make sense
Why do we write bad code
* Lack of time
* Lack of knowledge
* Lack of caring
What bad code leads to
* Delays
* Project failure
* Job loss
* Death
Bad code samples
If you are doing something wrong note it, add comments about why so you know you need to fix it later
Bad Code Sample 1
<mx:VBox styleName="doubleLine"/> .doubleLine { background-image: Embed("/assets/images/doubleLine.png"); }
* Bad use of container (don't use if it won't have children)
* Better to replace with mx:Image
Bad Code Sample 2
<mx:List itemRenderer="see below" selectable="false"> <!-- item renderer --> <mx:VBox> <mx:Image/> <mx:Label/> </mx:VBox>
* Use of list when you don't need it's features: virtualization, selectability
* Better to replace with mx:Repeater
Bad Code Sample 3
public function setDate(u:String, p:String):void { username.text = u; password.text = p; } <mx:TextInput id="username"/> <mx:TextInput id="password"/>
* Properties set on controls instead of a model (race conditions, control names, additional fields)
* Modify the model let the view follow using Bindings
Bad Code Sample 4
<mx:Form currentState="{ModelLocator.getInstance().loginState}"/> new CarignromEvent("changeState");
* View events handled in top level component
* Local property changing local state is best unless other people need to know about it
Bad Code Sample 5
<mx:VBox borderStyle="solid" backgroundColor="" otherCSSStyles> <mx:Text/> </mx:VBox>
* Inappropriate container nesting (mostly for styling, not child layout, i.e. container with only one child)
* Exception is mx:ViewStack and mx:TabNavigator require children be containers
* Better to use mx:TextArea as that supports background and border styles
Bad Code Sample 6
<comp:Comp1 id="menuChooser"/> <comp:Comp2 menuForDisplay="{menuChoose.menuGroup.selection.label}"/>
* Bad coupling (two dots and you are out)
* Better to dispatch event that others can listen for
Bad Code Sample 7
<mx:Button enabled="foo && (bar != '' || bar == '') // etc."/>
* Being too clever (hard to maintain and debug)
* Move the logic into a function