A proof of concept set of Claude Skills designed to improve the pass rates against the Next.js evals on https://nextjs.org/evals
npx skills add https://github.com/wsimmonds/claude-nextjs-skills --skill nextjs-server-navigationInstall this skill with the CLI and start using the SKILL.md workflow in your workspace.
Claude Next.js Skills is a POC bundle of automations aimed at seeing if creating skills quickly could improve the Next.js eval scores published by Vercel at https://nextjs.org/evals.
Baseline (before skills)
| Model | Success Rate |
|---|---|
| Claude Haiku 4.5 | 32% |
| Claude Sonnet 4.5 | 32% |
Skilled Runs (after skills)
| Model | Success Rate | Expected Leaderboard Slot |
|---|---|---|
| Claude Haiku 4.5 "Skilled" | 78% (39/50) | 1 |
| Claude Sonnet 4.5 "Skilled" | 76% (38/50) | 2 |
š Results:
āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā
| Eval | Claude Code |
|---|---|
| 000-app-router-migration-simple | ā ā ā (204.8s) |
| 001-server-component | ā ā ā (94.4s) |
| 002-client-component | ā ā ā (94.7s) |
| 003-cookies | ā ā ā (136.7s) |
| 004-search-params | ā ā ā (219.1s) |
| 005-react-use-api | ā ā ā (138.0s) |
| 006-server-metadata | ā ā ā (91.4s) |
| 007-client-metadata | ā ā ā (86.0s) |
| 008-generate-static-params | āā ā (83.0s) |
| 009-og-images | ā ā ā (108.0s) |
| 010-route-handlers | ā ā ā (69.1s) |
| 011-client-server-form | ā ā ā (167.9s) |
| 012-parallel-routes | ā ā ā (157.7s) |
| 013-pathname-server | āāā (70.8s) |
| 014-server-routing | ā ā ā (94.0s) |
| 015-server-actions-exports | ā ā ā (69.6s) |
| 016-client-cookies | āā ā (65.9s) |
| 017-use-search-params | ā ā ā (59.7s) |
| 018-use-router | ā ā ā (72.6s) |
| 019-use-action-state | ā ā ā (120.3s) |
| 020-no-use-effect | ā ā ā (92.0s) |
| 021-avoid-fetch-in-effect | ā ā ā (238.6s) |
| 022-prefer-server-actions | ā ā ā (312.2s) |
| 023-avoid-getserversideprops | ā ā ā (166.2s) |
| 024-avoid-redundant-usestate | ā ā ā (111.5s) |
| 025-prefer-next-link | ā ā ā (120.9s) |
| 026-no-serial-await | āā ā (153.3s) |
| 027-prefer-next-image | ā ā ā (98.7s) |
| 028-prefer-next-font | ā ā ā (90.5s) |
| 029-use-cache-directive | ā ā ā (212.0s) |
| 030-app-router-migration-hard | ā ā ā (453.7s) |
| 031-ai-sdk-migration-simple | ā ā ā (178.7s) |
| 032-ai-sdk-model-specification-string | ā ā ā (194.9s) |
| 033-ai-sdk-v4-model-specification-function | ā ā ā (166.7s) |
| 034-ai-sdk-render-visual-info | āāā (659.4s) |
| 035-ai-sdk-call-tools | ā ā ā (338.5s) |
| 036-ai-sdk-call-tools-multiple-steps | ā ā ā (307.9s) |
| 037-ai-sdk-embed-text | ā ā ā (155.0s) |
| 038-ai-sdk-mcp | ā ā ā (260.5s) |
| 039-parallel-routes | ā ā ā (217.6s) |
| 040-intercepting-routes | ā ā ā (208.4s) |
| 041-route-groups | ā ā ā (139.1s) |
| 042-loading-ui | ā ā ā (123.9s) |
| 043-error-boundaries | ā ā ā (138.4s) |
| 044-metadata-api | ā ā ā (115.6s) |
| 045-server-actions-form | ā ā ā (88.8s) |
| 046-streaming | ā ā ā (129.9s) |
| 047-middleware | ā ā ā (78.2s) |
| 048-draft-mode | ā ā ā (207.6s) |
| 049-revalidation | ā ā ā (124.2s) |
| -------------------------------------------- | -------------------------- |
| Overall (B/L/T) | 45/48/40 (90%, 96%, 80%) |
š Results:
āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā
| Eval | Claude Code |
|---|---|
| 000-app-router-migration-simple | ā ā ā (164.1s) |
| 001-server-component | ā ā ā (88.8s) |
| 002-client-component | ā ā ā (109.4s) |
| 003-cookies | ā ā ā (138.6s) |
| 004-search-params | ā ā ā (223.4s) |
| 005-react-use-api | ā ā ā (132.7s) |
| 006-server-metadata | ā ā ā (90.8s) |
| 007-client-metadata | ā ā ā (81.1s) |
| 008-generate-static-params | āā ā (78.0s) |
| 009-og-images | ā ā ā (105.3s) |
| 010-route-handlers | ā ā ā (75.1s) |
| 011-client-server-form | ā ā ā (179.3s) |
| 012-parallel-routes | ā ā ā (153.3s) |
| 013-pathname-server | āāā (78.2s) |
| 014-server-routing | āā ā (103.1s) |
| 015-server-actions-exports | ā ā ā (76.0s) |
| 016-client-cookies | āā ā (71.5s) |
| 017-use-search-params | ā ā ā (64.1s) |
| 018-use-router | ā ā ā (77.2s) |
| 019-use-action-state | ā ā ā (123.8s) |
| 020-no-use-effect | ā ā ā (94.5s) |
| 021-avoid-fetch-in-effect | ā ā ā (269.8s) |
| 022-prefer-server-actions | ā ā ā (242.4s) |
| 023-avoid-getserversideprops | ā ā ā (207.7s) |
| 024-avoid-redundant-usestate | ā ā ā (126.4s) |
| 025-prefer-next-link | ā ā ā (96.4s) |
| 026-no-serial-await | ā ā ā (220.4s) |
| 027-prefer-next-image | ā ā ā (103.4s) |
| 028-prefer-next-font | ā ā ā (81.4s) |
| 029-use-cache-directive | ā ā ā (208.8s) |
| 030-app-router-migration-hard | ā ā ā (397.9s) |
| 031-ai-sdk-migration-simple | ā ā ā (233.2s) |
| 032-ai-sdk-model-specification-string | ā ā ā (150.4s) |
| 033-ai-sdk-v4-model-specification-function | ā ā ā (118.6s) |
| 034-ai-sdk-render-visual-info | ā ā ā (567.8s) |
| 035-ai-sdk-call-tools | ā ā ā (209.6s) |
| 036-ai-sdk-call-tools-multiple-steps | ā ā ā (247.7s) |
| 037-ai-sdk-embed-text | ā ā ā (181.0s) |
| 038-ai-sdk-mcp | āāā |
| 039-parallel-routes | ā ā ā (162.7s) |
| 040-intercepting-routes | ā ā ā (201.2s) |
| 041-route-groups | ā ā ā (147.7s) |
| 042-loading-ui | ā ā ā (141.3s) |
| 043-error-boundaries | ā ā ā (228.7s) |
| 044-metadata-api | ā ā ā (110.0s) |
| 045-server-actions-form | ā ā ā (101.0s) |
| 046-streaming | ā ā ā (126.4s) |
| 047-middleware | ā ā ā (91.2s) |
| 048-draft-mode | ā ā ā (210.0s) |
| 049-revalidation | āā ā (195.9s) |
| -------------------------------------------- | -------------------------- |
| Overall (B/L/T) | 44/48/39 (88%, 96%, 78%) |
Does this translate into improved real world code or is Claude now just optimised to better pass evals? This would be a great area to explore.
Please try and let me know.