Itdaily - Cloudflare Takes down its Own Dashboard Due to Programming Error in React

Cloudflare Takes down its Own Dashboard Due to Programming Error in React

Cloudflare

Due to a programming error, Cloudflare’s dashboard was offline for more than an hour.

Cloudflare has confirmed in a blog post that its dashboard was affected by a programming error. The incident lasted more than an hour and impacted both the dashboard and multiple APIs. According to VP Engineering Tom Lianza, the outage was caused by a React useEffect hook that constantly called the Tenant Service API, which became overloaded and crashed.

Error in the Code

Due to an error in the code snippet, the useEffect hook of the JavaScript library React, an object was repeatedly recreated in the dependency array. This caused React to think something had changed each time, and the API was called repeatedly. This should have happened only once, but the hundreds of extra requests overloaded the API, making it inaccessible.

React Hook Remains a Source of Errors

The useEffect hook is a powerful function in React, but often causes errors and performance issues when used incorrectly. React documentation explicitly warns to use the hook only when absolutely necessary and to keep dependencies stable.

Cloudflare has increased the capacity of the Tenant Service and added improved monitoring. API calls from the dashboard will now also include additional information to more quickly distinguish new requests from repetitions. This is how Cloudflare aims to prevent similar problems in the future.