Что такое движок JavaScript
Движок JS превращает исходный текст в работу процессора: парсит, компилирует в байт-код, интерпретирует, затем JIT-оптимизирует горячие участки — а сборщик мусора освобождает память. Движок против рантайма и карта этого трека.
Вы пишете arr.map(x => x * 2), и это работает. Но ничто в вашем процессоре не понимает map, стрелочные функции или * над числом JavaScript. Что-то должно перевести этот текст в те немногие целочисленные инструкции и инструкции с плавающей точкой, которые кремний действительно исполняет — и решить прямо во время работы программы, какие части стоит скомпилировать в быстрый машинный код. Это «что-то» и есть движок.
За следующие десять минут вы увидите, какая именно стадия отвечает за «медленный JavaScript» — и почему исправление требует работы с движком, а не в обход него.
Движок — это программа, которая исполняет вашу программу
Движок JavaScript — это нативная программа (V8 — это примерно два миллиона строк C++), на вход которой подаётся исходный текст JavaScript, а на выходе — работа процессора. Это не чёрный ящик: это конвейер из хорошо изученных стадий, и у каждой стадии есть «характер» по производительности, который можно наблюдать и на который можно влиять.
Наивная модель — «JavaScript интерпретируется строка за строкой» — неверна уже больше десяти лет. Современные движки адаптивны: они стартуют дёшево (интерпретируют байт-код) и становятся дорогими только там, где это окупается (компилируют в оптимизированный машинный код тот код, что выполняется много раз). Весь трек — про эту адаптивную машинерию и про то, как держаться её быстрых путей.
Пять стадий
Когда встретите flame-граф V8 или профиль Node.js с этими названиями — вы будете знать, куда смотреть. Вот что делает каждая стадия:
- Парсер — читает исходный текст и строит абстрактное синтаксическое дерево (AST), структурированное представление вашего кода. Он также делает быстрый проход «pre-parse», чтобы пропустить тела функций, которые ещё не были вызваны (ленивый парсинг).
- Интерпретатор (Ignition в V8) — один раз обходит AST, чтобы выпустить компактный байт-код, а затем исполняет этот байт-код на регистровой виртуальной машине. Здесь стартует весь код. Это быстро производить и легко по памяти.
- Оптимизирующие компиляторы (Sparkplug, Maglev, TurboFan) — для функций, которые выполняются часто («горячих»), движок компилирует байт-код в нативный машинный код, специализируясь по наблюдениям за типами во время работы. Быстрее исполнять, но дороже и прожорливее по памяти производить.
- Сборщик мусора (Orinoco в V8) — работает параллельно со всем остальным, находит объекты, на которые больше никто не ссылается, и освобождает их память. Вы никогда не вызываете
free(); GC выводит это сам. - Куча и стек вызовов — память, где живут ваши объекты (куча) и фреймы функций (стек). Форма и время жизни того, что вы туда кладёте, задают стоимость каждой остальной стадии.
Искусство этого трека — читать эти стадии: почему функцию скомпилировали, а потом выбросили (деопт), почему доступ к объекту медленный (расхождение форм), почему память всё растёт (утечка, которую GC не может собрать).
Движок против рантайма — различие, на котором спотыкаются
Движок реализует язык ECMAScript: числа, объекты, функции, прототипы, замыкания, Promise, сборку мусора. Это всё, что он реализует. Он понятия не имеет, что такое setTimeout, fetch, узел DOM или файловый дескриптор.
Всё это даёт рантайм (хост): браузер, Node.js, Deno, Bun. Рантайм встраивает движок и внедряет хостовые объекты и цикл событий, который их планирует. setTimeout — это не JavaScript, это функция, которую рантайм передаёт движку.
- Числа, объекты, замыкания, Promise
- движок
- Сборка мусора, куча
- движок
- setTimeout, queueMicrotask
- рантайм
- fetch, DOM, fs, console
- рантайм
- Сам цикл событий
- рантайм
- Строк C++ в V8 (приблизительно)
- ~2M
Вот почему один и тот же движок (V8) питает Chrome, Node, Edge и Deno с совершенно разными возможностями: ядро языка одно, хост разный. Цикл событий мы разбираем от и до в юните 07; пока зафиксируйте границу: движок исполняет язык, рантайм поставляет окружающий мир.
Ваш Node-скрипт вызывает `setTimeout`. Какой компонент на самом деле реализует `setTimeout`?
Почему современный движок сначала интерпретирует код, а не компилирует всё в машинный код заранее?
Расставьте по порядку стадии, через которые проходит совсем новая, ни разу не запущенная функция, когда её впервые вызывают много раз в цикле.
- 1 Парсер строит AST из исходного текста
- 2 Ignition выпускает байт-код
- 3 Интерпретатор исполняет байт-код (холодно)
- 4 Оптимизирующий компилятор производит специализированный машинный код (горячо)
▸Почему это работает
Почему вообще «движок»? Термин исторический: у ранних браузеров был компонент, который «приводил в движение» скрипты, как игровой движок движет игру. Название прижилось, хотя сегодняшние движки — это полноценные оптимизирующие компиляторы со сборщиком мусора, ближе к маленькой JVM, чем к простому драйверу скриптов.
- 01Назовите пять основных подсистем движка JavaScript и что делает каждая.
- 02В чём разница между движком и рантаймом? Приведите по два примера каждого.
- 03Почему «JavaScript интерпретируется, поэтому медленный» — неверно?
Движок JavaScript — это нативная программа, которая превращает ваш исходный текст в работу процессора через пять подсистем: парсер, строящий AST; интерпретатор (Ignition), выпускающий и исполняющий байт-код; оптимизирующие компиляторы (Sparkplug, Maglev, TurboFan), компилирующие горячий код в машинный; сборщик мусора (Orinoco), освобождающий память; и кучу со стеком, где живут значения. Модель адаптивна: старт дёшев, оптимизируются только горячие пути. Движок реализует лишь язык ECMAScript — рантайм (Chrome, Node, Deno, Bun) поставляет таймеры, ввод-вывод, DOM и цикл событий. Большая часть «медленного JavaScript» — это движок, сбитый с быстрого пути, а не накладные расходы интерпретации. Теперь, когда вы увидите предупреждение о деопте или скачок GC в профиле, вы будете знать, какую подсистему винить и к какому юниту трека обратиться.
Практика
Начни сверху. Задачи идут от простого к сложному: вспомнить факт, применить к случаю, затем senior-уровень. Открой, попробуй, потом открой ответ.
встречается в184
- Почему GraphQL получает N+1junior
- Механика DataLoader: батчинг на границе тикаmiddle
- Контракты batch-функции: порядок, формы, ошибкиmiddle
- Federation и lookahead: батчинг за пределами DataLoadermiddle
- Защита сложности запросов: depth, cost, persisted queriesmiddle
- Senior GraphQL API: scheduling-контракт, изоляция арендаторов, наблюдаемостьsenior
- Зачем идемпотентность: безопасные retryjunior
- Серверный state machine: четыре состояния idempotency keymiddle
- Outbox и inbox: effectively-once через dual-write границуmiddle
- Конкурентность и архитектура кеша для идемпотентности на масштабеsenior
- Наблюдаемость, production-инциденты и дизайн для глобального масштабаsenior
- Event loop: один поток, три очередиjunior
- Задачи, микрозадачи и scheduler.yield()middle
- Голодание микрозадач, длинные задачи и LoAFsenior
- Event loop Node.js: фазы, nextTick и задержка циклаsenior
- React, Vue и наблюдаемость INP в продакшенеsenior
- Render pipeline: шесть стадий от байтов до пикселейjunior
- Цена стадий и модель процесса рендерераmiddle
- Инвалидация, dirty-биты и containmiddle
- Слои композитора: продвижение, перекрытие и память GPUmiddle
- Флейм-стрип DevTools и жизненный цикл кадраmiddle
- Layout thrash: форсированная синхронная компоновкаsenior
- BeginMainFrame, анимации на потоке compositor и память GPUsenior
- Observability в проде: LoAF, INP и полная поверхность атакиsenior
- Что такое V8 и почему производительность различается в 100 разjunior
- Четырёхуровневый JIT-конвейер V8 и профилированная тиеризацияmiddle
- Hidden classes, деревья переходов и расположение в памятиmiddle
- Inline caches, состояния IC и деоптимизацияmiddle
- Orinoco GC: параллельный scavenger, конкурентная разметка и барьеры записиmiddle
- Спекулятивный движок TurboFan и ловушка deopt-loopsenior
- V8 в production: Isolates, сжатие указателей и реальные аварииsenior
- Жизненный цикл service worker и стратегии кешированияmiddle
- Граничные случаи service worker: version skew, долговременность и ловушка навигацииsenior
- Что делает реконсилер: render vs commitjunior
- Объект fiber и дерево с двойной буферизациейmiddle
- Чистота фазы render и подшаги фазы commitmiddle
- Реконсиляция: эвристики диффа и ловушка ключейmiddle
- Приоритетные lanes, time-slicing и useTransitionmiddle
- Bailout, мемоизация и tearingsenior
- React Profiler, компилятор и продакшн-наблюдаемостьsenior
- Стратегии рендеринга: SSG, SSR, ISR, streaming и гидратацияjunior
- SSG, SSR, ISR, streaming и RSC — как работает каждая стратегияmiddle
- Цена гидратации: selective, progressive, острова, resumabilitymiddle
- Hydration mismatch: причины, обнаружение и правило детерминизмаsenior
- RSC, стратегия на маршрут и production-наблюдаемостьsenior
- Core Web Vitals: что измеряют LCP, INP и CLSjunior
- CLS: почему происходят сдвиги лейаута и как их остановитьmiddle
- Трейдоффы метрик, RUM-атрибуция и цикл CI+полеsenior
- Общая картина: от URL до LCP до INP как эстафетаjunior
- Восемь слоёв трассировки: от service worker до второй навигацииmiddle
- Пять канонических поломок: где производство стабильно ломаетсяsenior
- Метод трёх треков: чтение трасс и построение системы мониторингаsenior
- Что такое cache stampede и почему он делает всё хужеjunior
- Лок и single-flight: ограничение параллельных rebuildmiddle
- XFetch: вероятностное раннее истечение без координацииmiddle
- Stale-while-revalidate и CDN request coalescingmiddle
- Детектирование stampede и дизайн TTL для продакшенаmiddle
- Метастабильный сбой, fencing-токены и production-постмортемыsenior
- Что такое отношение: таблицы, строки, ключи и ограниченияjunior
- Ограничения, ключи и типы данных Postgresmiddle
- Нормальные формы, денормализация и почему схемы «прилипают»middle
- JSONB, массивы и когда side table побеждаетmiddle
- Heap-хранилище, TOAST и выравнивание колонокsenior
- Целостность схемы: deferral, версионирование и сбои в продакшнеsenior
- Реляционная модель vs документные, wide-column, граф и key-valuesenior
- Index-only scan, Visibility Map и INCLUDEsenior
- Типичные сбои в продакшне и аудит индексовsenior
- pg_statistic, ANALYZE и производственная наблюдаемостьmiddle
- Производственные режимы отказа и стабильность плановsenior
- MVCC: как Postgres раздаёт согласованные снимкиjunior
- Заголовок tuple и механика снимковmiddle
- HOT-обновления и уровни изоляцииmiddle
- VACUUM, bloat и autovacuummiddle
- CLOG, XID wraparound и MultiXactsenior
- SSI и production-тюнинг autovacuumsenior
- Реальные провалы MVCC, deployment-паттерны и распределённые снимкиsenior
- Connection pool: зачем амортизировать стоимость backend Postgresjunior
- Режимы PgBouncer: session, transaction и statementmiddle
- Размер пула: формула (ядра × 2) + шпинделей и двухуровневый стекmiddle
- Исчерпание пула и idle-in-transaction: сценарий отказа в 3 ночиmiddle
- Миграция на transaction mode: план развёртывания и prepared statements в PgBouncer 1.21middle
- Процессная модель Postgres и почему увеличение max_connections снижает производительностьsenior
- Ландшафт пулеров 2026, serverless connection storms и полная таксономия отказовsenior
- Что такое миграция схемы и почему она заменяет ad-hoc DDLjunior
- ADD COLUMN: мгновенно в PG 11+ против перезаписи в старом Postgresjunior
- Режим отказа очереди блокировок: почему мгновенный DDL может заморозить базуmiddle
- Безопасные DDL-паттерны: NOT VALID, CONCURRENTLY и исправления небезопасных операцийmiddle
- Expand-contract: нулевой простой для ломающих изменений схемыmiddle
- Advisory-блокировки, инструменты миграций и координация деплояsenior
- Таксономия сбоев миграций и дисциплина продакшнаsenior
- Зачем нужно шардирование: потолок одного Postgresjunior
- Выбор ключа шарда: стратегии hash, range, list и directorymiddle
- Партиционирование против шардирования: одно слово, два разных понятияmiddle
- Ко-локация и Citus: инвариант, делающий шардирование пригодным к использованиюmiddle
- Режим отказа hot shard: обнаружение, изоляция и долгосрочная политикаmiddle
- Schema-based шардирование и альтернативы мультиарендностиsenior
- Онлайн-решардинг, 2PC и операционная стоимость шардированияsenior
- Семь актов: от CREATE TABLE до Citusjunior
- Акты 1–3 в глубину: схема, индексы и статистика планировщикаmiddle
- Акты 4–6 в глубину: MVCC bloat, connection pooling и безопасные миграцииmiddle
- Акт 7 в глубину: шардинг, co-location и семиуровневый каскад трейдоффовmiddle
- Наблюдаемость, антипаттерны и производственный триажsenior
- Роли Raft, term и почему majority-кворум предотвращает split brainjunior
- Как Raft реплицирует log entry и решает, что его безопасно коммититьmiddle
- Выборы лидера в Raft: таймауты, правила голосования и четыре свойства безопасностиmiddle
- Raft в реальном мире: partition, медленный диск и клиентская маршрутизацияmiddle
- Расширения Raft: pre-vote, learner, snapshot и линеаризуемые чтенияsenior
- Raft в production: membership change, Multi-Raft и observabilitysenior
- Где происходит data fetching — и почему это решает LCPjunior
- Fetch waterfall''''ы — диагностика и лечение через Promise.allmiddle
- React Server Components и Suspense streamingmiddle
- Клиентский кэш: TanStack Query, SWR и stale-while-revalidatemiddle
- LCP, prefetch и race conditions в интерактивном fetchingmiddle
- Senior internals: RSC payload, слои кэша и production паденияsenior
- Трёхстороннее рукопожатие TCPjunior
- Номера последовательности и состояние соединенияmiddle
- DNS: что делает и зачем существуетjunior
- Обход резолвера: перенаправления, типы записей и gluemiddle
- TTL, кеширование и распространение DNSmiddle
- Рукопожатие за 1 RTT: key share и ECDHEmiddle
- Возобновление сессии и 0-RTTmiddle
- WebSocket: HTTP-апгрейд до постоянного соединенияjunior
- Формат WebSocket-фрейма: opcodes, маскирование, фрагментацияmiddle
- Backpressure в WebSocket: когда клиенты не успеваютmiddle
- Реконнект: jittered backoff, thundering herd, восстановление сообщенийsenior
- WebSocket в масштабе: HTTP/2 мультиплексирование, permessage-deflate, C10Msenior
- WebSocket в production: прокси, безопасность и распределённая архитектураsenior
- Что делают обратные проксиjunior
- Health checks, connection draining и slow startmiddle
- Session affinity, consistent hashing и правильное решениеmiddle
- Retry-бури, circuit breakers и load sheddingsenior
- Устойчивая архитектура LB: anycast, zone-aware маршрутизация и observabilitysenior
- Почему QUIC, а не TCP+TLSjunior
- Connection ID и миграция сетиmiddle
- Возобновление 0-RTT и шифрование пакетовsenior
- DDoS: что это и почему работаетjunior
- Атаки усиления и истощение состоянияmiddle
- Ограничение скорости: алгоритмы и архитектураmiddle
- WAF, межсетевые экраны, mTLS и HSTSmiddle
- Отравление DNS-кэша и BGP-перехватsenior
- Эшелонированная защита и экономика атакsenior
- DNS, TCP, TLS по очереди: куда уходят миллисекундыmiddle
- Перехват прокси и шлюзы безопасности: rate limiter, WAF, mTLSmiddle
- Альтернативные пути: QUIC 0-RTT, WebSocket upgrade, миграция соединенияmiddle
- Наблюдаемость: распределённые трейсы, USE/RED и семплированиеsenior
- Устойчивость: каскадные повторы, circuit breakers и error budgetsenior
- Что такое три сигнала: метрики, логи, трейсыjunior
- Зачем нужны структурные логи: дневник против таблицыjunior
- Схема продакшн-лога: поля, которые несёт каждая строкаmiddle
- PII-редакция и log injectionsenior
- OTel Logs Data Model и audit-логи как подсистемаsenior
- SLI, SLO и error budget: надёжность в числахjunior
- Error budget policy, latency SLO и составные journeysmiddle
- Продакшн-отказы SLO, самонаблюдаемость, безопасность и общая картинаsenior
- Петля инцидента: от пейджера до постмортема до предотвращенияmiddle
- Cache lines и false sharing: когда параллелизм замедляет кодmiddle
- SIMD и data layout: AoS vs SoA и разница в 4–8xmiddle
- Cache-oblivious алгоритмы, PGO и production failuressenior
- GC в production: наблюдаемость, безопасность, edge cases и управление флотомsenior
- Batching: амортизируй фиксированную цену каждой операцииjunior
- Окно батчинга: размер и время ожиданияmiddle
- Batching в Kafka и Postgresmiddle
- io_uring и наблюдаемость пакетированияmiddle
- От Nagle до io_uring: эволюция пакетированияmiddle
- Backpressure, изоляция сбоев и безопасность батчей в продакшенеsenior
- CI enforcement и RUM: делаем бюджеты рабочимиmiddle
- V8 JIT-пайплайн, HTTP-приоритеты и безопасность bundlesenior
- Цикл performance: дисциплина, а не проектjunior
- Классификация и исправление: сопоставление family bottleneck с методамиmiddle
- Observability-стек и CI gates: ловить регрессии до выпускаmiddle
- От инцидента к enforcement: SLO burn до верифицированного исправления за 35 минутmiddle
- Культура, экономика и масштаб performancesenior
- At-most-once, at-least-once, exactly-once: три контракта доставкиjunior
- Три ножки сбоя — где реально происходят дубликаты и потериmiddle
- Consumer-side dedup: самый дешёвый путь к exactly-once processingmiddle
- Kafka exactly-once semantics: idempotent producer и транзакцииmiddle
- SQS visibility timeout, DLQ и outbox patternmiddle
- Exactly-once в production: impossibility-доказательство, гибридные паттерны и реальные инцидентыsenior
- Что такое OAuth и почему пароли — не ответjunior
- Authorization code flow с PKCEmiddle
- Валидация ID-токена и управление JWKS-кешемmiddle
- Ротация refresh-токенов и scope-based least privilegemiddle
- Sender-constrained токены: DPoP и mTLSsenior
- OAuth в production: audience атаки, observability и реальные провалыsenior
Что-то непонятно?
Задай вопрос по этому уроку. Вопросы анонимны и попадают напрямую автору — урок станет лучше.