Maximum call stack size exceeded

A function kept calling itself, directly or through other functions, until JavaScript ran out of room to keep track of the calls.

Browser console or terminal
RangeError: Maximum call stack size exceeded

Also appears as

  • InternalError: too much recursion
  • RangeError: Maximum call stack size exceeded.

Prompt to fix it

My app throws "RangeError: Maximum call stack size exceeded". Read the stack trace, find the functions that repeat, and explain the loop to me. Fix the actual cause: add or correct the stop condition in recursive functions, rename wrappers that shadow the function they call (for example a custom fetch), fix getters or setters that read or write their own property, guard tree walks against cycles, and replace spreads of very large arrays with loops. Don’t wrap it in try/catch or raise the stack size.

Paste into Layerwise or any AI coding tool.

What it means

Each time a function calls another, JavaScript adds an entry to the call stack so it knows where to come back to. The stack has a fixed size. When calls pile up without ever returning, usually because a function ends up calling itself forever, the stack fills and JavaScript throws this error. Firefox calls it “too much recursion.”

The loop is often indirect: a wrapper named after the function it wraps, a setter that assigns to its own property, or two functions that call each other. Expand the error in the console. The same few function names repeat down the stack trace, and those names are the loop.

It isn’t always a logic bug. Spreading a very large array into a function call, as in Math.max(...values) with hundreds of thousands of items, overflows the stack too. Use a loop or reduce for large data.

Common causes

  • A recursive function has no stop condition, or the condition never becomes true.
  • A function has the same name as the one it means to call, such as a custom fetch that calls fetch, so it calls itself.
  • A getter or setter reads or writes its own property, as in set name(value) { this.name = value; }.
  • A recursive component or tree walk follows data that loops back on itself, such as a comment listed as its own reply.
  • A very large array is spread into a function call, such as Math.max(...values).

How to fix it

  1. Expand the error in the console and find the function names that repeat in the stack trace.
  2. Check that every recursive function has a stop condition that every path reaches.
  3. Rename wrappers so they don’t shadow what they call, and store getter and setter values in a separate field such as #name.
  4. For tree data, keep a set of visited IDs so a cycle ends the walk.
  5. Replace spreads of very large arrays with a loop or reduce.

Example fix

// A function named fetch would call itself here. A distinct name reaches the real fetch.
export async function apiFetch(path: string) {
  return fetch(`https://api.example.com${path}`);
}

type Reply = { id: string; replies: Reply[] };

// The visited set stops the walk if the data loops back on itself.
export function countReplies(node: Reply, seen = new Set<string>()): number {
  if (seen.has(node.id)) return 0;
  seen.add(node.id);
  return node.replies.reduce(
    (total, reply) => total + 1 + countReplies(reply, seen),
    0
  );
}

Related errors

All errors
Too many re-renders. React limits the number of renders to prevent an infinite loop.

Too many re-renders

A component changes its own state while it renders, so React renders it again and again until it stops the loop.

Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops.

Maximum update depth exceeded

State updates kept triggering more state updates in a loop, usually through an effect or a callback, so React stopped them.

FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory

JavaScript heap out of memory

Node used up all the memory it’s allowed and crashed, usually during a large build or in code that keeps holding on to more and more data.

TypeError: Cannot read properties of undefined (reading 'map')

Cannot read properties of undefined

The code asked for a property of a value that doesn’t exist yet, usually data that hasn’t loaded or a field the API didn’t return.

Build with an agent that checks its work

The Layerwise agent clicks through the live preview and reads the console, so it catches errors before you do.

DownloadRead the docs