SPAHI4
@SPAHI4
реактовцы - это не девы, а прокидыватели пропсов

Как увеличить fps в css?

Такая проблема: у меня фоном 2 fixed блока, один - с фоновой картинкой, scale, blur, gradient. Проблема: страница подлагивает, (хотя никаких операций с блоком не производится включая прокрутку - блок растянут во весь экран) включая все анимации. Как это оптимизировать?
.body:before {
            content: "";
            position: fixed;
            left: 0;
            right: 0;
            z-index: -9999;
            display: block;
            width: 100%;
            height: 100%;
            background: -webkit-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.65) 100%), url('photos/1.jpg') no-repeat;
            background-size: cover;
            -webkit-filter: blur(15px);
            -webkit-transform: scale(1.2);
        }
        .body {
            position: fixed;
            left: 0;
            right: 0;
            z-index: -1;
        }

<div class="body"></div>
  • Вопрос задан
  • 2762 просмотра
Пригласить эксперта
Ответы на вопрос 2
Oogway
@Oogway
Попробуйте этот способ frontender.info/pointer-events-60fps
Ответ написан
Комментировать
@mihail_belyaev
Свойство filter: blur() убивает FPS
Можете даже попробовать постепенно уменьшать радиус размытия и наблюдать за ускорением смены кадров.
Только что с этим столкнулся.
Ответ написан
Комментировать
Ваш ответ на вопрос

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

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