тема 05

Браузер и фронтенд-рантайм

Event loop, рендеринг, внутренности V8, цена гидрации.

✦ 8 юнитов ◆ 82 уроков
Начать отсюда Event loop: один поток, три очереди
1
unit 01

Event loop

Один поток, две очереди, один шаг рендеринга — и всё, что происходит когда любой из них стопорится.

2
unit 02

Пайплайн рендеринга

Шесть стадий, два потока, один бюджет 16.67 мс — как байты становятся пикселями и что разрушает бюджет.

3
unit 03

Внутренности V8

Четыре JIT-уровня, hidden classes, inline caches, Orinoco GC и deopt-loop — механизмы, делающие один и тот же JS быстрее или медленнее в 100 раз.

4
unit 04

Воркеры

Вычисления вне главного потока, сетевой прокси и разделяемая память — три воркер-примитива и архитектурные ошибки, которые они не могут решить.

5
unit 05

React fiber-реконсилер

Fiber — JS-объект, чьё связно-списочное дерево позволяет React приостанавливать, возобновлять и приоритизировать рендеринг — а механизм bailout удерживает большие UI быстрыми.

6
unit 06

Стратегии рендеринга: SSR, SSG, ISR, streaming, RSC — и цена гидратации

SSG рендерит один раз на билде; SSR — на запрос; ISR обновляется по расписанию; streaming сбрасывает оболочку первой. Гидратация — отдельная ~2× цена сделать этот HTML интерактивным — RSC и острова сокращают, что нужно гидрировать.

7
unit 07

Core Web Vitals: LCP, INP и CLS

Три полевые метрики, по которым Google оценивает страницы — быстро ли появилось (LCP), отвечает ли (INP), стоит ли на месте (CLS)?

8
unit 08

Всё вместе

Загрузка страницы — эстафета через сеть, парсинг, отрисовку и гидратацию — завершающий раздел трассирует все восемь слоёв, называет пять мест, где производство стабильно ломается, и даёт трёхходовую дисциплину для диагностики и исправления каждого из них.

Вершина · орбита достигнута

Теперь видно тему целиком.

Каждый юнит, от под землёй до орбиты. Браузер и фронтенд-рантайм — одно созвездие в атласе; одолей следующую тему и оно загорится рядом.

Открывается выше ↑ Архитектура фронтенда Форма state, fetching, границы монорепо, build pipelines. Обратно на орбиту Вернуться в атлас Увидеть все темы как одну карту