При скролле страницы на мобильной версии сайта постоянно переотрисовывается контет, как исправить?

Question

[onex_dev]

При прокручивании страницы на мобильном устройстве контент как бы "перерисовывается" всё время. Это происходит на конкретном участке (заканчивается где-то на service), тестировал на довольно мощном девайся - безрезультатно. Пациент. Гугление привело только к возможным проблемам с background attachment, но подобное свойство нигде не используется.

Answer 1

[Stalker_RED]

Потестируйте лучше на девайсе попроще. С отключенной GPU-растеризацией фпс падает до 2-3.
Вот эти черные холмогоры при смещении постоянно перерисовывают весь .header.

Попробуйте анимировать не background-position а делать ему translate3d, например.

Comments

[onex_dev]

Переписал под transform: translateX(); Для разделения background'а и контента использовал псевдоэлемент before. Проблема на мобильных устройствах осталась, даже с отключённой анимацией. Отмечу, что проявляется она в Google Chrome. Во встроенном браузере miui такой проблемы не наблюдается. Так же google PageSpeed показывает, что этот кусок рендерится порядка 30 секунд на десктопах (проблема поднялась отдельным вопросом тут).

[Stalker_RED]

onex_dev, translate3d в большинстве браузеров НАМНОГО производительнее, т.к. активно юзает GPU.

[onex_dev]

Stalker_RED, Но проблема с пролагиванием при прокрутке осталась, кэш чистил, обновление последнее у браузера стоит. Могу-ли я с Вами связаться альтернативным способом?