The Day the Internet Tripped: React 19, Cloudflare, and the Chaos in Between

Is it just me, or has “breaking production” become the new tech industry hobby?

Between AWS hiccups, GitHub Actions taking a nap, and Cloudflare going dark, it feels like we’re living in a simulation where someone keeps hitting the ‘Reset’ button on our infrastructure. The latest drama? A React 19 Server Components vulnerability that didn’t just rattle the React world — it actually managed to knock Cloudflare off its feet.

Let’s skip the surface-level drama and dive into the “Wait, how did that happen?” of it all.

The Secret Language of React: The Flight Protocol

At the heart of React 19 is something called the Flight Protocol. Think of it as a specialized stream that lets the server send UI components to your browser piece by piece. If a piece isn’t ready yet (like a pending Promise), React says, “Cool, I’ll wait,” and fills it in later.

But React has a specific way of “reading” this incoming data. It looks for strings starting with a dollar sign $. Here is a peek at the logic under the hood:

JavaScript

// React's internal parser basically does this:
if (value[0] === '$') {
  // Oh, this is a special instruction! Let's see what it is...
}

If React sees {"then":"$B"}, it triggers a specific branch in the code meant to handle binary data or "blobs."

The Vulnerability: Turning Logic into a Weapon

The issue lies in how React pulls data into its internal state. When the parser hits that B case, it executes logic similar to this:

JavaScript

switch (value[1]) {
  case 'B': {
    const id = parseInt(value.slice(2), 16);
    const prefix = response._prefix;
    const blobKey = prefix + id;

   // React looks up data based on a key the user can influence
    const backingEntry = (response._formData.get(blobKey) as any);

    return backingEntry;
  }
}

The “Gotcha!” moment? The payload allows an attacker to manipulate _formData.get. By sending a payload like _formData.get: "$1:then:constructor", the attacker effectively tricks React into mapping a Promise's constructor to their own code.

It essentially boils down to this:

$$Promise.prototype.then.constructor(“alert(‘Pwned!’)”)$$

If that function gets executed, it’s game over. You’ve just injected arbitrary JavaScript into the client.

The Cloudflare Domino Effect

You might be wondering: How does a React bug break a global CDN?

When vulnerabilities like this go viral, companies like Cloudflare jump into “mitigation mode.” To protect users, they often tweak internal limits — in this case, buffer sizes.

However, Cloudflare’s FL1 service (written in Lua) didn’t handle the change well. This buffer adjustment accidentally bypassed some validation rules. When the system tried to fetch its latest security rules, it got a nil (null) value instead of a file.

In the world of Lua, that’s a recipe for disaster. Look at the code that caused the crash:

Lua

if rule_result.action == "execute" then
  rule_result.execute.results =
    ruleset_results[
      tonumber(rule_result.execute.results_index)
    ]
end

Because execute didn't exist in this specific state, and there was no null check to catch it, the service simply folded.

The Silver Lining

The good news? Cloudflare took this as a sign to retire the old ways. They’ve moved from FL1 to FL2, rewriting the service in Rust — a language famous for being “memory safe” and much harder to crash with these kinds of logic errors.

It’s a wild reminder that in the modern web, a small string in a React payload can travel through the pipes and knock over a giant.

Stay safe out there, and for the love of everything, check your nulls.

Cheers Elliot.