Вот перед до мной повставала задача, создать (объект анимации) создать объект который принимает в себя кучу генераторов
Генераторы в которых содержится анимация, он вызывает эх всех 60 раз в секунду, то есть должны иметь 60FPS, ненужные (которые закончили свою роботу) удалять со списка.
Это было несложно, все сделал через рекурсию requestAnimationFrame
и были некие сомнения что он дает уж не 60FPS и сколько дает нам setIntepval, пожалуйста таблицу на экран:
(Внимание этот график справедлив только в Google Chrome)
setInterval :::::::::::::::32.54==30FPS ;:таймер=16.7
requestAnimationFrame::37.79==26FPS
Как можно увидеть дела совсем плохие, мы получаем FPS у 2 раза меньше чем мы хотели, и помимо этого мы можем увидеть что setInterval имеет задержку меж выполнением меньше!!! Казалось да здравствуй setInterval
, но
везде пишут(читал 3~5 статей) что requestAnimationFrame в отличии от setInterval имеет более стабильный
FPS, и держит его даже в неактивной вкладке
, бред!!!
в обоих случаях оно не стабильно и иногда задержка бывает и до ~200мс, так что про стабильность лош!!!
А как же про не активные вкладке? Смотрите на график:
(Внимание этот график справедлив только в Google Chrome)
setInterval :::::::::::::::1003==1FPS ;;;:max:1020 ;;;;;; таймер=16.7
requestAnimationFrame::2442==0.4FPS ;:max:141003
Удивительно! Скажите лош? Я скопировал и вставил то что было в логах (+оформил в таблицу), как можно увидеть setInterval показал куда лучше результат!
Какие выводы я сделал для себя? Что я буду использовать setInterval, и сделаю для себя следующий маленький алгоритм:
повторять( закруглить_до_меньшего( время задержки / (1000 / 60) ) )раз{
что нужно сделать
}
