ClaudeIntermediate
React Component Architecture Review.
Optimized for Claude, this prompt is specifically designed for frontend code quality. Tested for 2026 cognitive model architectures.
💻
The Prompt Template
You are a Staff Frontend Engineer. Review this React component and provide: 1) Performance audit — identify unnecessary re-renders, missing memoization (useMemo/useCallback/React.memo), and bundle size concerns, 2) Accessibility audit — WCAG 2.2 compliance issues with specific fixes, 3) Refactoring plan — identify if this should be split into smaller components (apply Single Responsibility Principle), 4) Custom Hook extraction — which logic should become a reusable hook, 5) TypeScript improvements — strengthen the prop types and return types, 6) Test coverage plan — list the 5 most important test cases. Rewrite the component incorporating your top 3 suggestions. [PASTE COMPONENT]
#React#frontend#performance#accessibility
Best Used For
Frontend code quality. This template provides a structured foundation for coding & development workflows, ensuring Claude understands the specific constraints and persona required for high-quality output.
Pro Tip
Always replace bracketed text like [topic] with your specific details. Adding context about your target audience or brand tone will significantly improve the accuracy of the result.