Чередование изменения width и getBoundingClientRect может вызывать принудительный layout на каждой итерации — layout thrashing.
elements.forEach(element => {
Чередование изменения width и getBoundingClientRect может вызывать принудительный layout на каждой итерации — layout thrashing.
Короткий ответ
Что ответить на собеседовании
Подробный разбор
Ответ с пояснениями
Условие
elements.forEach(element => { element.style.width = '300px';
console.log( element.getBoundingClientRect().width ); });
// [ссылка]
export default () => { return Hello! }
Ответ
Чередование изменения width и getBoundingClientRect может вызывать принудительный layout на каждой итерации — layout thrashing.
Сначала выполните все записи стилей, затем отдельным циклом прочитайте размеры. Это позволяет браузеру объединить работу, хотя первое чтение всё равно может потребовать layout. Измеренная ширина зависит от box-sizing, рамок и преобразований, поэтому не всегда равна заданным 300px.