TS · performance

←Previous Next→

no-router-refresh-polling

Do not poll by calling a Next.js router's refresh method from a timer.

routerRefreshPolling Rule source Tests Catalog JSON

Why

A route refresh refetches and rerenders the whole route on every tick instead of loading the named resource that changed.

Fix

Call the dedicated fetch or server action from the timer and keep the polling interval in a named constant.

Examples

Before — flagged Do not poll the whole route

src/status.tsx

"use client";
import { useEffect } from "react";
import { useRouter } from "next/navigation";
function Status() {
  const router = useRouter();
  useEffect(() => {
    const timer = setInterval(() => router.refresh(), POLLING_INTERVAL_MS);
    return () => clearInterval(timer);
  }, [router]);
  return null;
}

After — preferred Poll a named resource

src/status.tsx

"use client";
import { useEffect } from "react";
function Status() {
  useEffect(() => {
    const timer = setInterval(() => fetchStatus(), POLLING_INTERVAL_MS);
    return () => clearInterval(timer);
  }, []);
  return null;
}