The modern web platform provides a rich ecosystem of Browser APIs that enable sophisticated interactions without external dependencies—from real-time communication to hardware access to background processing. These JavaScript interfaces expose device capabilities, system features, and browser functionality directly to web applications. Understanding when to reach for fetch() over XMLHttpRequest, or why IntersectionObserver outperforms scroll listeners, separates performant, maintainable code from legacy patterns. Most APIs follow consistent patterns: async promises for operations, event-driven callbacks for state changes, and permission-based access for sensitive features—but each has specific quirks, browser compatibility considerations, and performance characteristics that matter in production.
What This Cheat Sheet Covers
This topic spans 15 focused tables and 68 indexed concepts. Below is a complete table-by-table outline of this topic, spanning foundational concepts through advanced details.
Table 1: Network and Data Fetching APIs
Network APIs handle HTTP requests, real-time communication, and data transfer. The Fetch API has replaced XMLHttpRequest as the standard for making HTTP requests, offering a cleaner promise-based interface, while WebSocket enables bidirectional real-time communication.
| API | Example | Description |
|---|---|---|
fetch('/api/data') .then(r => r.json()) .then(data => console.log(data)) | • Promise-based HTTP requests • returns Response object with methods like .json(), .text(), .blob()• supports streaming responses | |
const ctrl = new AbortController()fetch(url, {signal: ctrl.signal})ctrl.abort() | • Cancels fetch requests, event listeners, or any async operation that accepts an AbortSignal• prevents memory leaks when components unmount | |
const ws = new WebSocket('wss://api.example.com')ws.onmessage = e => console.log(e.data)ws.send('Hello') | • Persistent bidirectional connection over TCP • ideal for chat, live updates, multiplayer games • handles binary ( ArrayBuffer, Blob) and text data |