该技能用于在主流前端框架中构建 NextDNS 管理面板，覆盖 Nuxt 4、Next.js 16、Astro（React islands）、SvelteKit（Svelte 5）与 React Router v8 五套框架的集成规则。
用途：在前端安全接入 NextDNS API，避免 API Key 暴露在浏览器端。
主要能力（各框架高度一致）：api-proxy 通过服务端路由或 API 端点作为 BFF 代理 X-Api-Key；project-setup 引导项目初始化与环境变量配置；profile-management-ui 构建配置档案的列表、创建、更新与删除流程；logs-streaming 代理并消费 NextDNS 的 SSE 日志流；analytics-charts 获取并渲染分析与时间序列数据；error-handling 将 NextDNS API 错误映射到对应框架的错误提示或边界。
框架特有规则：Next.js 侧重服务端组件预取与客户端变更、TanStack Query v5 水合与无限查询；Nuxt 提供 runtimeConfig 代理与 Vue Query 缓存失效、乐观更新；Astro 提供 Astro 6 Server Islands 的 server:defer 懒加载；SvelteKit 提供 websocket-alternative，在无 SSE 的边缘平台上改用轮询式日志获取；React Router v8 提供 data-revalidation，通过 shouldRevalidate、fetcher、defer 控制重新验证与后台变更。
使用方式：按目标框架查阅对应规则并按主题（api-proxy、project-setup 等）应用。具体安装命令与代码示例资料未提供。
适用场景：为 NextDNS 构建带实时日志、分析图表的完整管理仪表盘。
限制：依赖 NextDNS API，需自行具备 API Key；不同框架与版本（如 Next.js 16、React Router v8、Svelte 5、Astro 6）的兼容与配置细节需参考官方文档；SSE 在部分平台不可用，需使用轮询替代方案。