Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx skills add phuonghx/aim-cli --skill nextjs-react-expertgit clone --depth 1 https://github.com/phuonghx/aim-cliWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/phuonghx/aim-cli/nextjs-react-expert)<a href="https://agentmods.dev/skills/phuonghx/aim-cli/nextjs-react-expert"><img src="https://agentmods.dev/badge/skills/phuonghx/aim-cli/nextjs-react-expert/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/phuonghx/aim-cli/nextjs-react-expert"><img src="https://agentmods.dev/badge/skills/phuonghx/aim-cli/nextjs-react-expert.svg" alt="Reviewed on agentmods" width="80" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00078 | $0.01341 |
| Opus 5.5 | $0.00031 | $0.00536 |
| Sonnet 5.5 | $0.00016 | $0.00268 |
| Haiku 4.5 | $0.00008 | $0.00134 |
Grade A, and why
nextjs-react-expert scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 1mo ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 126 lines — stays where its author put it; the contents beside it link to each section on GitHub.
React & Next.js Performance Playbook
The fastest wins almost always come from the same two places: stop fetching data one request at a time, and stop shipping JavaScript the user never runs. Work the list below in roughly that order — structural fixes first, micro-optimizations last.
How to use these notes
The detail lives in the numbered reference files, not here. Open only the file that matches the problem in front of you. Each file is self-contained and groups a set of concrete rules with before/after code.
Reference index
| File | Severity | Reach for it when |
|---|---|---|
1-async-eliminating-waterfalls.md |
Highest | Pages stall on chained awaits; requests run in series |
2-bundle-bundle-size-optimization.md |
Highest | First-load JS is heavy; interactivity arrives late |
3-server-server-side-performance.md |
High | SSR is slow, server actions need hardening, RSC payloads bloat |
4-client-client-side-data-fetching.md |
Medium-high | Duplicate client requests, SWR, storage, listener sharing |
5-rerender-re-render-optimization.md |
Medium | Components render too often; memoization questions |
6-rendering-rendering-performance.md |
Medium | Long lists, hydration flashes, image and SVG cost |
7-js-javascript-performance.md |
Lower | Tight-loop and algorithmic clean-ups in hot code |
8-advanced-advanced-patterns.md |
Situational | One-time init, callback refs, effect-event hooks |
9-cache-components.md |
Next.js 16+ | use cache, cacheLife, cacheTag, PPR |
Picking the right file fast
Symptom Start here
------------------------------ ----------------------------
Long time-to-interactive → Files 1 and 2
First-load bundle too big → File 2 (splitting, deep imports)
Server response is slow → File 3 (parallel RSC, streaming)
UI janks / renders too much → File 5 (render hygiene)
Scrolling / paint is rough → File 6 (virtualization, layout)
Redundant client requests → File 4 (SWR, dedupe)
On Next.js 16 caching → File 9 (Cache Components)
What ships with it
11 files beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.
- 1-async-eliminating-waterfalls.md 8.1 KB
- 2-bundle-bundle-size-optimization.md 5.9 KB
- 3-server-server-side-performance.md 10 KB
- 4-client-client-side-data-fetching.md 6.1 KB
- 5-rerender-re-render-optimization.md 12 KB
- 6-rendering-rendering-performance.md 8.2 KB
- 7-js-javascript-performance.md 13 KB
- 8-advanced-advanced-patterns.md 3.6 KB
- 9-cache-components.md 3.1 KB
- scripts/convert_rules.py 7.4 KB runs code
- scripts/react_performance_checker.py 11 KB runs code
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 1mo ago First seen · 126 lines · 78 tokens per session scan A 58629ec12dd0
nextjs-react-expert is a skill published in the GitHub repository phuonghx/aim-cli (1 stars, last pushed 3mo ago), licensed MIT. It adds 78 tokens to every session and 1,341 once invoked, about $0.0003 per session on Opus 5.5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.
Other skills, from other repositories
react-modern
Use this skill when writing, reviewing, or debugging React components and hooks — state, effects, data fetching, forms, Server and Client Components — in whatever React setup the project uses. Triggers: user mentions "React", "component", "hook", "useState", "useEffect", "re-render", "Server Component", "use client"…
react-native-expo
Build and upgrade React Native or Expo applications with navigation, native modules and verified platform integration. Use when implementing mobile screens, Expo Router flows or device capabilities; choose a supported SDK combination rather than forcing independent latest packages together.
web-dnd-dnd-kit
Drag and drop with @dnd-kit - draggable, droppable, sortable, collision detection, sensors, accessibility.
web-meta-framework-remix
File-based routing, loaders, actions, defer streaming, useFetcher, error boundaries, progressive enhancement.
web-3d-react-three-fiber
React Three Fiber (R3F) 3D rendering — Canvas, meshes, materials, lights, cameras, animations, events, physics, post-processing, performance.
web-data-fetching-graphql-apollo
Apollo Client GraphQL patterns — normalized cache and type policies, queries, mutations with optimistic updates, pagination, fragments, subscriptions, and Suspense hooks.