Appearance

Metrics, Traces & Logs ​

Hubble Studio now provides Grafana, a powerful open-source platform, to visualize and analyze your application's performance metrics, traces, and logs. This feature gives your team deep insights into the behavior of your hosted applications, helping you to identify and resolve issues quickly.

To access Grafana, simply click the "Grafana" link in your team's menu. You'll be redirected to a dedicated dashboard showing the collected data for all projects within your team.

Overview ​

Metrics ​

Metrics provide a high-level overview of your application's performance. They are numerical data points collected at regular intervals, such as request counts, error rates, and response times. Grafana dashboards can present this data in customizable visualizations like graphs and charts.

By navigating to Drilldown > Metrics you can:

  • Monitor key performance indicators (KPIs): Track essential metrics like response times, error rates and traffic patterns.

  • Identify trends and anomalies: Spot performance degradation or unusual spikes in traffic over time.

  • Drill down into specific requests: By selecting a data point on a graph, you can drill down to see the detailed traces and logs for that specific time range, helping you pinpoint the root cause of an issue.

Logs ​

Logs are text-based records of events that occur within your application. Currently, the logs feature provides access logs from the webserver, offering a record of every request that comes into your application.

  • Search and filter logs: You can search through the webserver access logs by time, project, or specific keywords to find relevant events.

  • Correlate with metrics and traces: Access logs are an essential part of the drilldown process. When you've identified a problem using metrics or traces, you can access the corresponding logs to get the full story. For example, a slow request identified in a trace can be cross-referenced with the access logs to see the exact time and parameters of the request.

  • Contextualize events: The webserver access logs provide details about the request itself, such as the IP address, user agent, and response status code. This helps you understand who accessed your application and with what result.

Traces ​

Traces provide a detailed, end-to-end view of a single request as it flows through your application's services. This is invaluable for troubleshooting complex, distributed systems.

  • Visualize request flow: A trace shows the sequence of operations (spans) a request goes through, including which services it calls and how long each operation takes.

  • Identify bottlenecks: By examining a trace, you can easily find which service or operation is causing a delay. A slow span will be highlighted, showing you where the bottleneck is.

  • Connect to logs: Each span within a trace can be linked to its corresponding logs, giving you the context you need to understand why a particular operation failed or took a long time.

INFO

For tracing to be enabled, some setup is required. If you are using Shopware 6, our team will assist you in instrumenting your application to include tracing.

Hubble Studio's integration with Grafana provides a powerful suite of tools to monitor and troubleshoot your projects. By understanding how to navigate between Metrics, Traces, and Logs, you can quickly diagnose and resolve performance issues. This guide will walk you through a typical troubleshooting workflow, demonstrating how these three features work together.

Step 1: Identify an Anomaly with Metrics ​

Metrics are your starting point for identifying potential issues. They provide a high-level overview of your application's health and performance.

How to Interact with Metrics: ​

  1. Access your team's Grafana dashboard by clicking the "Grafana" link in the Hubble Studio menu.
  2. Navigate to the Metrics dashboard to see graphs and charts of key performance indicators (KPIs) like request duration and error rates.
  3. Look for any unusual spikes, dips, or trends. For example, a sudden increase in the HTTP response status code for 500 errors indicates a problem you need to investigate.

Drilldown: Once you've found an anomaly on a metrics graph, click and drag your mouse to select the exact time range of the issue. After selecting the metrics graph, a menu will appear with options to Breakdown, view Related metrics, and access Related logs.

Step 2: Investigate with Traces ​

Traces help you understand the end-to-end journey of a single request, allowing you to pinpoint where an issue is occurring in a distributed system.

How to Interact with Traces: ​

  1. From the metrics dashboard, after selecting a time range, click the Traces button or navigate to the dedicated Traces dashboard.
  2. You'll see a list of traces from the selected time period. Click on a trace to view its "waterfall" visualization. This view shows a breakdown of the request into individual spans, representing each operation.
  3. Look for spans with long durations or error indicators. A slow span will be visually obvious, highlighting the bottleneck. The trace_id and span_id link these operations together, allowing you to see the full context of the request.

Drilldown: Within a trace, each span is linked to related logs. This is your connection point to get detailed, text-based information about a specific operation.

Step 3: Diagnose with Logs ​

Logs provide the raw, text-based details of events that occurred at a specific point in time. They are essential for understanding the "why" behind an issue.

How to Interact with Logs: ​

  1. From either the metrics dashboard (by using the Related logs option) or from within a specific span in a trace, you can access the Logs dashboard.
  2. The logs will be automatically filtered to the relevant time range or trace_id.
  3. Use the log viewer to read the webserver access logs. You can search for keywords or filter by labels like http_response_status_code to find the exact request that caused the issue. The log entry will provide crucial details such as the IP address, user agent, and full URL of the problematic request.

Connection: By navigating from Metrics (high-level view) to Traces (end-to-end flow) and finally to Logs (raw data), you can follow a clear and logical path to diagnose and resolve issues with your hosted applications.