803461 - [Unagi] lock screen handle is very unresponsive

Status: RESOLVED INVALID

(Firefox OS Graveyard :: Gaia::System::Lockscreen, defect)

Description

[Tim Taubert [:ttaubert] (inactive)]

Dragging the handle to unlock the screen is very unresponsive and I think we should do something about that. That's a very common action and makes the device feel really sluggish.

Comment 1

[Tim Taubert [:ttaubert] (inactive)]

First, I think we should reduce the offsetWidth usage in LockScreen.handleMove(). We don't really need to query offsetWidth all the time when dragging because the handle and overlay size doesn't change.

https://github.com/ttaubert/gaia/commit/342aabd07b5eaef65acba543e59179da7fb7566a

Comment 2

[Tim Taubert [:ttaubert] (inactive)]

Second, I noticed that the performance gets remarkably better (still room for improvement, though) when the 'handlegrow' animation that animates the glowing ring around the handle is disabled.

https://github.com/ttaubert/gaia/commit/ced19e695eae30e5f867bc68bf3a0594c486b9b9

Disabling doesn't seem like a viable solution but I just wanted to note that this little animation obviously adds a lot of jank.

Comment 3

[Tim Taubert [:ttaubert] (inactive)]

Third, I think we should not modify the rail widths but rather scale them using transforms. I don't know much about the internals but I suspect this to be faster because transforms can not cause reflows? I didn't see a big speedup but it should be a little faster?

https://github.com/ttaubert/gaia/commit/73799e892eb95c0171f19c95ec2cd93ebaed701d

Comment 4

[Tim Taubert [:ttaubert] (inactive)]

(In reply to Tim Taubert [:ttaubert] from comment #2)
> Second, I noticed that the performance gets remarkably better (still room
> for improvement, though) when the 'handlegrow' animation that animates the
> glowing ring around the handle is disabled.

The rails' opacity transitions seem equally expensive. With both of these animations removed the handle is a lot more responsive and smooth.

Comment 5

[Tim Taubert [:ttaubert] (inactive)]

Ok, I'm out of ideas for now. Is disabling the handlegrow animation and the rails' opacity transitions an option? If our target is lower-end devices it feels kind of silly to sacrifice performance for subtle effects like this. Creator of these effects, please don't feel offended :)

Comment 6

[Tim Taubert [:ttaubert] (inactive)]

Seems like most of this has already been addressed in bug 803945?

Comment 7

[Chris Jones [:cjones] inactive; ni?/f?/r? if you need me]

Over the weekend I did a canvas implementation

http://people.mozilla.com/~cjones/lockscreen/

It's 300 lines of JS, simpler IMHO, more responsive, has solid 60fps perf, uses less CPU %, and looks better on 16bpp screens.  I hear there's a UX change coming down the pipe so I'll try to update that impl for the new UX and get it in.

Comment 8

[Tim Guan-tin Chien [:timdream] (please needinfo)]

Given the fact that the design have been changed, this bug should be closed.

CCing Yuren who is doing the current implementation. Thanks for exploring!