Focus Based navigation slow on Arrow Lists

[tneil]

For some reason focus based navigation through Arrow lists with the trackpad is slow. Much slower than navigating any other list with the trackpad.

I'm not sure if it is because I'm applying the styling over every time that a mutation event bubbles down from the nested divs or not.

[tneil]

Figured this bad boy out... kind of crazy actually.

Turns out that most people nest the text arrow list into a rounded panel. And the rounded panel has different styling on BB5 vs BB6/BB7/PlayBook. Essentially in BB6/BB7/PlayBook we now have support for rounded borders so all of the rounded panel styling was done purely in CSS.

On BB5 the rounded panel was done doing some 9-slicing of a background image that created the rounded borders.

On BB6/BB7 the rounded borders take a long time to re-compute/layout in the engine. So when you were highlighting the items in the row this was changing the CSS for the row... and when the the class of a div changes the layout of the page needs to re-compute, which means the rounded border of the panel needed to be re-computed, thus causing lags.

You could also see these lags happening when using the Trackpad to navigate between controls in the settings screens in the samples.

So..what's the solutions.. use the BB5 styling on BB6/BB7 devices and the performance issue goes away while retaining the same look. You can make this change yourself in the bb.roundPanel code by changing the first line of the apply function to:

if (bb.device.isBB7() || bb.device.isBB6() || bb.device.isBB5())

I've made this change in the work that I'll be merging in on May 1st, but you can make the change now in your own bbUI.js file to get the speed increases

[tneil]

Ooops.. yup.. I'm looking at my new code where I've changed those to properties... I updated the post

[tneil]

Just checked in this change