Loading skill
Install any skill in seconds. Free to start, no credit card required.
Get Started Free →huangjia2019/React 最佳实践
React 组件设计模式、Hooks 使用指南、性能优化技巧
Passed 19 of 22 test cases with the skill, and 17 of 22 without it.
2 fixed17 passed either way3 still failing0 broke
Tokens, turns and time describe resource use, not a dollar price.
One of 2 test cases the skill fixed. Same model, same prompt, with and without the skill.
我正在重构项目里的一个大型 React 页面，需要一份关于组件文件结构规范和 Hook 命名建议的指导。请为我梳理出标准的目录组织形式，并列举自定义 Hook 的命名规范示例。
| Checked | Without skill | With skill |
|---|---|---|
| Specifies the component file structure containing index.ts, ComponentName.tsx, ComponentName.test.tsx, ComponentName.styles.ts, and types.ts under ComponentName/ | Missed | Passed |
| Explains custom hook naming with 'use' prefix examples such as useUser, useLocalStorage, or useDebounce while highlighting bad choices like fetchUser or useData | Missed | Passed |
The instructions your model reads when the skill loads.
本技能包含 React 开发的最佳实践，帮助你编写高质量的 React 代码。
当用户需要特定主题时，加载对应章节：
只在用户明确需要时加载完整内容，避免浪费上下文窗口。
// 好的命名
useUser()
useLocalStorage()
useDebounce()
// 不好的命名
fetchUser() // 不是 use 开头
useData() // 太模糊
ComponentName/
test cases passed, vs 17 / 22 without
More skills from the same source and nearby in the registry, with their headline benchmark lift.