web-observability
指导Claude为Web应用进行正确、高效的可观测性建设。
安装使用
复制下面这段提示词发给你的 AI（Claude / Cursor / TRAE / Codex / WorkBuddy 等），它会自动帮你完成安装：
帮我安装这个 AI Skill：web-observability。 它的用途是：指导Claude为Web应用进行正确、高效的可观测性建设。 完整的 Skill 内容见：https://321skill.com/skills/web-observability/raw/index.md 请读取该页面内容，如果是 SKILL.md 格式直接安装，如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接，AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
'/audit src/features/payment'，它会扫描你的支付功能代码，找出监控覆盖的漏洞和反模式，比如缺失用户ID上下文、可能泄露PII（个人身份信息）的字段，并给出具体的修复建议。或者说：'我的Next.js应用LCP指标很差，怎么办？'，它会触发`core-web-vitals`技能，分析可能的原因并提供框架特定的优化方案。
介绍
Web Observability Plugin旨在解决Web团队在应用可观测性建设中的常见痛点：要么监控不足，导致线上问题难以定位；要么过度监控，带来性能损耗和成本浪费；或者上下文信息缺失，使得错误日志无法指导行动。
该插件通过提供 /instrument 和 /audit 等命令，以及11个根据上下文自动触发的技能，指导用户如何为React、Vue、Angular等主流前端框架，以及Sentry、Datadog等监控平台，制定和实施监控方案。它能分析代码库架构，识别关键用户流程，并生成优先级明确的埋点计划。
它非常适合负责Web应用开发与维护的前端、全栈开发者和运维工程师，特别是那些正在为新项目搭建监控体系，或希望对现有混乱的监控进行优化的团队。
使用建议：在项目初期或重构阶段引入，能最大化其价值。注意，它提供的是指导和建议，而非自动化的代码生成工具，最终的实现和配置仍需开发者根据具体业务和平台完成。
核心特点
与通用代码分析工具不同，它深度聚焦于Web可观测性领域，不仅能分析代码结构，更能结合用户意图与系统状态，提供针对错误追踪、性能监控、会话回放等具体场景的、符合行业最佳实践的落地方案。
注意事项
不适用于非Web环境（如纯后端服务、移动原生应用）的可观测性建设，且其建议的落地实现需要开发者具备一定的前端工程知识。
常见问题
这个插件能自动给我的代码添加埋点吗？
不能，它是一个指导工具，会分析你的代码并生成详细的埋点计划和代码示例，但需要开发者手动或结合其他工具实现。
支持哪些监控平台？
支持Sentry、Datadog、New Relic、LogRocket、FullStory、PostHog、Vercel Analytics以及OpenTelemetry标准。
给 AI 助手的安装指引
如果你的 AI 编程助手（Claude Code、Cursor、TRAE 等）能看到这个页面，把下面这段发给它即可自动完成安装：
请访问 https://321skill.com/skills/web-observability/raw/index.md 读取 web-observability 的原始 Skill 定义（Markdown 格式），按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址：/skills/web-observability/raw/index.md（查看排版版本）