refactor:react
✓重構 React 和 TypeScript 代碼以提高可維護性、可讀性和性能。這項技能將復雜的 React 組件轉換為遵循現代 React 19 模式的干淨、結構良好的代碼。它解決了組件膨脹、道具鑽取、不必要的重新渲染和不正確的鉤子使用等問題。利用 React 19 功能,包括用於自動記憶的 React Compiler、用於表單處理的 Actions、用於即時 UI 反饋的 useOptimistic、用於異步數據的 use() 掛鉤以及用於實現最佳性能的服務器組件。
SKILL.md
You are an elite React/TypeScript refactoring specialist with deep expertise in writing clean, maintainable, and performant React applications. You have mastered React 19 features, modern hooks patterns, Server Components, and component composition.
React Compiler (Automatic Memoization) React 19's compiler automatically memoizes components and values, reducing the need for manual useMemo and useCallback:
Note: If not using React 19 compiler, still apply manual memoization where needed.
重構 React 和 TypeScript 代碼以提高可維護性、可讀性和性能。這項技能將復雜的 React 組件轉換為遵循現代 React 19 模式的干淨、結構良好的代碼。它解決了組件膨脹、道具鑽取、不必要的重新渲染和不正確的鉤子使用等問題。利用 React 19 功能,包括用於自動記憶的 React Compiler、用於表單處理的 Actions、用於即時 UI 反饋的 useOptimistic、用於異步數據的 use() 掛鉤以及用於實現最佳性能的服務器組件。 來源:snakeo/claude-debug-and-refactor-skills-plugin。
可引用資訊
為搜尋與 AI 引用準備的穩定欄位與指令。
- 安裝指令
npx skills add https://github.com/snakeo/claude-debug-and-refactor-skills-plugin --skill refactor:react- 分類
- </>開發工具
- 認證
- ✓
- 收錄時間
- 2026-02-06
- 更新時間
- 2026-02-18
快速解答
什麼是 refactor:react?
重構 React 和 TypeScript 代碼以提高可維護性、可讀性和性能。這項技能將復雜的 React 組件轉換為遵循現代 React 19 模式的干淨、結構良好的代碼。它解決了組件膨脹、道具鑽取、不必要的重新渲染和不正確的鉤子使用等問題。利用 React 19 功能,包括用於自動記憶的 React Compiler、用於表單處理的 Actions、用於即時 UI 反饋的 useOptimistic、用於異步數據的 use() 掛鉤以及用於實現最佳性能的服務器組件。 來源:snakeo/claude-debug-and-refactor-skills-plugin。
如何安裝 refactor:react?
開啟你的終端機或命令列工具(如 Terminal、iTerm、Windows Terminal 等) 複製並執行以下指令:npx skills add https://github.com/snakeo/claude-debug-and-refactor-skills-plugin --skill refactor:react 安裝完成後,技能將自動設定到你的 AI 程式設計環境中,可以在 Claude Code 或 Cursor 中使用
這個 Skill 的原始碼在哪?
https://github.com/snakeo/claude-debug-and-refactor-skills-plugin
詳情
- 分類
- </>開發工具
- 來源
- skills.sh
- 收錄時間
- 2026-02-06