Performance Spotify中CSS轮换的高CPU使用率
我需要在Spotify应用程序中使用旋转。为此，我使用以下CSS：Performance Spotify中CSS轮换的高CPU使用率,performance,css,spotify,css-animations,Performance,Css,Spotify,Css Animations,我需要在Spotify应用程序中使用旋转。为此，我使用以下CSS： <!DOCTYPE html> <html> <head> <style type="text/css"> @-webkit-keyframes rotate { from { -webkit-transform: rotate(0deg); } to { -webkit-transform: r
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
@-webkit-keyframes rotate {
from {
-webkit-transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
}
}
#entity {
background-color: #000;
width: 200px;
height: 200px;
-webkit-animation: rotate 3s infinite linear;
}
</style>
</head>
<body>
<div id="entity"></div>
</body>
</html>
@-webkit关键帧旋转{
从{
-webkit变换：旋转（0度）；
}
到{
-webkit变换：旋转（360度）；
}
}
#实体{
背景色：#000；
宽度：200px；
高度：200px；
-webkit动画：旋转3s无限线性；
}
在Chrome（26.0.1410.43）中，CPU使用率没有大的变化（~3%）。但是在Spotify 0.8.8.459.g4430eae7中，我得到了50%到100%之间的永久CPU使用率。除了这段代码，Spotify的本机load throbber也会发生同样的情况。我的电脑是MacBook Pro 2.5 GHz Intel Core i5，8 GB 1600 Mhz DDR3主内存，Mac OS 10.8.1。如何在CPU使用率较低的情况下实现此轮换？尝试强制硬件加速：
#entity {
-webkit-transform: translate3d(0, 0, 0);
}
来源：Spotify中的Chrome版本根本不支持硬件加速，因此类似的CSS转换将产生非常大的开销。Spotify内部不使用Chrome。用户可能会使用一些定制的其他Webkit实现，其性能不如chrome。