AgentSkillsCN

workleap-telemetry

Workleap遥测解决方案指南(@workleap/telemetry),通过统一的关联 ID,将 Honeycomb、LogRocket 和 Mixpanel 无缝集成,实现数据的高效协同与统一管理。 以下场景中可使用此技能: (1) 在前端应用中初始化 wl-telemetry; (2) 掌握关联值(遥测 ID、设备 ID)及其生命周期的使用方法; (3) 利用 Honeycomb 进行分布式追踪与性能分析; (4) 通过 OpenTelemetry 创建并丰富 Honeycomb 的追踪记录与跨度信息; (5) 使用 LogRocket 实现会话回放与前端调试; (6) 依托 Mixpanel 开展产品分析与事件追踪; (7) 深入理解 Honeycomb、LogRocket 和 Mixpanel 在 wl-telemetry 中各自扮演的角色; (8) 实现 Honeycomb、LogRocket 和 Mixpanel 之间的数据关联与同步; (9) 配置日志记录器,用于 wl-telemetry 的诊断与排查; (10) 使用 Noop 遥测客户端来禁用或模拟遥测功能; (11) 审核新增或修改遥测探针的 Pull Request; (12) 排查各工具间遥测数据缺失或不一致的问题。

SKILL.md
--- frontmatter
name: workleap-telemetry
description: |
  Guide for Workleap's telemetry solution (@workleap/telemetry) that unifies Honeycomb, LogRocket, and Mixpanel with consistent correlation IDs.

  Use this skill when:
  (1) Initializing wl-telemetry in a frontend application
  (2) Working with correlation values (Telemetry Id, Device Id) and their lifecycle
  (3) Using Honeycomb for distributed tracing and performance analysis
  (4) Creating and enriching Honeycomb traces/spans using OpenTelemetry
  (5) Using LogRocket for session replay and frontend debugging
  (6) Using Mixpanel for product analytics and event tracking
  (7) Understanding Honeycomb, LogRocket, and Mixpanel roles in wl-telemetry
  (8) Correlating data across Honeycomb, LogRocket, and Mixpanel
  (9) Configuring loggers for wl-telemetry diagnostics
  (10) Using Noop telemetry clients to disable/mock telemetry
  (11) Reviewing PRs that add or modify telemetry instrumentation
  (12) Troubleshooting missing or inconsistent telemetry across tools

Workleap Telemetry (wl-telemetry)

@workleap/telemetry is an umbrella package that integrates Honeycomb, LogRocket, and Mixpanel with consistent correlation IDs for unified debugging and analysis.

Core Concepts

Correlation Values

Two automatic correlation IDs unify all telemetry platforms:

IDPurposeHoneycombLogRocket/Mixpanel
Telemetry IdSingle app loadapp.telemetry_idTelemetry Id
Device IdDevice across sessionsapp.device_idDevice Id

If LogRocket is enabled, Honeycomb and Mixpanel automatically receive app.logrocket_session_url / LogRocket Session URL.

Platform Roles

  • Honeycomb: Distributed traces, performance monitoring, RUM metrics (LCP, CLS, INP)
  • LogRocket: Session replay, frontend debugging, user experience investigation
  • Mixpanel: Product analytics, event tracking, user behavior insights

Quick Start

typescript
import { initializeTelemetry, TelemetryProvider } from "@workleap/telemetry/react";

const telemetryClient = initializeTelemetry({
  logRocket: { appId: "your-app-id" },
  honeycomb: {
    namespace: "your-namespace",
    serviceName: "your-service",
    apiServiceUrls: [/.+/g],
    options: { proxy: "https://your-otel-proxy" }
  },
  mixpanel: {
    productId: "wlp",
    envOrTrackingApiBaseUrl: "production"
  }
});

// Wrap application
<TelemetryProvider client={telemetryClient}>
  <App />
</TelemetryProvider>

Using Platform Clients

typescript
// Access via hooks
const telemetryClient = useTelemetryClient();
const honeycombClient = useHoneycombInstrumentationClient();
const logRocketClient = useLogRocketInstrumentationClient();
const mixpanelClient = useMixpanelClient();
const track = useMixpanelTrackingFunction();

Storybook/Testing (Noop Clients)

typescript
import { NoopTelemetryClient, TelemetryProvider } from "@workleap/telemetry/react";

const telemetryClient = new NoopTelemetryClient();

<TelemetryProvider client={telemetryClient}>
  <Story />
</TelemetryProvider>

Detailed References

Critical Rules

  1. Use umbrella package - Always use @workleap/telemetry, not standalone packages
  2. Do not invent APIs - Only use documented APIs from references
  3. Correlation is automatic - Never manually set Telemetry Id or Device Id
  4. Noop for non-production - Use NoopTelemetryClient in Storybook/tests
  5. Privacy matters - Never log PII to LogRocket; use data-public/data-private attributes