Accessibility

Table of Contents

  1. Introduction
  2. Exploring Caching in the Flex Presentation Server
  3. Modifying the flex-config.xml File Configuration Settings
  4. Accessing the Flex Data Services
  5. Using the JSP Tag Library
  6. Precompiling MXML Pages
  7. Considering Your Deployment Options
  8. Load Testing Your Flex Application
  9. What the Future Holds...

Flex Application Performance: Tips and Techniques for Improving Flex Server Performance

Using the JSP Tag Library

Flex provides a JSP tag library that enables you to integrate MXML directly into a JSP or ColdFusion page. The tag library enables developers to build hybrid applications that integrate both HTML and Flex applications into a page. For example, if you had an HTML application and wanted to slowly introduce rich user interfaces into it, you could leverage the tag library to quickly and easily add it to your application. A good example is a stock ticker that you add to an HTML application. Using an HTML post, a user would have to refresh the entire page for a quote. By adding a rich user interface, the user would see the results appear without the entire page refreshing.

Used incorrectly, however, the tag library can cause significant performance degradation by forcing excessive compilation. The following snippet shows an example of using the Flex tag library. In this example, Flex compiles the MXML file and stores the SWF file in the cache. As long as the MXML code does not change, Flex continues to use the cached version of the content file.

<%@ taglib uri="FlexTagLib" prefix="mm" %>
<mm:mxml>
  <mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml" width="200" height="200">
    <mx:Label id="label0" text="Hello World "/>
  </mx:Application>
</mm:mxml>

If the Flex code changes dynamically, as it does in the following example, Flex compiles a new version every time the MXML content changes. In this case, for each unique user who logs in through the application, the application sets a new session.username value. This causes the MXML content to change, and causes Flex to cache an additional version of the code and the SWF content.

<%@ taglib uri="FlexTagLib" prefix="mm" %>
<% session.setAttribute("username", "brandon"); %>
<mm:mxml>
  <mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml" width="200" height="200">
    <mx:Label id="label0" text="Hi <%= session.getAttribute("username") %> "/>
  </mx:Application>
</mm:mxml>

This is not the preferred approach since it causes excessive compilation. For example, if 500 unique users accessed this application at the same time, the value of session.username would be 500 different values resulting in 499 additional MXML compilations. It will also add a significant number of entries in the cache. A better approach is to pass variables to the Flex application using the <param> tag from the Flex tag library. You can then use the value of that variable, as long as you declare the variable inside an MXML script block. The following code shows the best practices approach to solve the problem explained in the previous code. With this approach the page only compiles once, and each time a unique user accesses the application, the app passes the unique user name through the mm:param value.

<% session.setAttribute("username", "brandon"); %>
<%@ taglib uri="FlexTagLib" prefix="mm" %>
<mm:mxml>
<mm:param name="userName" value="<%= session.getAttribute("username") %>" />
  <mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml" width="200" height="200">
  <mx:Script>
   var userName:String;
  </mx:Script>
    <mx:Label id="uName" text="Hi {userName}"/>
  </mx:Application>
 </mm:mxml>

The <param> tag works fine for simple values, but what if you need to pass an XML tree or complex objects into your Flex application? The following example passes XML into the MXML document using the tag library. There are two ways to accomplish this task and the preferred option for good performance depends on whether the XML is static or dynamic. If the XML is static, it performs better if you embed the JSP code within the MXML document, as shown in this example:

<%@ taglib uri="FlexTagLib" prefix="mm" %>
<html>
<%
  String tree="<node label='Option 1'><node label='Option 1.1'/><node label='Option 1.2'/></node><node label='Option 2'/>"; %>
<mm:mxml>
  <mx:Application width="250" height="250" xmlns:mx="http://www.macromedia.com/2003/mxml">
    <mx:XML id="myTree">
      <%= tree %>
    </mx:XML>
    <mx:Tree dataProvider="{myTree}"/>
  </mx:Application>
</mm:mxml>
</html>

If the XML is dynamic, Flex recompiles the MXML each time the XML changes, which can lead to poor performance. The best approach for handling dynamic data is to load the XML dynamically from the server, using the <mx:HttpService> entry to a JSP or servlet that delivers the XML. The following code invokes a JSP that feeds the XML back to the Flex application when it initializes. After the XML returns, Flex binds the result directly to the <mx:Tree> control.

<%@ taglib uri="FlexTagLib" prefix="mm" %>
<html>
<mm:mxml>
   <mx:Application width="250" height="250" xmlns:mx="http://www.macromedia.com/2003/mxml"
   initialize="xmlFeed.send()">
     <mx:HTTPService id="xmlFeed" url="@ContextRoot()/perfpaper/xmlfeed.jsp" resultFormat="xml"/>
     <mx:Tree dataProvider="{xmlFeed.result}"/>
   </mx:Application>
</mm:mxml>
</html>

The Flex JSP tag library provides a powerful set of features to developers for embedding MXML into your existing applications and building hybrid Rich Internet Applications (RIAs). If used correctly, they perform very well, just remember that dynamic MXML causes recompilation and can fill up the cache quickly. For complete details on using the JSP tag library, see the Flex documentation.

Page 5 of 9
Previous Page
Next Page