Браузер и фронтенд-рантайм
Render pipeline: тест на свободное вспоминание
Вспоминание бьёт перечитывание. Для каждого промпта скажи или запиши полный ответ по памяти, прежде чем открыть модельный ответ — именно усилие вспоминания закрепляет pipeline.
Реконструируй ключевые механизмы юнита — шесть стадий и два потока, правила инвалидации, compositor layers, frame lifecycle, layout thrashing и production-петлю — не заглядывая в уроки.
- 01Назови шесть стадий pipeline по порядку и скажи, какой поток владеет каждой.
- 02Сопоставь три класса CSS-изменений со стадией, которую они инвалидируют, и объясни, чем различается стоимость.
- 03Что делает overlap rule и почему один will-change промоутит десяток соседей?
- 04Объясни forced synchronous layout и фикс в два прохода.
- 05Каков порядок событий внутри одного кадра и почему rAF отличается от ResizeObserver?
- 06Как INP и LoAF замыкают production-петлю и какие две проблемы pipeline обычно вызывают плохой INP?
Если ты смог реконструировать каждый ответ по памяти, ты держишь хребет юнита: шесть стадий на двух потоках под бюджетом 16.67 мс, свойство, которое ты меняешь, выбирает стадию для инвалидации, dirty bits текут вниз по потоку, compositor layers дёшевы для движения, но дороги для удержания (а overlap rule промоутит соседей), layout thrashing — это чтение после записи, исправляемое two-pass batch, frame lifecycle фиксирует, когда срабатывают rAF и ResizeObserver, а INP плюс LoAF замыкают петлю от ощущаемого пользователем медленного взаимодействия назад к точной стадии, которая его вызвала.