Почему тормозит css анимация при загрузки конента во фрейме?

Question

[killer112]

Всем привет!

Пишу небольшое приложение на node-webkit. Основная функция: отображать во фрейме, развернутом на весь экран, нужный сайт. Во время загрузки страниц во фрейме поверх него отображается css анимация - мол,страница загружается. Получается по сути такой браузер в браузере :)

Проблема заключается в том, что во время загрузки контента css анимация начинает сильно тормозить несколько секунд. То ли из-за рендеринга страницы, то ли из-за javascript, то-ли из-за загрузки контента на страницу.

Кто-нибудь знает, как это побороть? Или бесполезно?

Набросал пример: jsfiddle.net/jn71Lwp3/1 - можно посмотреть в webkit браузерах.

Answer 1

[Иван Беленков]

попробуйте добавить к анимированному блоку следующее свойство:
transform: translatez(0);
Это свойство принудительно включает аппаратное ускорение графики. Но не уверен, что это панацея.

Answer 2

[frees2]

10 секунд тормозит, на js было бы быстрее. дизайнеры решают эту проблему представляя задержки как часть анимации, например маленькие кубики в ряд, самые умные вообще отказываются от дурацких крутилок, так мешающих глазам и мозгам и используют текст.