Skip to main content

Prompt: Design Frontend Observability

Prompt​

Design frontend observability for a SaaS app with multiple routes, experiments, releases, tenants, and third-party scripts.

Clarifying questions​

  • Which user journeys are critical?
  • What metrics define user-visible quality?
  • How are releases and experiments identified?
  • What privacy constraints apply?
  • Who responds to alerts?

Model answer outline​

  • Capture Web Vitals, route transitions, JS errors, API errors, resource failures, feature flag context, experiment assignment, release id, and selected user actions.
  • Segment by route, device class, network class, tenant class, release, and experiment.
  • Redact sensitive data and avoid raw user input.
  • Correlate frontend events with backend traces using request ids.
  • Define dashboards, alerts, and incident ownership.

Architecture diagram​

Weak answers​

  • Logs everything, including sensitive data.
  • Captures averages instead of p75/p95 route cohorts.
  • No release or experiment context.
  • No owner for alerts.
  • No link from incidents to architecture improvements.

Scoring​

Strong answer: signal taxonomy, privacy model, segmentation, trace correlation, dashboards, alert ownership, and postmortem loop.

For a complete calibrated answer, read worked-answer-frontend-observability and compare it with part-xii/frontend-quality-scorecard.