Timeline/graph visualization for traces

[david1542]

Describe the feature or potential improvement

It'd be awesome to visualize a trace maybe as a graph/DAG. I'm building a scenario where I have multiple agents talking to each other, activating several tools, and it's hard to follow the flow with the current UI.

Additional information

No response

[marcklingen]

We are considering adding a gantt-chart / flame-graph. would this help in your case as well?

I see how a DAG would be cool, how would you define the edges based on the data that you ingest into Langfuse?

[marliessophie]

Appreciate the feedback! We're about to launch our beta version of a timeline for traces. This should help visualise your agent flow. We'll be releasing this change this week.

trace-timeline.mp4

[ssoto]

Great job! I am starting to use langfuse (I come from langsmith) and it is a very nice visualisation to understand the flows and how much time each part of an interaction spend.

[josiahbryan]

Loving the timeline view so far!

One thing that would be helpful is to see when each item STARTS in relation to the start of the top-level trace.

The Case For Start Time

Use case: overall latency. The top-level trace is started immediately when the user message is received, and that covers things like background processing related to the current message - but the "most important" generation is the one that streams the final chunks - that's the one I've highlighted the details button in below in red. ... so what I really want to know is how long it took to arrive at the starting point of that generation (the green line) relative to when the parent trace (arrow head) started.

I do see the time on hover (circled in yellow) but that seems to be some sort of total duration (I say "seems" because it doesn't correlate to any number directly in the details panel, and other traces (lower, not shown) have short numbers (1.7s, etc) even though they clear start >4.00s on the timeline)

Idea for Solutions

Either/both:

• On hover, show START time (0.25s or whatever) to the left of the chunk (e.g. to the left of the chunk that is an orange rectangle under the yellow circle)
• When opening the details panel (red circled icon), show the "start" time somewhere in there

Examples of Other Solutions

An obvious analogy would be Chrome's Network > "Timing" tab:

The "Started At" here circled at the top is what I'm going for

The "Requiest/Response" timing is useful (mainly because I use it all the time to see how things break down) - and could be useful to show in langfuse, but not the main ask here today :-) Good work y'all!

[marliessophie]

Hey @josiahbryan, thanks so much for the detailed feedback! Glad you are enjoying the timeline view overall.

We'll definitely take your thoughts on start time into consideration for our next iteration, much appreciated. As you mentioned, right now we don't explicitly show the start-time-offset relative to the parent trace for nested observations, but we might e.g. show it in the detail view in the future. The current value you can see on hover is the latency of the respective observation which can also be seen in the detail view and should correlate directly to latency here.

[aiseei]

@marcklingen @marliessophie This is a really useful feature for us esp. for deeply nested traces we have in RAG - giving us a lot more visibility on timing of indiv spans. Thanks!