Web Platform & APIs

fetch(url) returns a Promise that resolves to a Response object once headers arrive, not the body. The body is read with another promise-returning method like response.json() or response.text(). So you typically chain fetch(url).then(r => r.json()).then(data => ...), or use await. response.ok tells you if the status was 2xx.

localStorage and sessionStorage are synchronous string-only key/value stores (~5MB), scoped per origin. localStorage persists until cleared; sessionStorage lives only for the tab's session. IndexedDB is an asynchronous, transactional database for large structured data, including objects and blobs. A storage event fires on other same-origin tabs when localStorage changes, letting them sync.

XMLHttpRequest (XHR) is the classic API for making HTTP requests from JavaScript, the basis of AJAX. You open(method, url, async) then send(). By default async is true, so the call is non-blocking and you handle results in the onreadystatechange callback. readyState steps 0→4 through the request lifecycle; 4 means done, and you then check status.

window.postMessage lets scripts in different windows or iframes talk across origins, bypassing the same-origin policy safely. The sender calls target.postMessage(data, targetOrigin); the receiver listens for a message event. You must verify event.origin (and ideally event.source) in the handler, because any page can post to you — trusting unchecked messages opens an XSS hole. Avoid the * wildcard target.

A Web Worker runs a script on a separate background thread, so heavy work doesn't block the main UI thread. It has no access to the DOM, window, or the parent document, because those are not thread-safe and only the main thread owns them. The worker and page communicate by passing messages with postMessage, never by sharing the page's objects directly.

fetch is promise-based, so it composes with async/await instead of XHR's callbacks, and exposes a streaming response.body. Crucially, its promise only rejects on a network failure — an HTTP 404 or 500 still resolves, so you must check response.ok or response.status yourself. Cancellation isn't built in; you pass an AbortController's signal and call controller.abort().

A service worker is a background script that acts as a network proxy between the page and the network. It progresses through install (precache assets), activate (clean old caches), then fetch, where it intercepts requests and can answer from the Cache API for offline use. It has no DOM access and is event-driven, getting terminated when idle and restarted on demand, so state must live in IndexedDB or a cache, not globals.

They communicate by message passing: each side calls postMessage(data) and listens via onmessage. The data is copied by the structured clone algorithm, so the worker gets an independent copy — no shared references. For large buffers, copying is costly, so you pass Transferable objects (like an ArrayBuffer) as the second argument; ownership moves to the receiver with zero copy, and the sender's reference becomes unusable.

IndexedDB is an asynchronous, transactional, object-oriented client database for large amounts of structured data. All reads and writes go through transactions and complete via events or promises, never blocking the thread. It stores structured-clone values — objects, arrays, blobs — not just strings, and supports indexes for fast queries. Prefer it over web storage when you need big datasets, async access (e.g. from a worker), or queryable records.

Server-sent events let a server push updates to the browser over one long-lived HTTP connection. The client opens new EventSource(url) and handles onmessage/onopen/onerror; the channel is one-way, server→client, text only. The browser auto-reconnects on drop and can resume via Last-Event-ID. WebSocket, by contrast, is a separate full-duplex protocol carrying binary and text in both directions.

A PWA is a website that behaves like an installed app. The core pieces: a service worker that intercepts fetch and serves cached assets for offline use; the Cache API plus IndexedDB for the app shell and data; and a web app manifest (name, icons, display, start_url) that makes it installable to the home screen. An offline-first strategy caches the shell on install, then serves it instantly while updating in the background.

Short polling repeatedly fetches on a timer — simple but wasteful and laggy. Long-polling holds each request open until data is ready, then reconnects — fewer empty round-trips but still one connection per message. SSE keeps one HTTP stream open for server→client text push with auto-reconnect — ideal for feeds. WebSocket upgrades to a persistent full-duplex channel for low-latency two-way binary/text — best for chat and games, at higher complexity.