2013-12-04 3 views
1

Я разрабатываю приложение, которое включает в себя слайды, переводящие в качестве основного механизма навигации. Первый слайд, который должен появиться, включает в себя несколько супернастроенных PNG размером примерно 2000 пикселей в квадрате с прозрачными пленками, а также заметная частота затухания кадров по мере появления изображений.Улучшение производительности при декодировании растровых изображений при переводе на вид

Использование функции хронологии Chrome Dev Tools. Я установил, что, хотя большая часть отдельных задач Paint занимает менее 5 миллисекунд каждый, значительными выбросами являются те события Paint, подзадачи которых включают в себя декодирование PNG, которые занимают от 50 до 100 миллисекунд один за другим, по-видимому, в настоящий момент появляются изображения.

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

+0

Похоже, вам, возможно, потребуется воспользоваться аппаратным ускорением. Взгляните на: http://threejs.org/ –

+0

Используйте 'transform' с' translate3d', чтобы решить эту проблему. Используйте вместо 'left' и' top'. –

+0

@Рупируйте переходы, применяемые к 3D-переводам. Он эффективно переходит на GPU и, безусловно, намного более плавный, чем левая/правая анимация. Проблема заключается в декодировании изображений PNG загодя. – Barney

ответ

1

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

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

  • Нет связанных вопросов^_^