agentsclimarketplace
Sign in

Vercel react best practices

Skill kimtth/agent-skill-100-lines-or-less/skills/vercel-react-best-practices

Use when: write or review React/Next.js code for performance — waterfalls, re-renders, bundle size.From its SKILL.md

Install
npx -y skills add kimtth/agent-skill-100-lines-or-less --skill vercel-react-best-practices

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

2 things to look at

  • no licenseNo license file was found in the repository. Code published without one is not open source by default, so using it at work is a question for whoever answers licensing questions where you are.
  • 2 stars2 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.

SKILL.md

1.2 KB, 227 tokens by cl100k_base, as published. Nobody here has run it

Goal: production-quality React, not just code that renders.

Use for:

  • slow pages, janky interactions, or large bundles
  • reviewing components for performance regressions
  • deciding when memoization actually helps

Workflow:

  1. Find data-fetching waterfalls; parallelize independent requests.
  2. Move work to the server; keep client components minimal.
  3. Measure before memoizing; add useMemo/useCallback/memo only with cause.
  4. Audit bundle: drop barrel imports and heavy client-only libraries.
  5. Stabilize props and keys to avoid needless re-renders.
  6. Verify with a profiler and bundle analysis, not intuition.

High-impact rules:

  • fetch in parallel, not in nested awaits
  • prefer server components; mark client boundaries narrowly
  • lazy-load heavy, below-the-fold, or rarely-used code
  • lift state only as high as it needs to go

Rules:

  • measure before and after every optimization
  • do not memoize cheap renders; it adds cost and noise
  • keep client/server boundaries explicit and small
  • correctness first; optimize the real bottleneck only

What ships with it

Read from the repository

Just SKILL.md. No reference files, no scripts.

Keep looking

Skills are one crate of 326,852. Ordering is by how many stacks a row turns up in, so the top of any crate is what has actually been picked rather than what has the most stars.