Menu
I need to use a rotation in our Spotify app. For this I use the following CSS:
<!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>
In Chrome (26.0.1410.43) there is no big change in the CPU usage (~3%). But in Spotify 0.8.8.459.g4430eae7 I get a permanent CPU usage between 50% and 100%. Besides this code the same happens for Spotify's native load throbber. My computer is a MacBook Pro 2.5 GHz Intel Core i5, 8 GB 1600 Mhz DDR3 main memory, Mac OS 10.8.1. How can I implement this rotation with less CPU usage?
936
The version of Chromium in Spotify doesn't support hardware acceleration at all, therefore CSS transforms like that are going to incur a very significant overhead.
100
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
