[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 :var view = Ti.UI.createView({ width:34, height:34, borderWidth:1, borderRadius:17, borderColor: 'red' });[~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