Suede AI Skills Directory
web-artifacts-builder vs vercel-react-best-practices
A comparison selected for React and Next.js. Compare the task description and license first, then use the score breakdown to inspect their published files.
Quality snapshot: 2026-10-22. Install counts: skills.sh, 2026-11-08. This pair was selected from shared topics and recorded installs; it is not a claim about joint search volume.
At a glance
| Evidence | web-artifacts-builder (anthropics/skills) | vercel-react-best-practices (vercel-labs/agent-skills) |
|---|---|---|
| Listing | web-artifacts-builder | vercel-react-best-practices |
| Task | Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts. | React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements. |
| Quality score | 87/100 · B | 67/100 · D |
| License | Apache-2.0 | MIT |
| Cost lane | free-open-source | free-open-source |
| Recorded installs | 117,122 | 879,677 |
| Report | Score report | Score report |
Where the scores differ
| Component | web-artifacts-builder | vercel-react-best-practices |
|---|---|---|
| Structural checks | 56 / 56 | 48 / 56 |
| Description length | 5 / 5 | 5 / 5 |
| Boundary clause | 4 / 4 | 0 / 4 |
| Example request | 0 / 3 | 0 / 3 |
| Instruction depth | 4 / 7 | 7 / 7 |
| Reference files | 0 / 3 | 0 / 3 |
| Bundled scripts | 2 / 2 | 0 / 2 |
| Recent maintenance | 9 / 9 | 6 / 9 |
| Curated-list citations | 7 / 7 | 1 / 7 |
| Tool permissions declared | 0 / 2 | 0 / 2 |
| Compatibility declared | 0 / 2 | 0 / 2 |
web-artifacts-builder has the higher structural-quality score by 20 points. Use the task descriptions above to judge fit. These scores do not measure runtime performance or security.
Inspect before installing
web-artifacts-builder and vercel-react-best-practices link to their publishers, licenses and installation routes. Read the source before giving either skill access to your project.