Rishu Kumar

Posted on May 3

I Built an AI PR Reviewer That Actually Understands Next.js - Meet MergeWell

#nextjs #ai #github #webdev

Your generic linter doesn't know the difference between a Server Component and a Client Component. MergeWell does.

We've all been there.

You open a pull request at 4 PM on a Friday. Your teammate glances at the diff, sees it's a Next.js change, and approves it — because honestly, who has the bandwidth to reason through every App Router edge case under deadline pressure?

So you merge. And Saturday morning you're debugging why your Server Component is leaking session data to the client, or why your page is hydrating twice, or why use client is now at the top of a file that's pulling in a 200kb library that should never have touched the browser bundle.

Next.js is powerful. It's also genuinely complex — and most code review tools treat it like it's just React with a router bolted on. It isn't.

That's why I built MergeWell — a PR reviewer built specifically for Next.js codebases.

The Next.js Code Review Problem Is Real

Generic code review tools miss Next.js-specific mistakes entirely. They don't know that:

Adding "use client" to a component that fetches data server-side is an architectural mistake, not just a style preference
Calling cookies() or headers() inside a component that's rendered statically will silently break at runtime
Importing a heavy client-side library into the wrong boundary will bloat your bundle without a single warning in your diff
Using useEffect to fetch data in a component that could just be async is a step backwards in the App Router world
Forgetting export const dynamic = 'force-dynamic' when you need it means your page caches stale data in production

These aren't abstract concerns. They're the kinds of bugs that survive review, pass CI, reach production, and cost real time to debug. Because they're not syntax errors — they're conceptual errors that require understanding how Next.js actually works.

What Is MergeWell?

MergeWell is an AI-powered pull request reviewer built from the ground up for Next.js projects.

It reviews your diffs the way a senior Next.js engineer would — one who knows the App Router deeply, has opinions about the Pages Router, and understands the mental model shift that comes with React Server Components.

Think of it as having a Next.js specialist on your team who reviews every single PR, 24/7, without ever getting tired or distracted.

What MergeWell Catches

🧩 Server vs. Client Component Mistakes

MergeWell understands the RSC boundary. It flags when you're:

Adding "use client" unnecessarily, forcing client-side rendering where server rendering would be faster
Using browser APIs or hooks in files that run on the server
Passing non-serializable props (like functions or class instances) across the server-client boundary
Accidentally including server-only code (like database queries) in Client Components

📦 Bundle Size & Import Mistakes

Next.js's power is its ability to keep your client bundle lean. MergeWell spots when a PR is about to undo that:

Heavy libraries being imported into Client Components that should live server-side
Missing next/dynamic lazy loading for large components
Barrel imports that prevent tree-shaking

🗃️ Data Fetching Anti-Patterns

The App Router changed how we think about data fetching. MergeWell knows both worlds:

useEffect data fetching in components that should be async Server Components
Missing revalidate or incorrect caching strategies in fetch() calls
Waterfall fetches that could be parallelized with Promise.all
Redundant getServerSideProps patterns that belong in the Pages Router era

⚡ Rendering & Caching Issues

This is where Next.js gets subtle — and where most reviewers check out:

Pages that need force-dynamic but are missing it, leading to stale static renders
Incorrect use of unstable_cache or revalidatePath
Components that break static generation by opting into dynamic behavior unintentionally
Route handlers missing proper cache headers

🔒 Security Concerns Specific to Next.js

Server Actions that lack proper input validation or authorization checks
API routes missing rate limiting or CORS configuration
Environment variables being exposed to the client that should stay server-side (anything without the NEXT_PUBLIC_ prefix that's referenced in Client Components)
Middleware that could be bypassed

🏗️ App Router Architecture

MergeWell reviews structural decisions, not just line-level bugs:

Route grouping that could simplify the layout hierarchy
Layouts that re-render unnecessarily
Loading and error boundary placement
Parallel and intercepting routes used incorrectly

A Real Example

Here's the kind of thing MergeWell catches that generic reviewers miss entirely.

Imagine this gets added to your codebase in a PR:

// app/dashboard/page.tsx
"use client";

import { getUser } from "@/lib/db";

export default function DashboardPage() {
  const [user, setUser] = useState(null);

  useEffect(() => {
    getUser().then(setUser);
  }, []);

  return <div>Welcome, {user?.name}</div>;
}

A typical reviewer might see "looks fine, it fetches a user and displays it." MergeWell sees:

"use client" is unnecessary — this component has no interactivity
getUser() is a database call running client-side, which means it's either hitting an API route unnecessarily or, worse, running DB code in the browser bundle
The useEffect pattern introduces a loading flash and a waterfall
The fix is to make this an async Server Component — two lines of change, dramatic performance improvement

That's the difference between a generic review and a Next.js-aware one.

Who Is MergeWell For?

Solo Next.js developers — You're the only reviewer on your own PRs. MergeWell is the senior Next.js engineer you can't afford to hire yet.

Small teams shipping fast — Velocity is everything at an early stage. MergeWell keeps quality high without slowing you down.

Teams migrating from Pages Router to App Router — This is where mistakes happen most. MergeWell understands both paradigms and catches the conceptual mix-ups that happen mid-migration.

Open-source Next.js project maintainers — Give contributors expert-level feedback without spending hours on every PR.

Agencies building client projects — Consistent Next.js quality standards across every project, every client, every developer on your team.

Built for the Way Next.js Actually Works

MergeWell was built with one belief: a good code review tool has to deeply understand its domain.

Generic AI review tools that work on "any codebase" are useful for catching obvious bugs. But Next.js has a specific mental model — server vs. client, static vs. dynamic, caching layers, React Server Components — that requires genuine framework expertise to review well.

MergeWell isn't a linter with an AI layer. It's a reviewer that thinks in Next.js.

Try MergeWell on Your Next PR

MergeWell is live and ready for your Next.js project.

👉 mergewell.codewavelabs.org

If you're building with Next.js — whether it's a SaaS, an e-commerce site, an internal tool, or a side project — MergeWell will catch the things that slip through every other review.

Better Next.js code starts here. Let's merge well.

Built something with Next.js and ran into a review nightmare? Drop a comment — I'd love to hear about it. And if you try MergeWell, feedback is always welcome.

Tags: nextjs code-review react developer-tools ai webdev javascript typescript

DEV Community