Веб-платформа и API

fetch(url) возвращает Promise, который разрешается объектом Response, как только пришли заголовки, а не тело. Тело читается ещё одним методом-промисом, например response.json() или response.text(). Поэтому обычно пишут цепочку fetch(url).then(r => r.json()).then(data => ...) или используют await. Свойство response.ok показывает, был ли статус 2xx.

localStorage и sessionStorage — синхронные хранилища ключ/значение только для строк (~5МБ), привязанные к origin. localStorage хранится до очистки; sessionStorage живёт лишь в рамках сессии вкладки. IndexedDB — асинхронная транзакционная база для больших структурированных данных, включая объекты и blob. Событие storage срабатывает в других вкладках того же origin при изменении localStorage, позволяя им синхронизироваться.

XMLHttpRequest (XHR) — классический API для HTTP-запросов из JavaScript, основа AJAX. Вы вызываете open(method, url, async), затем send(). По умолчанию async равен true, поэтому вызов неблокирующий и результат обрабатывается в колбэке onreadystatechange. readyState проходит 0→4 по жизненному циклу запроса; 4 означает готово, после чего проверяют status.

window.postMessage позволяет скриптам в разных окнах или iframe общаться между origin, безопасно обходя политику одного источника. Отправитель вызывает target.postMessage(data, targetOrigin); получатель слушает событие message. В обработчике надо проверять event.origin (а лучше и event.source), ведь написать вам может любая страница — доверие к непроверенным сообщениям открывает дыру XSS. Избегайте подстановки * в цели.

Web Worker выполняет скрипт в отдельном фоновом потоке, поэтому тяжёлая работа не блокирует главный поток UI. У него нет доступа к DOM, window или родительскому document, ведь они не потокобезопасны и принадлежат только главному потоку. Воркер и страница общаются обменом сообщениями через postMessage, а не прямым доступом к объектам страницы.

fetch основан на промисах, поэтому сочетается с async/await вместо колбэков XHR и даёт потоковое response.body. Важно, что его промис отклоняется только при сетевом сбое — HTTP 404 или 500 всё равно разрешаются, поэтому статус надо проверять самому через response.ok или response.status. Отмена не встроена; вы передаёте signal из AbortController и вызываете controller.abort().

Service worker — фоновый скрипт, работающий как сетевой прокси между страницей и сетью. Он проходит install (предзагрузка ресурсов), activate (очистка старых кэшей), затем fetch, где перехватывает запросы и может отвечать из Cache API для офлайна. У него нет доступа к DOM, он событийный, завершается при простое и перезапускается по требованию, поэтому состояние должно жить в IndexedDB или кэше, а не в глобальных переменных.

Они общаются передачей сообщений: каждая сторона вызывает postMessage(data) и слушает через onmessage. Данные копируются алгоритмом structured clone, поэтому воркер получает независимую копию — без общих ссылок. Для крупных буферов копирование дорого, поэтому передают Transferable-объекты (например ArrayBuffer) вторым аргументом; владение переходит к получателю без копирования, а ссылка отправителя становится непригодной.

IndexedDB — асинхронная транзакционная объектная клиентская база для больших объёмов структурированных данных. Все чтения и записи идут через транзакции и завершаются через события или промисы, не блокируя поток. Она хранит значения по structured-clone — объекты, массивы, blob, а не только строки, и поддерживает индексы для быстрых запросов. Предпочитайте её web storage для крупных датасетов, асинхронного доступа (например из воркера) или запрашиваемых записей.

Server-sent events позволяют серверу слать обновления в браузер по одному долгоживущему HTTP-соединению. Клиент открывает new EventSource(url) и обрабатывает onmessage/onopen/onerror; канал односторонний, сервер→клиент, только текст. Браузер автоматически переподключается при обрыве и может возобновиться через Last-Event-ID. WebSocket же — отдельный полнодуплексный протокол, несущий бинарные и текстовые данные в обе стороны.

PWA — это сайт, ведущий себя как установленное приложение. Ключевые части: service worker, перехватывающий fetch и отдающий кэш для офлайна; Cache API и IndexedDB для оболочки приложения и данных; web app manifest (имя, иконки, display, start_url), делающий приложение устанавливаемым на главный экран. Стратегия offline-first кэширует оболочку на install, затем мгновенно отдаёт её, обновляя в фоне.

Короткий polling периодически делает fetch по таймеру — просто, но расточительно и с задержкой. Long-polling держит каждый запрос открытым до появления данных, затем переподключается — меньше пустых запросов, но всё ещё одно соединение на сообщение. SSE держит один HTTP-поток для push сервер→клиент текстом с автопереподключением — идеален для лент. WebSocket переходит в постоянный полнодуплексный канал для двусторонних бинарных/текстовых данных с низкой задержкой — лучший для чата и игр, но сложнее.