Leaderboard is sluggish on mobile devices

[thrasher66099]

I have created a leaderboard for my game, but the scrolling is very laggy when I attempt to swipe on a mobile device. Here is a description of how I've set the scene up and I'm willing to send an approximation of the scene to anyone that is willing to help (certain proprietary items that have nothing to do with this issue will be removed).

I have a leaderboard with 100 rows of leaderboard items. The leaderboard is on a scrollable panel which is currently soft clipped. The child of that draggable panel is a UIGrid widget. This widget contains the 100 leaderboard items. Each item on the leaderboard is made up of a left anchor object which also has 2 children that are both labels and a right anchor object also with 2 children which are labels. The leaderboard item also has a sprite widget which is the background for the row.

Because this leaderboard is meant for mobile devices a large amount of scaling needs to be done to make sure the layout stays pretty. This means there is fairly heavy use of UIStretch and UIAnchor. I have added a bool to each of these scripts so that after they scale each object the first time they remove themselves.

Currently when I run this leaderboard on an Iphone 4 the profiler says that the cpu is taking approximately 10ms to process UIPanel.LateUpdate() and when I start actually dragging the panel it takes MUCH longer than that. This seems like a phenomenally high amount of time. I must be doing something wrong. Does anyone have any ideas?


Also please let me know if you need more information.

[ArenMook]

"a large amount of scaling needs to be done" <-- this raises red flags to me. Why do you need to do this? If a UIRoot is marked as fixed size, then the UI will look exactly the same on all devices. Excessive usage of anchors and stretch scripts will kill your framerate, as you have now noticed.

I suggest reconsidering how you are structuring your UI.

[Nicki]

So, the thing is that the draggable panels aren't all the good when you have 100s of items in them. While dragging all widgets are actively drawn which makes UIPanel.LateUpdate crazy slow.

I recommend you build a system where the panel only has X containers active (where X is the number of elements + a few buffer elements). We've been experimenting at work with doing this and it is quite a bit faster to have 10 active elements that shift than 15 constantly active elements the way they are now. Another advantage of such a system is that it scales infinitely (almost), while the existing system caps out quite lower. I've seen examples where about 100 children with each 5 widgets would be un-scrollable on iPhone 4S, which should run just about anything.

I think there has been these kinds of solutions on these forums before, but I don't remember where.

[thrasher66099]

"a large amount of scaling needs to be done" <-- this raises red flags to me. Why do you need to do this? If a UIRoot is marked as fixed size, then the UI will look exactly the same on all devices. Excessive usage of anchors and stretch scripts will kill your framerate, as you have now noticed.

I suggest reconsidering how you are structuring your UI.

Just to reiterate, the scaling is only done on the first frame of the scene. After that I remove all of the scaling scrips because they are no longer needed. Because our app is meant for many aspect ratios the UI is different for each. Just to clarify it's not just a game UI. Our app is meant for enterprise companies and holds multiple games so the base is more of a business app than a game.

[ArenMook]

Idling, LateUpdate shouldn't take much time at all -- especially with the latest version of Unity. I suggest digging further into what's causing the delay -- such as a frequently changing widget that causes all other widgets to be rebuilt. Sprite animation would do it, for example. So would a color tween.