[TIMOB-25238] Android: View with a border can cause a significant performance deficit
GitHub Issue | n/a |
---|---|
Type | Bug |
Priority | Critical |
Status | Closed |
Resolution | Fixed |
Resolution Date | 2017-10-04T18:06:14.000+0000 |
Affected Version/s | Release 6.2.0 |
Fix Version/s | Release 6.3.0 |
Components | Android |
Labels | consider-6.2.3 |
Reporter | Gary Mathews |
Assignee | Gary Mathews |
Created | 2017-09-06T19:37:48.000+0000 |
Updated | 2017-10-23T21:37:00.000+0000 |
Description
- A view with a border containing another view with a border will re-draw on every frame, causing significant UI performance hit.
*TEST CASE*
var win = Ti.UI.createWindow({backgroundColor: 'gray'}),
list = Ti.UI.createListView({
templates: {
template: {
childTemplates: [
{
type: 'Ti.UI.View',
properties: {
left: 5,
right: 5,
top: 5,
backgroundColor: 'blue',
height: 90,
bottom: 5,
borderColor: 'orange',
borderRadius: 10,
borderWidth: 5
},
childTemplates: [
{
type: 'Ti.UI.View',
bindId: 'item',
properties: {
left: 10,
right: 10,
height: 30,
backgroundColor: 'red',
borderColor: 'purple',
borderRadius: 5,
borderWidth: 3
}
}
]
}
]
}
},
defaultItemTemplate: 'template'
}),
section = Ti.UI.createListSection(),
items = [];
for (var i = 0; i < 48; i++) {
items.push({
item: {
width: '50%'
}
});
}
section.setItems(items);
list.setSections([section]);
win.add(list);
win.open();
master: https://github.com/appcelerator/titanium_mobile/pull/9410
I've done some tests about this bug and reported my findings on Slack channel : https://ti-slack.slack.com/archives/C03CVQX2A/p1506087232000476 Essentially on Android my TableView with 6.2.2GA is very laggy and with 6.1.2GA it was smooth. So from 6_3_X branch I've rebuilt the sdk with the above PR ( refactored TiBorderWrapperView ) and nothing changed. TableView was still slow when scrolling. The issue was somewhere else so I reverted "TiUIView.java" from 6_1_X and rebuilt the sdk with some logs as @Michael Gangolf suggested me. These are the results with
Log.i("test", "on draw");
inprotected void onDraw(Canvas canvas)
of TiBorderWrapperView.java: 1) 6_3_X with refactored TiBorderWrapperView : Logs “on draw” everytime I scroll the tableView. 2) 6_3_X with refactored TiBorderWrapperView and TiUIView from 6_1_X : Logs “on draw” only one time (at the creation). In my case this commit caused the issue: https://github.com/garymathews/titanium_mobile/commit/5bbf07e1d5b63a56fbda810d0cbd1d2262e9f42e#diff-84cbe74b6ace83d16bcb3ecf277594f3 There is also another problem with the refactored TiBorderWrapperView :This View is filled with red color and should be red only the border.
[~grazianogrespan] I have updated [#9410](https://github.com/appcelerator/titanium_mobile/pull/9410). I cannot allow HW-acceleration when an alpha channel is used on the background. Android does not render the view correctly. Do you have a test case I can use to see the performance deficit you are seeing?
@Gary Mathews Unfortunately I don't have a test case but instead I have a great news : I've just built the sdk with your latest commit [ #9410](https://github.com/appcelerator/titanium_mobile/pull/9410/files) (TiUIView+TiBorderWrapperView) and the app returned to be smooth and fast. I suppose this [line](https://github.com/garymathews/titanium_mobile/blob/6e41e94646c89db6ca1f29348a1692a13a2d15a6/android/titanium/src/java/org/appcelerator/titanium/view/TiUIView.java#L1442) was the problem.. Now everything is perfect (y) Thanks!
FR Passed & PR merged for master.
[~lchoudhary] 6_3_X: https://github.com/appcelerator/titanium_mobile/pull/9501
FR Passed & PR merged for 6.3.0 PR.
Verified the fix in SDK 7.0.0.v20171023120246 & 6.3.0.v20171018084007. Closing. Studio Ver: 4.10.0.201709271713 OS Ver: 10.12.3 Xcode Ver: Xcode 8.3.3 Appc NPM: 4.2.10-2 Appc CLI: 6.3.0-master.15 Ti CLI Ver: 5.0.14 Alloy Ver: 1.10.6 Node Ver: 7.10.1 Java Ver: 1.8.0_101 Devices: ⇨ google Nexus 5 — Android 6.0.1 ⇨ google Pixel — Android 7.1.1