[AC-3286] ScrollView with views loads very slowly compared to similar native iOS code.
GitHub Issue | n/a |
---|---|
Type | Improvement |
Priority | n/a |
Status | Closed |
Resolution | Invalid |
Resolution Date | 2015-04-06T23:23:53.000+0000 |
Affected Version/s | n/a |
Fix Version/s | n/a |
Components | Titanium SDK & CLI |
Labels | Performance, TCSupportTriage, button, label, scrollView, speed |
Reporter | Andrey Melnikov |
Assignee | Radamantis Torres-Lechuga |
Created | 2014-10-02T01:50:51.000+0000 |
Updated | 2016-03-08T07:57:42.000+0000 |
Description
A ScrollView with a vertical layout and 1000 labels takes
approximately 59 seconds to load with a Titanium compiled App on an iPad mini, and approximately
0.850 seconds to load with native iOS code on the same iPad mini.
STEPS TO REPRODUCE
1. Create new mobile app project
2. Choose default Alloy Project
3. Copy and paste the following code into their respective files
index.xml
<Alloy>
<Window class="container" >
<ScrollView id="scrollView" layout="vertical"></ScrollView>
</Window>
</Alloy>
index.tss
".container": {
backgroundColor:"white"
}
index.js
var startTime = new Date();
startTime = startTime.getTime() / 1000;
$.index.addEventListener('postlayout', calculateTimeToLoad);
loadThousandTextFields();
function calculateTimeToLoad() {
$.index.removeEventListener('postlayout',calculateTimeToLoad);
var endTime = new Date();
endTime = endTime.getTime() / 1000.0;
Ti.API.info("Total time taken:" + (endTime - startTime) + " seconds");
}
function loadThousandTextFields() {
for(var i = 0; i < 1000; i++) {
$.scrollView.add(Ti.UI.createTextField({
hintText: "Hint text"
}));
}
}
$.index.open();
The time taken is output in the console. Can be replaced with an alert to more easily see in application.
*Further Notes*
Testing with version 3.2.3 GA produced similar results, however, 1000 buttons took approximately 0.950 seconds when only title was specified, but took approximately 5 seconds when attributes, such as width/height were specified (this was tested on iOS 3.5" iPhone simulator).
Our team spoke with Stephen Feloney about this issue.
Hello! you will gain performance by using the ListView. http://docs.appcelerator.com/titanium/3.0/#!/guide/ListViews in general, we don't recommend to create several hundred buttons or items in the screen, we recommend to use lazy loading techniques in order to accomplish a better user experience. Best Regards