When a useEffect Hook Took Down Cloudflare’s Dashboard: A Deep Dive into the September 12 Outage

What happens when a tiny bug in your frontend logic crashes your entire dashboard? On a recent day in 2025, Cloudflare experienced a significant outage in its Dashboard and API services — all due to a subtle bug in a React useEffect hook.

The incident served as a stark reminder that even the most minor issues in frontend code can unleash a chain reaction of failures across critical backend infrastructure. In this deep dive, we explore what went wrong, why it happened, and what engineers everywhere can learn from it.

What Happened?

Cloudflare’s control plane — which includes its Dashboard and public-facing APIs — began experiencing widespread issues. These problems were eventually traced back to a change in the frontend code.

A React useEffect hook was implemented incorrectly. Specifically, the developers passed a new object as a dependency to the hook. While this might appear harmless, it resulted in unintended behavior.

Because the object was being freshly created on each render, React interpreted it as a different value every time. This caused the useEffect to re-run continuously, making excessive and repeated API calls from the Dashboard to the backend.

As a result, Cloudflare's internal /organizations endpoint was overwhelmed. The repeated requests from thousands of clients quickly escalated into a full-blown service degradation.

Why It Matters

Although Cloudflare's edge network — known as the data plane — continued routing traffic effectively, the control plane outage was highly disruptive. Users were unable to access configuration tools, manage DNS records, or utilize key API features.

This incident illustrates a deeper truth: the boundaries between frontend and backend systems are increasingly porous. An error in one part of the system can ripple out and destabilize everything else.

By understanding this incident, readers will gain valuable insight into the technical interplay between frontend behavior, backend resilience, and overall system stability.

Prerequisites

To fully appreciate the technical depth of this incident, it's useful to have some foundational knowledge. You should be comfortable with:

• React fundamentals, especially the useEffect lifecycle hook

• Microservices architecture, including service dependencies and scaling behavior

• HTTP retry mechanisms and rate-limiting strategies

• CI/CD pipelines and deployment practices

The Core Problem: useEffect and Mutable Dependencies

What is useEffect?

In the React framework, useEffect allows developers to execute side effects after a component has rendered. Common uses include fetching data, subscribing to services, and manually interacting with the DOM.

Here's a typical usage:

useEffect(() => {
  fetchUser();
}, [props.user]);

The hook re-executes its logic only when one or more of the dependencies change. This is critical for optimizing performance and avoiding unnecessary operations.

The Developer Mistake

In Cloudflare’s case, the dependency array contained an inline object:

useEffect(() => {
  fetch('/organizations');
}, [{ filter: true }]);

Although { filter: true } may look static, it's a new object every render. Since objects are reference types in JavaScript, React treats them as changed, even if their contents are identical.

This meant that on every render cycle, useEffect re-ran its effect. Each execution triggered an API call, and since these occurred without delay or limits, the volume of requests spiraled out of control.

The Outcome: An API Call Storm

The flawed hook logic created a feedback loop. Thousands of users running the same Dashboard code flooded Cloudflare’s backend with duplicate requests.

The /organizations endpoint, supported by the Tenant Service, was not built to handle such sudden surges. It quickly became saturated, leading to degraded performance and eventual service outages for anything relying on that data.