Distributed Tracing

Overview

FlashDuty RUM's Trace Tracking feature deeply integrates front-end user monitoring with distributed tracing systems, allowing you to correlate web application requests with their corresponding backend traces. This combination enables you to view complete front-end and backend data at a glance, achieving end-to-end performance monitoring and issue troubleshooting.

Through Trace Tracking, you can:

Correlate front-end and back-end requests: Link front-end user operations with backend API calls

End-to-end issue troubleshooting: Quickly locate issues in the complete request chain from front-end to back-end

Performance bottleneck analysis: Identify performance bottlenecks throughout the entire request chain

User experience optimization: Optimize user experience based on complete request chain data

How It Works

Trace tracking is implemented based on the W3C Trace Context standard, correlating front-end and back-end requests by injecting trace information into HTTP request headers:

Front-end initiates request: The RUM SDK automatically adds trace header information to configured API requests

Back-end receives and processes: Backend services receive and process requests with trace information

Chain correlation: Front-end and back-end data are correlated through the same trace_id

Visual display: View complete request chain information through trace correlation based on trace_id

Configuration Steps

1. SDK Configuration

First, you need to configure the distributed tracing feature in the RUM SDK. Based on the RUM Advanced Configuration Documentation, add the following parameters when initializing the RUM SDK:

Key Configuration Parameters

allowedTracingUrls: Specifies API endpoints that need trace information added

String: Matches URLs starting with this value, e.g., https://api.example.com

Regular Expression: Uses regex to match URLs

Function: Custom matching logic, returns true for successful matches

traceSampleRate: Trace sampling rate, controls what percentage of requests are traced

Range: 0-100

Default: 100 (trace all requests)

Recommendation: Set to 10-20 in production to balance monitoring coverage and performance

2. Application Management Configuration

After SDK configuration, you can configure trace jump settings in the application management page:

Go to Application Management page

Select the corresponding RUM application

Configure the trace system jump address (if distributed tracing system is integrated)

Enable Trace Tracking feature in Advanced Configuration

提示

In the configured jump link, the system will automatically replace ${trace_id} with the actual trace_id.

3. Backend Service Configuration

For complete distributed tracing support, backend services need to:

Receive trace header information: Process traceparent and tracestate request headers

Pass trace information: Continue passing trace headers when calling other services

Generate trace data: Record request processing into the tracing system

Trace Header Information

The RUM SDK automatically adds the following HTTP header information to configured requests:

traceparent Header

traceparent: 00-00000000000000008448eb211c80319c-b7ad6b7169203331-01

Format: [version]-[trace-id]-[parent-id]-[trace-flags]

version: Currently 00

trace-id: 128-bit trace ID, 32 characters after hexadecimal processing

parent-id: 64-bit span ID, 16 characters after hexadecimal processing

trace-flags: Sampling flag, 01 indicates sampled, 00 indicates not sampled

tracestate Header

tracestate: dd=s:1;o:rum

Format: dd=s:[sampling-priority];o:[origin]

sampling-priority: 1 indicates the trace is sampled

origin: Always rum, indicating collection through RUM SDK

Use Cases

1. Viewing Traces in RUM Session Explorer

After configuration, you can view corresponding trace information in the View section of the RUM Session Explorer:

Go to RUM Session Explorer

Select a page view containing API calls

View Trace Information in the view details

Click the trace link to jump to the trace system to view detailed request chains

2. Finding Resources by trace_id

You can also search for resources in the explorer using trace_id:

Enter trace_id in the explorer search bar

View corresponding resources and view loading conditions

Analyze the correlation between resource loading performance and backend API calls

提示

You can also query corresponding resources directly by appending parameters to the URL. Example URL:
https://console.flashcat.cloud/rum/explorer?appid=${YOUR_APP_ID}&end=${END_TIME}&eventType=resource&queryStr=trace_id%3A${TRACE_ID}&start=${START_TIME}

Where start, end, and appid are optional parameters. If not provided, the current RUM default query application and time range will be reused. You can construct the URL according to your actual situation.

3. End-to-End Issue Troubleshooting

When users report performance issues:

Find the problematic user's session in the RUM Session Explorer

View trace information for the problem page

Jump to the trace system to view the complete request chain

Determine whether it's a front-end, back-end, or network issue

Best Practices

1. Reasonable Sampling Rate Configuration

Development Environment: Recommend setting to 100% to ensure all requests are traced

Testing Environment: Recommend setting to 50-80% to balance monitoring coverage and performance

Production Environment: Recommend setting to 10-20% to avoid performance impact

2. Precise Tracing URL Configuration

3. Cross-Origin Request Handling

If your HTTP requests involve cross-origin issues, ensure:

Server is configured with correct CORS headers

Preflight requests are supported

traceparent and tracestate headers are allowed

4. Performance Monitoring

Regularly check the impact of trace sampling rate on application performance

Monitor storage and query performance of trace data

Adjust tracing strategy based on business requirements

Common Issues

Q: Why don't some requests have trace information?

A: Possible reasons include:

Request URL is not within the allowedTracingUrls configuration range

Request was filtered by traceSampleRate sampling rate

Request was initiated before SDK initialization

Cross-origin requests lack necessary CORS configuration

Q: How to verify if trace configuration is correct?

A: You can verify through the following methods:

Check network request headers in browser developer tools

Confirm requests contain traceparent and tracestate headers

Check if trace information is displayed in the RUM Session Explorer

Notes

Privacy Compliance: Ensure trace data collection complies with relevant privacy regulations

Performance Impact: Set reasonable sampling rates to avoid significant impact on application performance

Data Security: Avoid including sensitive information in trace data

Cross-Origin Configuration: Ensure backend services are properly configured with CORS to support trace headers

RUM Advanced Configuration - Learn about complete RUM SDK configuration options

RUM Session Explorer Overview - Master the use of RUM Session Explorer

Distributed Tracing

Overview#

How It Works#

Configuration Steps#

1. SDK Configuration#

Key Configuration Parameters#

2. Application Management Configuration#

3. Backend Service Configuration#

Trace Header Information#

traceparent Header#

tracestate Header#

Use Cases#

1. Viewing Traces in RUM Session Explorer#

2. Finding Resources by trace_id#

3. End-to-End Issue Troubleshooting#

Best Practices#

1. Reasonable Sampling Rate Configuration#

2. Precise Tracing URL Configuration#

3. Cross-Origin Request Handling#

4. Performance Monitoring#

Common Issues#

Q: Why don't some requests have trace information?#

Q: How to verify if trace configuration is correct?#

Notes#

Related Documentation#

Overview

How It Works

Configuration Steps

1. SDK Configuration

Key Configuration Parameters

2. Application Management Configuration

3. Backend Service Configuration

Trace Header Information

traceparent Header

tracestate Header

Use Cases

1. Viewing Traces in RUM Session Explorer

2. Finding Resources by trace_id

3. End-to-End Issue Troubleshooting

Best Practices

1. Reasonable Sampling Rate Configuration

2. Precise Tracing URL Configuration

3. Cross-Origin Request Handling

4. Performance Monitoring

Common Issues

Q: Why don't some requests have trace information?

Q: How to verify if trace configuration is correct?

Notes

Related Documentation