React Component Diagnosis
by hylarucoder · development · typescript, react, code-review, api, skill
深度诊断单个 React 组件的架构设计质量，产出一份结构化体检报告：7 维度评分卡（使用者 API、数据流、可测试性、可扩展性、性能、心智模型、边界契约，每维 1-5 分 + 代码证据）、设计亮点、按 P0/P1/P2 分级且标注工作量的改进建议——所有评分基于逐行读代码后发现的具体问题（useMemo 依赖、useEffect cleanup、类型断言、每帧重复计算等），而非扫一眼目录得出的表面评价。当用户请求组件诊断、组件设计审查、架构分析、组件体检、组件 API/props 设计评估时使用，即使没说出"诊断"二字也应主动触发：用户指向一个组件目录或 .tsx 文件问"这个组件设计得怎么样"、"帮我看看这个组件"、"这个写得怎么样"、"是否需要重构"、"为什么每次都 re-render"、"useEffect 写对了吗"、"props 设计合理吗"，或用英文说 "review this React component"、"is this component well designed"、"audit this component"、"should I refactor th...
Source: https://github.com/hylarucoder/hai-stack
Install
git clone https://github.com/hylarucoder/hai-stackTags: typescript, react, code-review, api, skill
⭐ 157 GitHub stars · Source: skillsdirectory
About development MCP servers and Claude skills
development MCP servers extend what AI agents can do inside Claude Code, Cursor, Copilot, Codex, and Windsurf. The Skiln directory indexes 16,000+ such integrations across 22 categories.
React Component Diagnosis is one of hundreds of development entries indexed on Skiln. Browse the full development category or the complete directory of Claude skills, MCP servers, agents, commands, and hooks.
Related development MCPs and skills
- Identique MCP Server by AngusHsu
MCP server for validating and extracting information from national ID numbers worldwide. Supports validation and extraction for 70+ countries using ISO 3166-1 alpha-3 country codes.
- ablestack-mcp-server by ycyun
ABLESTACK MOLD API 作为 MCP（模型上下文协议）服务器暴露。需要 Node.js v18 及以上版本，并且可以访问 CloudStack API 端点的网络。支持通过环境变量配置端点、API 密钥、密钥、签名算法和自动注册功能。
- instantdb-server MCP 服务器 by christophersutton
用于与 InstantDB 交互的 MCP 服务器。需要设置环境变量 INSTANT_APP_ID 和 INSTANT_APP_ADMIN_TOKEN，通常从项目目录中的 .env 文件加载。该服务器会根据项目目录的相对位置，动态加载常用文件位置的 InstantDB 架构。
- Funky Junction by PaulGoldschmidt
一个全面的 MCP 服务器生态系统，支持使用 Qiskit Metal 进行量子电路设计，并通过 Octave/OpenEMS 进行电磁仿真。需要外部系统依赖 Octave 和 OpenEMS，必须单独安装。
- URL 缩短器 MCP 工具 by Talismanic
使用 CleanURI API 的简易 URL 缩短工具，设计为作为 FastMCP 服务器工具运行。需要外部 Python 包 httpx 和 fastmcp。
- poc5-mcp-http-remote by mzoffoli85
This MCP server provides a Streamable HTTP endpoint with bearer token authentication, exposing echo and add tools, and an info resource for remote client integration.
- SAP OData MCP Server by YXH940724
MCP server for interacting with SAP S/4HANA OData services. It enables querying and controlled creation/update of sales orders, products, customers, and pricing conditions, with safety features like dry-run mode and ETag-based updates.
- scamshield by vadapallimouli
MCP server for detecting and analyzing scams using various heuristics and data sources.
Frequently asked questions
How do I install React Component Diagnosis?
Add the install command above to your Claude Code, Cursor, or Windsurf MCP configuration. Most servers register via npx, a local command, or a Docker image. Refer to the source repository for environment variables and credential requirements.
Which clients support React Component Diagnosis?
Any MCP-compatible client works: Claude Desktop, Claude Code CLI, Cursor, Windsurf, Zed, and VS Code with the official MCP extension. OpenAI Codex and GitHub Copilot increasingly support MCP via adapter bridges.
Is React Component Diagnosis free?
The server itself is typically open source. Any upstream service (API keys, paid tiers, hosted infrastructure) may have its own pricing. Check the source repository for details.