Array Chunking and Batching Patterns

The plain-language idea

Chunking means cutting one array into a list of smaller arrays of a fixed size. [1,2,3,4,5] chunked by 2 becomes [[1,2],[3,4],[5]]. On its own that's a warm-up exercise — the real reason it shows up in production code is batching: you have 5,000 IDs to fetch, and the API rejects a request over 100 IDs, or your DB connection pool chokes if you fire 5,000 queries at once. Chunk the array, then process one chunk at a time (or a few at a time) instead of the whole thing in one shot.

See it in a real thing: chunking, then batching sequentially

function chunk(arr, size) {
  if (size < 1) throw new RangeError("size must be >= 1");
  const out = [];
  for (let i = 0; i < arr.length; i += size) {
    out.push(arr.slice(i, i + size));
  }
  return out;
}

chunk([1, 2, 3, 4, 5], 2); // [[1,2],[3,4],[5]]

The trick is the loop step: i += size, not i++. Each iteration jumps to the start of the next chunk, and .slice(i, i + size) grabs that window — slice on the last chunk just returns whatever's left, no bounds check needed.

Now use it to batch async work — say, updating 5,000 user records through an API that caps requests at 100 IDs:

async function batchUpdate(ids, updateFn, batchSize = 100) {
  const chunks = chunk(ids, batchSize);
  const results = [];
  for (const group of chunks) {
    // one batch finishes before the next starts — deliberate, not accidental
    const res = await updateFn(group);
    results.push(...res);
  }
  return results;
}

for...of with await inside runs the batches sequentially — batch 2 doesn't start until batch 1's promise settles. That's often exactly what you want when the constraint is a hard rate limit or an API that literally rejects concurrent writes to the same resource.

What people usually miss

Watch out

• Sequential-by-chunk isn't parallel-by-chunk. chunks.map(c => updateFn(c)) fires every chunk at once — that's not batching, that's just chunking uselessly before doing the exact thing chunking was meant to prevent. The for...of + await loop is what actually serializes the work.
• chunk(arr, 0) is an infinite loop waiting to happen. If size isn't guarded, i += 0 never advances and the function hangs. Validate the size argument.
• Order of chunks isn't order of results if you parallelize wrong. If you Promise.all chunk-internal calls but the API doesn't preserve request order in its response, don't assume results[i] maps back to ids[i] without checking — either request an id-tagged response or sort by index yourself.

The genealogy: this is throttling applied to data, not time

Debounce and throttle limit how often a function runs over time; chunking-and-batching limits how much data one call handles at once. Both exist for the same reason — protect a downstream system from being asked to do too much, too fast. If you've built a task queue with a concurrency cap, chunking is the same instinct applied to a plain array instead of a stream of async calls.