·hydration-guardian
{}

hydration-guardian

确保服务器渲染的 HTML 和客户端 React 树之间的零不匹配完整性。在调试水合错误、修复文本内容不匹配、处理浏览器扩展 DOM 污染、使用 Suspense 实现选择性水合、使用 React 19 use() 挂钩实现确定性服务器到客户端数据桥或应用 Next.js 使用缓存来防止数据漂移时使用。用于水合作用不匹配、SSR、 HydroRoot、suppressHydrationWarning、onRecoverableError、两遍渲染。

25安装·2热度·@oakoss

安装

$npx skills add https://github.com/oakoss/agent-skills --skill hydration-guardian

如何安装 hydration-guardian

通过命令行快速安装 hydration-guardian AI 技能到你的开发环境

  1. 打开终端: 打开你的终端或命令行工具(如 Terminal、iTerm、Windows Terminal 等)
  2. 运行安装命令: 复制并运行以下命令:npx skills add https://github.com/oakoss/agent-skills --skill hydration-guardian
  3. 验证安装: 安装完成后,技能将自动配置到你的 AI 编程环境中,可以在 Claude Code、Cursor 或 OpenClaw 中使用

来源:oakoss/agent-skills。

SKILL.md

查看原文

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、 HydroRoot、suppressHydrationWarning、onRecoverableError、两遍渲染。 来源:oakoss/agent-skills。

可引用信息

为搜索与 AI 引用准备的稳定字段与命令。

安装命令
npx skills add https://github.com/oakoss/agent-skills --skill hydration-guardian
分类
{}数据分析
认证
收录时间
2026-02-22
更新时间
2026-03-10

Browse more skills from oakoss/agent-skills

快速解答

什么是 hydration-guardian?

确保服务器渲染的 HTML 和客户端 React 树之间的零不匹配完整性。在调试水合错误、修复文本内容不匹配、处理浏览器扩展 DOM 污染、使用 Suspense 实现选择性水合、使用 React 19 use() 挂钩实现确定性服务器到客户端数据桥或应用 Next.js 使用缓存来防止数据漂移时使用。用于水合作用不匹配、SSR、 HydroRoot、suppressHydrationWarning、onRecoverableError、两遍渲染。 来源:oakoss/agent-skills。

如何安装 hydration-guardian?

打开你的终端或命令行工具(如 Terminal、iTerm、Windows Terminal 等) 复制并运行以下命令:npx skills add https://github.com/oakoss/agent-skills --skill hydration-guardian 安装完成后,技能将自动配置到你的 AI 编程环境中,可以在 Claude Code、Cursor 或 OpenClaw 中使用

这个 Skill 的源码在哪?

https://github.com/oakoss/agent-skills

详情

分类
{}数据分析
来源
skills.sh
收录时间
2026-02-22