💥 Layout Thrashing — как исправить? Это спросят на собесе!
Layout Thrashing — это перфоманс-баг, когда браузер принудительно многократно выполняет Reflow в цикле из-за чередования чтения и записи свойств layout. Например, вы в цикле читаете offsetHeight, а потом тут же меняете стиль, и так 100 раз. Браузер не успевает накопить изменения и каждый раз пересчитывает геометрию заново. Это одна из главных причин тормозов в интерфейсе. Решение — разделить чтение и запись: сначала прочитать все значения, потом применить все изменения, либо использовать requestAnimationFrame. На собеседовании Middle и Senior фронтенд-разработчика важно не только знать, что такое Layout Thrashing, но и уметь его находить и исправлять. Полный разбор стратегий оптимизации производительности — в большом видео по ссылке под этим шортсом. #layoutthrashing #frontend #frontendinterview #middle #senior #techinterview #codinginterview
Layout Thrashing — это перфоманс-баг, когда браузер принудительно многократно выполняет Reflow в цикле из-за чередования чтения и записи свойств layout. Например, вы в цикле читаете offsetHeight, а потом тут же меняете стиль, и так 100 раз. Браузер не успевает накопить изменения и каждый раз пересчитывает геометрию заново. Это одна из главных причин тормозов в интерфейсе. Решение — разделить чтение и запись: сначала прочитать все значения, потом применить все изменения, либо использовать requestAnimationFrame. На собеседовании Middle и Senior фронтенд-разработчика важно не только знать, что такое Layout Thrashing, но и уметь его находить и исправлять. Полный разбор стратегий оптимизации производительности — в большом видео по ссылке под этим шортсом. #layoutthrashing #frontend #frontendinterview #middle #senior #techinterview #codinginterview




