Files
famapp/.agents/skills/react-best-practices/rules/bundle-defer-third-party.md
T
ginnoir 3d825fba20
CI / checks (push) Successful in 1m51s
CI / build (push) Successful in 3m34s
chore: vendor react-best-practices agent skill for cursor agents
Adds the Vercel skill under .agents with famapp path patterns.

Includes skills-lock.json pin.
2026-07-03 03:33:57 -05:00

924 B

title, impact, impactDescription, tags
title impact impactDescription tags
Defer Non-Critical Third-Party Libraries MEDIUM loads after hydration bundle, third-party, analytics, defer

Defer Non-Critical Third-Party Libraries

Analytics, logging, and error tracking don't block user interaction. Load them after hydration.

Incorrect (blocks initial bundle):

import { Analytics } from "@vercel/analytics/react";

export default function RootLayout({ children }) {
  return (
    <html>
      <body>
        {children}
        <Analytics />
      </body>
    </html>
  );
}

Correct (loads after hydration):

import dynamic from "next/dynamic";

const Analytics = dynamic(() => import("@vercel/analytics/react").then((m) => m.Analytics), {
  ssr: false,
});

export default function RootLayout({ children }) {
  return (
    <html>
      <body>
        {children}
        <Analytics />
      </body>
    </html>
  );
}