Ragtime_Kitty
@Ragtime_Kitty

Как поднять производительность FF при работе с css blur?

Привет. Есть вот такая конструкция - https://codepen.io/anon/pen/zemvWO

Вкратце - два video одно растянуто как задний фон, другое в контейнере и с filter: blur(10px).

Есть колхозный счетчик кадров. При простом проигрывании размытого видео avg FPS - 59, min 55. У контейнера есть ресайз, во время которого avg FPS - 40, min 35, что уже неприемлемо. Из-за этого у видео дикий рассинхрон да и визуально неприятно. Настройка "По возможности использовать аппаратное ускорение" в firefox ничего не меняет. На убунте в firefox фпс вообще меньше 10 во время ресайза. В хроме FPS стабильно 59 при любых манипуляциях с контейнером или видео.

В движках я не особо, поэтому вопрос - почему firefox так тормозит в данной конструкции даже с блюром в один пиксель? Можно ли как-то поднять производительность пусть даже в конкретном браузере?
  • Вопрос задан
  • 154 просмотра
Пригласить эксперта
Ответы на вопрос 2
Taraflex
@Taraflex
Ищу работу. Контакты в профиле.
Как не старайтесь у вас не выйдет полностью синхронизировать 2 видео даже без блура.

Попробуйте использовать webgl.
Только не делайте блур через пост процессинг. Это будет слишком дорого.
Делайте блур прямо шейдере при отрисовке выводимого прямоугольника за один проход. Так получим проигрыш по числу выборок из текстуры, но это будет все равно дешевле, чем делать 2-х проходный постпроцессинг.
Ответ написан
profesor08
@profesor08 Куратор тега CSS
Вот берешь весь свой код с идеей с двумя видео и выкидываешь на помойку. Для реализации всего задуманного тебе надо лишь 1 видео, скрытое и 2 канваса. Видео само воспроизводится, на канвасах рисуй его, один из них размывай как хочешь, хоть свойством blur, хоть средствами канваса. Результатом будет два канваса, на которых синхронно рисуются кадры из видео, и один будет заблюрен.

А если картинку видео передавать в шейдер, и рисовать все там, то производительность будет космическая.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы