css - CSS 过渡与 CSS 动画的性能

Question

我有一个非常简单的情况：淡入/淡出页面上的元素（简单的 div 等）。我知道这可以通过 CSS 过渡或 CSS 动画的不透明度来实现。

两者之间有性能差异吗？我一直使用 CSS 过渡（主要是因为它们需要更少的 CSS 行等），但我想知道使用 CSS 动画是否能带来任何好处。

Answer 1

不，性能应该差不多。

opacity更改由 GPU 处理，因此在大多数现代浏览器上，您将获得真正流畅的效果。

Answer 2

在某些情况下，CSS3 动画比 CSS3 过渡要慢，因为在使用 CSS3 动画时，一些绘画工作没有提升到 GPU。

在这里您可以找到CSS3 动画与 CSS3 过渡的详细比较。