Chrome DevToolsVerified account

But if you know better techniques, I would love to see examples!

My original pen doesn’t have shadows so I wasn’t factoring that in. Pseudo el shadows via opacity/translate/scale for expansion could work

So much nicer! :D You can try adding will-change to see if it makes the performance any better (now everything is on the same layer).

Is `will-change` on the top moving element sufficient, or should everything moving with transform have a `will-change`?

My first guess would be to have every element on separate layer, but just checked and they still seem to cause repaints because of pseudo elements inside. Would have to dig deeper, but my brain is telling me to sleep.

Here's a doc on how to access the Layers tab (it's quite hidden) https://developers.google.com/web/tools/chrome-devtools/evaluate-performance/reference#layers …