Code Explainers

Code explainers tagged #fetch

javascript 
function createAutocomplete(input, resultsList, { minChars = 2, delay = 300 } = {}) {
  let timer = null;
  let controller = null;
 

Building a debounced autocomplete widget

debouncing abortcontroller closures
Intermediate 9 steps
javascript 
const DEFAULT_OPTIONS = {
  method: 'GET',
  timeout: 5000,
  retries: 3,

A resilient fetch wrapper with retries and timeout

fetch retry timeout
Intermediate 8 steps
javascript 
export function createSearchClient(baseUrl) {
  let inFlight = null;
 
  async function search(query, { signal } = {}) {

Cancelling stale requests in a search client

closures abortcontroller async
Intermediate 8 steps
typescript 
interface Page<T> {
  items: T[];
  nextCursor: string | null;
}

Streaming cursor pagination with async generators

async-generators pagination generics
Intermediate 8 steps
javascript 
async function fetchAllPages(baseUrl, { pageSize = 100, headers = {} } = {}) {
  const results = [];
  let cursor = null;
 

Cursor-based pagination with fetch

pagination async-await fetch
Intermediate 6 steps
typescript 
type SearchResult = {
  id: string;
  title: string;
};

Cancelling stale searches with AbortController

abortcontroller cancellation async
Intermediate 7 steps