Браузер и BOM

setTimeout(fn, ms) планирует однократный запуск fn примерно через ms миллисекунд; setInterval(fn, ms) запускает его повторно каждые ms, пока не остановят. Каждый возвращает числовой id таймера. Передайте этот id в clearTimeout(id), чтобы отменить ожидающий таймаут, или в clearInterval(id), чтобы остановить повторяющийся интервал. Задержка — это минимум, а не гарантия, ведь колбэк ждёт свободный стек вызовов.

window — глобальный объект и корень страницы; document — его потомок, дерево DOM содержимого страницы. BOM предоставляет браузерные объекты на window: location читает и меняет текущий URL, history ходит по стеку сессии через back()/forward(), а navigator сообщает сведения о браузере и платформе, например userAgent. BOM формально не стандартизирован.

localStorage хранится для origin, пока его явно не очистят, даже после перезапуска браузера. sessionStorage живёт только для текущей вкладки и стирается при её закрытии. Cookie тоже привязаны к origin, но истекают по заданной дате, ограничены ~4КБ и отправляются с каждым HTTP-запросом на сервер. Оба хранилища держат ~5МБ строк и остаются только на клиенте.

expires (или max-age) задаёт время жизни; без него это сессионная cookie. path ограничивает её префиксом URL. HttpOnly скрывает её от JavaScript, так что document.cookie не может её прочитать, ослабляя кражу через XSS. Secure отправляет её только по HTTPS. SameSite (Strict/Lax/None) ограничивает отправку на межсайтовых запросах. Удаляют cookie, переустанавливая её с прошедшей датой expires и тем же path.

DOMContentLoaded срабатывает, когда HTML разобран и DOM построен, до загрузки картинок и стилей; load срабатывает позже, после загрузки всех подресурсов. Обычный <script> блокирует разбор, пока скачивается и выполняется. defer скачивается параллельно, но выполняется после разбора, в порядке документа, прямо перед DOMContentLoaded. async тоже скачивается параллельно, но выполняется сразу по прибытии, поэтому порядок не гарантирован и он может выполниться до или после разбора.

setTimeout(fn, 0) не запускается сразу — он ставит fn как макрозадачу после текущего синхронного кода (а при вложенности браузер ограничивает ~4мс). Debounce откладывает функцию, пока вызовы не затихнут на время паузы; throttle запускает её не чаще раза за интервал. requestAnimationFrame планирует колбэк прямо перед следующей перерисовкой, синхронизируясь с обновлением экрана, что делает анимации плавнее, чем setInterval с фиксированной задержкой.

Микрозадачи (колбэки Promise) опустошаются после текущей задачи, но до отрисовки; макрозадачи вроде setTimeout выполняются позже; requestAnimationFrame выполняется прямо перед следующей перерисовкой, идеален для визуальных обновлений. Изменения раскладки запускают reflow (пересчёт геометрии, дорогой и каскадный), а изменения только стиля — более дешёвый repaint. Группируйте чтения/записи DOM против thrashing, выносите тяжёлую работу CPU в Web Worker и вызывайте removeEventListener на удалённых узлах против утечек.

location отражает текущий URL: установка location.href (или location.assign) переходит и перезагружает страницу, а location.replace — без записи в историю. history ходит по стеку сессии через back()/forward()/go(), а pushState/replaceState меняют URL без перезагрузки. new URL(str) разбирает адрес на части, а URLSearchParams читает и правит строку запроса через get/set.

Источник — это тройка из схемы, хоста и порта; два URL имеют один источник, только когда совпадают все три. Политика одного источника не даёт странице читать ответы или DOM другого источника, блокируя кражу данных. CORS позволяет серверу разрешить доступ, отправив Access-Control-Allow-Origin, ослабляя ограничение на чтение для запросов. Кросс-доменный iframe всё равно отрисовывается, но родитель не может трогать его DOM, и они общаются только через postMessage.

Web Worker выполняет скрипт в отдельном фоновом потоке, поэтому тяжёлая работа не блокирует основной поток интерфейса. У него нет общей памяти со страницей: данные обменивают через postMessage, и каждая сторона читает их событием onmessage / message. Worker не имеет доступа к DOM, window или document, поэтому не может обновлять страницу напрямую — он шлёт результаты обратно, чтобы основной поток их отрисовал.

Модель безопасности изолирует источники (схема, хост, порт): политика одного источника блокирует кросс-доменное чтение DOM и ответов, чтобы недоверенный контент не крал данные. Shadow DOM добавляет вторую границу внутри одного источника — его дерево и стили инкапсулированы и отделены от документа. Маршрутизация SPA использует History API: pushState/replaceState меняют URL и добавляют записи без перезагрузки, а обработчик popstate перерисовывает виды при «назад»/«вперёд», так что навигация остаётся на клиенте.