Defer Non-Critical Third-Party Libraries. Use when you need help with bundle defer third party.
Scanned 9/8/2026
Install to Claude Code
Skills Directorynpx -y skills add anubhavg-icpl/vibe --skill bundle-defer-third-party --agent claude-codeInstalls into .claude/skills of the current project.
Are you the author of Bundle Defer Third Party?
Add the live security badge to your README — it updates automatically with every re-scan.
[](https://www.skillsdirectory.com/skills/anubhavg-icpl-bundle-defer-third-party)More formats (shields.io, HTML) on the badges page.
---
name: bundle-defer-third-party
description: Defer Non-Critical Third-Party Libraries. Use when you need help with bundle defer third party.
license: CC-BY-NC-SA-4.0
metadata:
risk: unknown
source: community
kind: mode
category: rules
---
## Defer Non-Critical Third-Party Libraries
Analytics, logging, and error tracking don't block user interaction. Load them after hydration.
**Incorrect (blocks initial bundle):**
```tsx
import { Analytics } from "@vercel/analytics/react";
export default function RootLayout({ children }) {
return (
<html>
<body>
{children}
<Analytics />
</body>
</html>
);
}
```
**Correct (loads after hydration):**
```tsx
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>
);
}
```
Is this your skill, or is something wrong with this listing? Request removal or report an issue. Author removals are honored within 72 hours.
No comments yet. Be the first to comment!
