Ensures zero-mismatch integrity between server-rendered HTML and client-side React trees. Covers hydration error diagnosis, selective hydration via Suspense boundaries, deterministic data bridges with the React 19 use() hook, 'use cache' for eliminating data drift, two-pass rendering for client-only content, React 19's single-diff hydration error reporting for pinpointing exact mismatches, and automated validation...
When to use: Debugging hydration mismatch errors, fixing text content mismatches, handling browser extension DOM pollution, implementing deterministic data bridges, optimizing SSR/client hydration performance, setting up error monitoring with onRecoverableError.
When NOT to use: Client-only React applications without SSR, static sites without hydration, API-only backends.
يضمن عدم التطابق التام بين أشجار HTML المقدمة من الخادم وأشجار React من جانب العميل. يُستخدم عند تصحيح أخطاء الترطيب، أو إصلاح عدم تطابق محتوى النص، أو التعامل مع تلوث DOM لامتداد المتصفح، أو تنفيذ الترطيب الانتقائي باستخدام Suspense، أو استخدام خطاف React 19 use() لجسور البيانات الحتمية من الخادم إلى العميل، أو تطبيق Next.js استخدم ذاكرة التخزين المؤقت لمنع انجراف البيانات. يُستخدم في حالات عدم تطابق الترطيب، وSSR، وhydrotRoot، وقمع HydrationWarning، وonRecoverableError، والعرض ثنائي المسار. المصدر: oakoss/agent-skills.