Как исправить просадки FPS при скролле блока с position fixed/absolute?

Question

[Camaro67]

Здравствуйте!

В некоторых браузерах при скролле блока с position fixed/absolute идут сильные просадки в FPS. Как можно это исправить? Пример о чем идет речь.

Заранее благодарен за помощь!

Comments

[Анатолий]

В некоторых - это в каких? Проверил в Google Chrome 66.0.3359.181 и Firefox 60.0.1 - ничего подобного не заметил.

P.S.: для стилей есть .css файл, необязательно не надо пихать их в HTML.

[Camaro67]

Анатолий, В Firefox, IE тоже отлично работает, в Chrome немного подтормаживает, а вот в Яндекс.Браузер уже очень заметно.

P.S.: для стилей есть .css файл, необязательно не надо пихать их в HTML.

Сделал для удобства, если кто-то захочет скопировать в html файл для проверки.

[Даниил Сугоняев]

Camaro67, листаю с Яндекс браузера, никаких тормозов. Возможно проблема в вашем браузере?

[Camaro67]

Даниил Сугоняев, На рабочем компьютере тоже проблемы нет, а вот на слабеньком ноутбуке проявляется.

Answer 1

[Даниил Сугоняев]

Поможет свойство will-change. Оно позволяет браузеру подготовиться к нагрузке
https://developer.mozilla.org/ru/docs/Web/CSS/will...

Comments

[Camaro67]

На блок с position: fixed уже выставлял will-change: scroll-position - результат не изменился.

[Camaro67]

Проблема решена, указал will-change: top, left и все отлично заработало.

[Camaro67]

Спасибо :)

Answer 2

[Дмитрий Кузнецов]

Меньше текста, картинок и т.п.

Comments

[Camaro67]

Это не вариант т.к. там и так очень мало текста (в примере сильно увеличено количество текста), а картинок и вовсе нет. Там скролл всего экранов на 3-7 выходит.

[Дмитрий Кузнецов]

Camaro67, ну хз тогда. У меня ни чего не проседает.