ampproject / amp-by-example

DEPRECATED: AMP by Example has been merged into amp.dev
http://amp.dev
Apache License 2.0
753 stars 506 forks source link

Menu animation jank for <amp-sidebar> #1240

Open morsssss opened 6 years ago

morsssss commented 6 years ago

This is about the examples at https://ampbyexample.com/components/amp-sidebar/ . When I try out the <amp-sidebar> examples by pressing a button like "Toggle Sidebar" or "Open Sidebar", the menu frequently slides out in a highly janky way. It slides over some, it stops for a fraction of a second, slides out some more, etc.

Sometimes, of course, it's fine.

I don't know if this is caused by the AMP runtime, the component, or something else, and I admit I haven't tried to debug. It just concerns me when our menu isn't best-in-class!

morsssss commented 6 years ago

I want to note that I don't see similar jank at https://ampstart.com/components#navigation.

kul3r4 commented 6 years ago

@morsssss I took a quick look and the problem seems to be introduced by amp-fit-text, then I found https://github.com/ampproject/amphtml/issues/10967 which is related. I am closing it as it's not a bug on AMPByExample

morsssss commented 6 years ago

Hmm... this does indeed involve amp-fit-text, yes... but I'm more concerned about the janky way in which the sidebar slides in and out.

Do you see that too?

In any case, it makes sense to me that it wouldn't be a bug in ampbyexample, but something that could be improved with the component itself :) If you'd like, I'll ask the AMP team about this instead.

kul3r4 commented 6 years ago

I don't see any junk when slide in and slide out, I only see the problem with the text that jumps, maybe could you share a video?

morsssss commented 6 years ago

Does this help?

I've got a higher-quality MP4 as well...

amp-sidebar gif