Frontend development patterns for React, Next.js, state management, performance optimization, and UI best practices.
Install with Tessl CLI
npx tessl i github:sickn33/antigravity-awesome-skills --skill cc-skill-frontend-patterns62
Does it follow best practices?
If you maintain this skill, you can automatically optimize it using the tessl CLI to improve its score:
npx tessl skill review --optimize ./path/to/skillEvaluation — 96%
↑ 1.31xAgent success when using this skill
Validation for skill structure
List virtualization and memoization
@tanstack/react-virtual import
100%
100%
estimateSize value
0%
0%
overscan value
0%
100%
Absolute positioning strategy
100%
100%
Total size container
100%
100%
getScrollElement ref
100%
100%
React.memo on item component
0%
100%
useMemo for derived data
100%
100%
useCallback for handler props
0%
100%
virtualRow.index used as key
50%
50%
Fixed container height
100%
100%
Without context: $0.2448 · 1m 3s · 11 turns · 12 in / 3,624 out tokens
With context: $0.5662 · 1m 50s · 23 turns · 70 in / 6,347 out tokens
Keyboard navigation and ARIA accessibility
ArrowDown handler
100%
100%
ArrowUp handler
100%
100%
Enter key handler
100%
100%
Escape key handler
100%
100%
role=combobox
100%
100%
aria-expanded attribute
100%
100%
aria-haspopup=listbox
100%
100%
Modal role=dialog
100%
100%
Modal aria-modal
100%
100%
Modal tabIndex=-1
0%
100%
Modal focus save
70%
100%
Modal focus restore
100%
100%
Modal Escape close
100%
100%
Without context: $0.4429 · 1m 58s · 15 turns · 16 in / 8,054 out tokens
With context: $0.5065 · 1m 56s · 17 turns · 322 in / 7,653 out tokens
Context + Reducer state management
Typed Action union
100%
100%
useReducer + Context
100%
100%
Custom hook error throw
100%
100%
Debounce via setTimeout
100%
100%
AnimatePresence usage
0%
100%
motion component animation
0%
100%
List exit animation y direction
0%
100%
transition duration
0%
100%
ErrorBoundary class component
100%
100%
ErrorBoundary reset button
100%
100%
componentDidCatch logging
0%
100%
ErrorBoundary wraps content
100%
100%
Controlled form validation
100%
100%
Without context: $0.9020 · 4m 7s · 22 turns · 70 in / 18,071 out tokens
With context: $0.9228 · 3m 15s · 27 turns · 76 in / 13,424 out tokens
Table of Contents
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.