Тёмный

Производительный рендеринг в браузере, Глеб Михеев 

Evrone Development
Подписаться 8 тыс.
Просмотров 7 тыс.
50% 1

Подписывайтесь на наш канал здесь и в телеграмм t.me/meetups_evrone, чтобы быть в курсе будущих митапов и не пропускать полезные доклады!
Мы поговорим о конвейере, как он рендерит, как вносятся изменения на страницу, что такое Reflow, Forced Reflow, как его избегать, как управлять слоями, как оптимизировать рендеринг через вынесение в отдельные слои, и какие еще причины могут вызвать лаги при отрисовке.
Это позволит понять, как браузер все это делает, и начать более осознанно подходит при поиске причин плохой производительности, а также не допускать их в дальнейшем.
Каждый разработчик должен знать, как работает его инструменты, чтобы не заниматься оккультизмом и танцев с бубнами вокруг проблем. Особенно с производительностью.
На практике, не смотря на то, что это не является исключительно тайным знанием, очень мало ребят знают как это работает. И этим докладом я хочу дать разборчивости и показать, что там все просто и доступно, а самое главное - знать это очень полезно.
00:00 - Введение
00:40 - Про рендеринг
04:28 - Reflow
08:04 - Про изменения: FPS и Time Budget
10:28 - Forced Reflow
14:31 - Менеджмент слоев
17:14 - Что еще может испортить нам производительность?
24:20 - Полезные и вредные советы
27:59 - Выводы

Опубликовано:

 

24 май 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 9   
@user-hk7td4dh1o
@user-hk7td4dh1o 10 месяцев назад
Спасибо большое. Все больше понимаешь как работает браузер.
@Doox911
@Doox911 Год назад
Про коллектор - зачёт)
@Arctikus
@Arctikus 2 года назад
Спасибо! Классный доклад!
@user-jm5pp7lm8b
@user-jm5pp7lm8b Год назад
Интересный доклад. Спасибо!
@NikitinBest
@NikitinBest Год назад
Спасибо, очень полезно!
@user-qu6xu8nr4i
@user-qu6xu8nr4i Год назад
Классный доклад 🔥, спасибо!
@gravedigger7332
@gravedigger7332 Год назад
🥰
@user-ui3to8sg9s
@user-ui3to8sg9s Год назад
Хм, а вкладки layers в новом Хроме нет...
@user-px5gv2gi6y
@user-px5gv2gi6y 11 месяцев назад
dev-tools > три точки > more tools > layers версия хрома 113
Далее
КАК СПРЯТАТЬ КОНФЕТЫ
00:59
Просмотров 1,5 млн
Ultimate Golang Developer Roadmap 2024 🚀
11:46
Просмотров 19 тыс.
Kruno: How browsers work | JSUnconf 2017
20:06
Просмотров 78 тыс.