CODING2 Multi-file Components

Next.js 16 Production Performance & Bundle Auditor

Detailed diagnostic instructions, script snippets, and architectural rules to keep Next.js App Router applications blazing fast, maintaining 99+ Lighthouse scores and instant interaction responsiveness.

Author: TRIHEX Performance Lab

•

License: MIT

•

Version: 2.0.1

Inert Code Verified · Heuristic Static Security ScannerHeuristic Scanner: LOW Risk

Heuristic static security scanner audited 2 files (2360 bytes). External code. Review before execution.

v2.0.1

Skill Files (2)

Compatible Runtimes

AntigravityClaude CodeCursor

SKILL.md·markdown

# Next.js Performance & Bundle Auditor

## Audit Checklist
1. **Server Waterfall Detection**: Are sequential `await` calls delaying SSR response? Use `Promise.all()` or stream data with React Suspense.
2. **Client Component Boundary**: Push `'use client'` down to the smallest possible leaf components. Never put `'use client'` on high-level layout containers.
3. **Font & Image Optimization**: Use `next/font` with `display: swap` and `next/image` with `priority` for the largest above-the-fold image.
4. **Third-Party Script Offloading**: Use `next/script` with strategy `lazyOnload` or `worker` for analytics and non-critical trackers.