2015-05-26 5 views
4

Я работаю над приложением Ember, и он показывает много данных в реальном времени, что делает поток JS действительно занятым.Создавать анимацию CSS во время работы JavaScript?

Я хотел бы добавить приятную анимацию жидкости с CSS3, но с JS, которая работает под капотом, делает все приложение лагги.

Есть ли способ отдать предпочтение анимации CSS, чтобы сделать их текучими? В конце концов, мне все равно, если на половину секунды мои данные не обновляются.

Я в основном цель Chrome и Firefox

ответ

4

Возможно, вы захотите ознакомиться с работой веб-мастеров.

Если вы разрешаете все ваши аякс и обработку данных выполняться потоком webworker, а отображение только потоком DOM вы можете сэкономить много накладных/задержек, вызванных вычислениями.

Одно слово совета. Не делайте work.postMessage (arg, arg), но делаем worker.postMessage (arg) с единственным аргументом.

Сам объект будет отправлен затем вместо того, чтобы он был преобразован в json и преобразован обратно в другой поток. Экономит много времени процессора. Имейте в виду, что поток, который разместил объект, будет «потерян» для объекта (для предотвращения проблем с параллелизмом)

Также элементы DOM не могут быть отправлены веб-работнику, поэтому убедитесь, что ваши данные «чистые», если вы публикуете для рабочего.

+0

Я не думаю, что это будет легко, Эмбер работает по-другому, и внедрение веб-работников может быть очень трудным. –

+0

Javascript - это javascript. Все, что вам нужно сделать, это создать объект javascript: var x = {}; x.calculate = somearray; x.points = somearraywithobjects; worker.postMessage (x); 'Помните, что ember использует javascript, не переопределяет его. Было бы проще, если бы у вас был пример кода, который вычисляется/обрабатывается, но по сути вы очищаете данные, отправляете их работнику, возвращаете и делаете все, что вам нужно. – Tschallacka

+0

Я нашел плагин для Ember для внедрения веб-работников, я постараюсь предложить его моей команде. Благодаря! https://github.com/bengillies/ember-parallel –

1

Может быть, пытается получить CSS анимации, чтобы быть rendered by the GPU была бы возможность.

CPU и GPU будут работать отдельно, вам следует попробовать и посмотреть, дает ли он вам улучшения!

+1

Даже с анимацией GPU немного лагги, и на самом деле нелегко сделать каждый элемент, который нуждается в переходе, использует графический процессор. Кстати, я попытаюсь реализовать его там, где это возможно. Благодаря! –

Смежные вопросы