{
  "id": "react/strict-mode-double-invoke-effect",
  "signature": "Warning: Component renders twice in development. useEffect cleanup runs immediately after mount. API called twice on component mount.",
  "signature_zh": "警告：组件在开发环境中渲染两次。useEffect 清理在挂载后立即运行。API 在组件挂载时被调用两次。",
  "regex": "Component renders twice in development",
  "domain": "react",
  "category": "runtime_error",
  "subcategory": null,
  "root_cause": "React StrictMode in development intentionally double-invokes effects to detect side-effect bugs, causing cleanup to run immediately after mount and effects to fire twice.",
  "root_cause_type": "generic",
  "root_cause_zh": "开发环境中的 React StrictMode 会故意双重调用副作用以检测副作用错误，导致清理在挂载后立即运行，并且副作用触发两次。",
  "versions": [
    {
      "version": "react@18.2.0",
      "introduced": null,
      "deprecated": null,
      "removed": null,
      "behavior_change": null,
      "status": "active"
    },
    {
      "version": "react@17.0.2",
      "introduced": null,
      "deprecated": null,
      "removed": null,
      "behavior_change": null,
      "status": "active"
    }
  ],
  "os_specific": {},
  "dead_ends": [
    {
      "action": "Removing StrictMode wrapper entirely to stop double invocations",
      "why_fails": "StrictMode is a development tool; removing it hides the bug but doesn't fix it. The same bug may cause issues in production if effects have improper cleanup.",
      "fail_rate": 0.6,
      "condition": "",
      "sources": []
    },
    {
      "action": "Adding a flag to prevent the second API call (e.g., if (called) return)",
      "why_fails": "This masks the StrictMode behavior but may break cleanup logic or cause stale data if the flag is not reset properly.",
      "fail_rate": 0.75,
      "condition": "",
      "sources": []
    },
    {
      "action": "Ignoring the double call as a development-only issue",
      "why_fails": "If the effect has side effects like subscriptions or analytics, the double call can cause production-like bugs that are hard to debug.",
      "fail_rate": 0.5,
      "condition": "",
      "sources": []
    }
  ],
  "workarounds": [
    {
      "action": "Ensure useEffect has a proper cleanup function that cancels the API call or subscription. This makes the double invocation harmless.",
      "success_rate": 0.9,
      "how": "Ensure useEffect has a proper cleanup function that cancels the API call or subscription. This makes the double invocation harmless.",
      "condition": "",
      "sources": []
    },
    {
      "action": "Use useRef to track if the effect has already run and skip the second invocation if needed (only for specific cases like analytics).",
      "success_rate": 0.8,
      "how": "Use useRef to track if the effect has already run and skip the second invocation if needed (only for specific cases like analytics).",
      "condition": "",
      "sources": []
    }
  ],
  "workarounds_zh": [
    "Ensure useEffect has a proper cleanup function that cancels the API call or subscription. This makes the double invocation harmless.",
    "Use useRef to track if the effect has already run and skip the second invocation if needed (only for specific cases like analytics)."
  ],
  "transition_graph": {
    "leads_to": [],
    "preceded_by": [],
    "frequently_confused_with": []
  },
  "official_doc_url": "https://react.dev/reference/react/StrictMode",
  "official_doc_section": null,
  "error_code": null,
  "verification_tier": "ai_generated",
  "confidence": 0.82,
  "fix_success_rate": 0.75,
  "resolvable": "partial",
  "first_seen": "2023-05-20",
  "last_confirmed": "2024-06-01",
  "last_updated": "2024-06-01",
  "evidence_count": 1,
  "tags": [],
  "locale": "en",
  "aliases": []
}