TypeScript definitions for React, the popular JavaScript library for building user interfaces
80
Pending
Does it follow best practices?
Impact
80%
1.48xAverage score across 10 eval scenarios
Pending
The risk profile of this skill
{
"context": "This criteria evaluates how well the engineer uses React's useMemo and useCallback hooks to optimize component performance in the DataGrid component. The focus is on proper memoization of expensive computations and callback functions to prevent unnecessary re-renders and re-computations.",
"type": "weighted_checklist",
"checklist": [
{
"name": "useMemo for filtering",
"description": "Uses the useMemo hook to memoize the filtered data array, with the data and searchTerm as dependencies, preventing unnecessary filtering operations when other props change",
"max_score": 25
},
{
"name": "useMemo for statistics",
"description": "Uses the useMemo hook to memoize computed statistics (such as average age), with only the data array as a dependency, ensuring statistics are recalculated only when data changes",
"max_score": 25
},
{
"name": "useCallback for handlers",
"description": "Uses the useCallback hook to memoize the delete handler or any event handlers passed to child components, with appropriate dependencies, ensuring referential stability across re-renders",
"max_score": 25
},
{
"name": "Correct dependencies",
"description": "All useMemo and useCallback hooks specify the correct dependency arrays that include all referenced variables from outer scope and exclude unnecessary dependencies",
"max_score": 15
},
{
"name": "Appropriate usage",
"description": "Uses memoization hooks only where beneficial (for expensive computations or preventing child re-renders) and avoids over-optimization of trivial operations",
"max_score": 10
}
]
}docs
evals
scenario-1
scenario-2
scenario-3
scenario-4
scenario-5
scenario-6
scenario-7
scenario-8
scenario-9
scenario-10