Grafana Faro is an open-source frontend observability SDK that captures errors, performance metrics, and user session data from the browser. Understanding how Faro integrates with Grafana Tempo for trace correlation and Loki for log shipping enables full-stack observability.
0 / 5 completed
1 / 5
A team installs the Grafana Faro SDK in their React app. Which type of data does Faro collect automatically without custom instrumentation?
Grafana Faro automatically captures JavaScript errors, unhandled promise rejections, console logs, and web vitals from the browser. Database and server-side metrics require separate backend instrumentation tools like Prometheus or OpenTelemetry.
2 / 5
Which Grafana backend component does Faro use to correlate frontend traces with backend spans?
Grafana Tempo is the distributed tracing backend that Faro integrates with via OpenTelemetry. Faro injects trace IDs into frontend spans, which Tempo correlates with backend spans to provide end-to-end trace context.
3 / 5
A developer wants to send custom user interaction events from Faro to Grafana. Which Faro API method should they use?
faro.api.pushEvent() sends custom named events with optional attributes to the Faro collector. pushMeasurement() is for numeric metrics, pushLog() for log entries, and pushError() for error objects.
4 / 5
What is the role of the Faro Collector in a Grafana observability stack?
The Faro Collector (or Grafana Agent with Faro receiver) acts as a telemetry ingestion endpoint. It receives signals from browser SDKs over HTTP and routes them to the appropriate Grafana backends like Loki for logs and Tempo for traces.
5 / 5
Which Web Vitals metric does Grafana Faro capture that measures the time until the largest visible content element renders?
LCP (Largest Contentful Paint) measures how long it takes for the largest image or text block visible in the viewport to render. Faro captures all Core Web Vitals automatically, including CLS for layout stability and FID for interaction responsiveness.