How I Solved Slow Page Loading Using the N+1 Query Fix (React + Laravel)

When I first built my React + Laravel application, everything worked fine—until the data started growing. Pages that used to load instantly began taking seconds. Then even longer. At first, I thought it was a frontend issue. Maybe React was re-rendering too much. Maybe my components weren’t optimized. I was wrong. The real problem was happening in the backend—and it had a name: the N+1 query problem . The Problem I Didn’t See at First Let’s say I had something like this in my Laravel backend: A list of students Each student has marks Each mark belongs to a subject Simple, right? But here’s what actually happened when I fetched data: 1 query to get students Then N queries to get each student's related data So if I had 100 students, I was running: 👉 101 queries That’s the N+1 problem. And it destroyed performance. How I Discovered It I started debugging the backend and noticed something strange: The API response time was slow Database queries were increasing with data size So I used Lara