[EuiAccordion] Replace translateZ
with will-change
#5806
Merged
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
Closes #3548
Using
translateZ
causes anyposition: fixed;
content to render in the wrong location.My guess is that
transform: translatez(0);
was used to either 1) force hardware acceleration of transition effects or 2) resolve rendering a bug in an old/unsupported browser.If the latter, we're no longer affected. If the former, we can achieve hardware acceleration with
will-change: opacity;
; the other values are nice-to-haves in this case.It's also very possible that we don't need to engage the GPU at all and even
transform: translatez(0);
was a preoptimization. In that case, we can removewill-change
, too, but the current method will render more similarly to usingtranslateZ
.Screen.Recording.2022-04-15.at.2.37.32.PM.mov
Checklist