Skip to content

Instantly share code, notes, and snippets.

@pec1985
Created June 25, 2012 15:37
Show Gist options
  • Star 7 You must be signed in to star a gist
  • Fork 3 You must be signed in to fork a gist
  • Save pec1985/2989311 to your computer and use it in GitHub Desktop.
Save pec1985/2989311 to your computer and use it in GitHub Desktop.
Optimizing Appcelerator's Titanium
/**
* Test #1
* Adding 10,000 Ti.UI.TableViewRows to a Ti.UI.TableView
* The rows have the Ti.UI.iPhone.TableViewCellSelectionStyle.BLUE constant in them
*
* Total time in my Mac: 1228ms
*/
var win = Ti.UI.createWindow({
backgroundColor: '#ccc'
});
win.open();
var table = Ti.UI.createTableView();
win.add(table);
// Start the timer
var time = new Date().getTime();
// ==========================================
var data = [];
for(var i = 0; i < 10000; i++){
data.push(
Ti.UI.createTableViewRow({
title:'Row #'+i,
selectionStyle: Ti.UI.iPhone.TableViewCellSelectionStyle.BLUE
})
);
}
table.setData(data);
// ==========================================
// End the timer
var end = new Date().getTime();
Ti.API.info('It took ' + (end - time)+'ms');
// 1228ms
/**
* Test #2
* Adding 10,000 Ti.UI.TableViewRows to a Ti.UI.TableView
* A JavaScript variable holds the Ti.UI.iPhone.TableViewCellSelectionStyle.BLUE constant
* That variable is then passed to the rows, this way we don't call Ti every time
*
* Total time in my Mac: 826ms
*/
var win = Ti.UI.createWindow({
backgroundColor: '#ccc'
});
win.open();
var table = Ti.UI.createTableView();
win.add(table);
var SELECTION_STYLE_BLUE = Ti.UI.iPhone.TableViewCellSelectionStyle.BLUE;
// Start the timer
var time = new Date().getTime();
// ==========================================
var data = [];
for(var i = 0; i < 10000; i++){
data.push(
Ti.UI.createTableViewRow({
title:'Row #'+i,
selectionStyle: SELECTION_STYLE_BLUE
})
);
}
table.setData(data);
// ==========================================
// End the timer
var end = new Date().getTime();
Ti.API.info('It took ' + (end - time)+'ms');
// 826ms
/**
* Test #3
* Adding 10,000 JavaScript Objects to a TableView
* A JavaScript variable holds the Ti.UI.iPhone.TableViewCellSelectionStyle.BLUE constant
* That variable is then passed to the Object, this way we don't call Ti every time
* In this test, I have an object instead of a Ti.UI.TableViewRow
*
* Total time in my Mac: 460ms
*/
var win = Ti.UI.createWindow({
backgroundColor: '#ccc'
});
win.open();
var table = Ti.UI.createTableView();
win.add(table);
var SELECTION_STYLE_BLUE = Ti.UI.iPhone.TableViewCellSelectionStyle.BLUE;
// Start the timer
var time = new Date().getTime();
// ==========================================
var data = [];
for(var i = 0; i < 10000; i++){
data.push({
title:'Row #'+i,
selectionStyle: SELECTION_STYLE_BLUE
});
}
table.setData(data);
// ==========================================
// End the timer
var end = new Date().getTime();
Ti.API.info('It took ' + (end - time)+'ms');
// 460
@iskugor
Copy link

iskugor commented Jun 26, 2012

Tests #3 is not really comparable with first two (maybe #2 and #3, but for "createTableViewRow" VS object-literal).

On Android, caching object's properties does not make any significant difference because v8 is amazing piece of software that does that automatically. :)

@pec1985
Copy link
Author

pec1985 commented Jun 26, 2012

I should have specified, this was an iPhone simulator test.
Number 3 is different, I know, but it's just to show that if the TableViewRows are going to be simple, you're better off using a literal obj

@jeffbonnes
Copy link

Great stuff. Many people to not think about the fact that the are crossing the 'krull bridge' when calling a Ti object - even a constant.

@freddymontano
Copy link

That's very interesting!
Using test2.js it took about 960ms for me, then I tried something different that cut it down to 806 ms.
What I did was also put the function Ti.UI.createTableViewRow in some var (var createRow = Ti.UI.createTableViewRow), and use that var inside the loop. Seems to help a little bit!

Code: https://gist.github.com/3056032

@stephenfeather
Copy link

Hrm. I need to look at this a bit closer. We have one app that creates a table with nearly 1000 rows which each have 2 labels. Wondering how much time I can chop off using freddy's findings.

@iskugor
Copy link

iskugor commented Jul 6, 2012

I hope that you understand that doing this: var createRow = Ti.UI.createTableViewRow; can be problematic in JS.

I used similar optimizations when there was only Rhino available on Android, but I used this: var UI = Ti.UI;

That's safer to do and it brings some minor performance improvements, but now when we have v8, that kind of optimizations are useless on Android.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment