Я проверял эту статью и нашел этот Codepen о CSS-анимации:
html, body {
overflow: hidden;
background: #a02615;
padding: 0;
margin: 0;
}
.sun {
position: absolute;
top: -75px;
left: -75px;
animation: sun-spin 10s linear infinite;
}
@keyframes sun-spin {
from { transform: rotate(0); }
to { transform: rotate(360deg); }
}
<img src="//sergeche.github.io/gpu-article-assets/images/sun-full.png" class="sun" />
Я хотел проверить FPS для этой анимации. Когда я открываю счетчик FPS, я вижу, что FPS всегда около 60:
Однако, когда я запускаю профиль производительности в Chrome DevTools, FPS остается пустым:
Есть идеи, почему я не вижу зеленую линию со скоростью 60 FPS в DevTools?