Purpose
Once you have developed a functional application and are priming for a roll-out, it will be in your interest to tune your application and identify those touch-points which are candidates for tuning. I’ve preferred taking a quantitative approach to performance tuning so that you can compare metrics before and afterwards to identify improvement from a measurable perspective. To this end, it is possible to record statistics both client and server side (currently only for java services). Sometimes the culprit may be server side or client side and determining the area where performance bottlenecks exist is important which is why taking on a triangulation approach is important.
Client Side
Currently in the client, you can invoke the Appcelerator.Util.Performance component. To enable it, simply include logStats=1 in your url, for example: http://localhost:8080/myapp?logStats=1. The performance component by design will have no impact on your application unless you include this parameter. By default, the servicebroker will calculate the statistics for handling all message types both local and remote. The statistics will include the following:
- last - the last recorded time
- mean
- hits - aka count
- min
- max
- total - total time overall
These statistics will be logged to the console (available in Firefox with Firebug and in Safari with Webkit).
However, you do not need to have logging available to inspect the statistics (please see the section “Viewing Client Side statistics” below). In addition the component also allows for resetting all statistics to restart your recording.
Capturing your own statistics
If for some reason you want to capture statistics at a finer level, you can easily to this in javascript:
1 2 3 | var stat = Appcelerator.Util.Performance.createStat(); //do some work Appcelerator.Util.Performance.endStat(stat,"mystat","mycategory"); |
In this example we create a statistic called “mystat” that will be included in a category of “mycategory”. This is useful for filtering through your stats as well as being able to compare statistics side by side. For example, the service broker will automatically record the following categories:
- remote
- local
Viewing Client Side statistics
You may want to include the following content file in your application and make it visible when the logStats=1 parameter is included.
Here is the content source itself
clientperformance.html
Tuning Considerations
As you develop larger applications, it may be useful to consider the following tips:
- use lazy=true for app:content files. this will help to delay long initial load times for your applications
- if you do not lazily load your content files, consider postponing app:message invocations until they are needed
- consider using CSS selectors in the implementation of your app:iterator rather than re-firing messages for logic
- leverage the app:datacache to reduce the number of outgoing messages
- make use of pagination if rendering large datasets - the app:datatable allows for client side pagination for example
Wrap Up
We covered in this article
- how you can capture statistics for client side applications
- some performance tips in regards to client applications
In a later article we will identify how you can take this a step further to capture statistics on the server side as well with java services.This article has been cross posted on
Popularity: 6% [?]



February 21st, 2008 at 1:16 am
One more thing that I didn’t mention in the article is that you can also make use of Firebug’s profiling module. This is useful for detecting low level javascript methods to identify bottlenecks as well.
February 25th, 2008 at 12:31 pm
One thing that I failed to mention is the difference in performance between the browsers (taken from http://zuerchtech.com/2007/12/13/thats-it-im-writing-a-browser-part-2-of-2):
firefox3: loadtime 12 seconds
firefox2: loadtime 20 seconds
IE7: loadtime 89 seconds
safari: loadtime 10 seconds
Note that these are load times for extremely large applications and the firefox2 loadtime was with firebug enabled. Without a doubt Safari is hands down the pinnacle of browsers in the dynamic AJAX enabled space.
February 25th, 2008 at 11:39 pm
On the topic of items flagged as remote vs. local messages: the statistics that are calculated define the amount of time that is required to process the message in the client tier for all the listeners of that message. For example, in monitor.performance.response this includes hiding a div that shows a processing icon and rendering an app:datatable: it does not include sending the request nor the server side processing nor the deserialization of the message. For identifying server side processing statistics, i will in a later article define how to monitor performance of java services.
February 26th, 2008 at 7:08 pm
Isn’t this a new feature in 2.1 or the current trunk; not 2.0.2?
February 26th, 2008 at 7:42 pm
I didn’t specify where this is currently available: its true you will have to checkout trunk or wait for the 2.1 release to leverage this functionality.
cheers