tooling

tooling 是面向效率工具、文档处理、开发运维的 Agent Skill，来自 HoangNguyen0403/agent-skills-standard。查看技能说明、操作步骤与使用约定，并通过原项目了解详细用法。

Debugging, build analysis, and ecosystem tools.

name	React Tooling
description	Debugging, build analysis, and ecosystem tools.
metadata	{"labels": ["react", "tooling", "debug", "performance"], "triggers": {"files": ["package.json"], "keywords": ["devtool", "bundle", "strict mode", "profile"]}}

React Tooling

Priority: P2 (OPTIONAL)

Tools for analysis and debugging.

Implementation Guidelines

DevTools: Use "Highlight Updates" to spot re-renders.
Debugger: useDebugValue for custom hooks.
Performance: why-did-you-render to catch wasted renders.
Bundle: source-map-explorer or bundle-visualizer.
Linting: eslint-plugin-react-hooks (Errors) + react-refresh.
Strict Mode: Enable for double-invoke checks (effects/reducers).

Code

// Debugging Hooks
useDebugValue(isOnline ? 'Online' : 'Offline');

// why-did-you-render
if (process.env.NODE_ENV === 'development') {
  const whyDidYouRender = require('@welldone-software/why-did-you-render');
  whyDidYouRender(React, {
    trackAllPureComponents: true,
  });
}

来源：HoangNguyen0403/agent-skills-standard · MIT 许可 · 许可原文 · MD 为来源页保存的历史版本