
bug: Trace tree view elements overlap when collapsing/expanding nested spans
快速结论:该问题主要出现在 Langfuse trace 详情页的 new “Fast (Preview)” 树形视图中,展开/折叠嵌套 span 时,子 span 的行标签、标记和持续时间文本会互相重叠,导致树状图不可读。优先尝试关闭 “Fast (Preview)” 选项,回退到旧版渲染器。
问题场景
在 Langfuse(云版)的 trace 详情页,查看带有嵌套 spans/observations 的 trace(例如包含多个子工具调用的父 span)时,用户执行展开和折叠操作后,UI 元素发生渲染错乱,文本重叠到相邻行。
报错原文
When viewing a trace in the trace detail page, collapsing and expanding nested spans/observations causes UI elements to overlap and render on top of each other. Text from different span rows bleeds into adjacent rows, making the trace tree unreadable.
原因分析
该问题很可能是 trace2 重构(PR #10647、#10665)中的回归缺陷。新的树形视图使用 @tanstack/react-virtual 实现虚拟化渲染,并采用了动态高度估算,但在展开/折叠状态变更后,高度测量值未能及时更新,导致重叠。此问题与动态行高修复 PR #10620 有关,可能是尚未覆盖的边缘情况。
环境排查
- Langfuse 环境:Langfuse Cloud(云版),已确认在”Fast (Preview)”模式下复现。
- SDK 版本:langfuse Python SDK v4.0.0(仅记录,不影响前端渲染)
- Trace ID 示例:
1628dd963c70fad22c1239e2fd1e4409
解决步骤
- 打开存在问题的 trace 详情页。
- 在页面中查找并关闭 “Fast (Preview)” 选项(切换为旧版渲染器)。
- 旧版渲染器已包含来自 PR #10620 的动态行高修复,可有效解决重叠/裁剪问题。
- 如果必须使用新版渲染器,请关注 langfuse 后续发布修复此回归缺陷的版本更新。
验证方法
关闭 “Fast (Preview)” 后,在同一个 trace 下重复展开和折叠嵌套 spans 操作,观察各 span 标签、标记和持续时间文本是否正常显示,不再出现重叠或文字相互渗入的情况。

![[OpenAI] 做了一个 ai 模型降智监测页面](https://www.chat-gpts.plus/wp-content/uploads/2026/07/ai_cover_5-350-768x403.jpg)

![[程序员] Claude 突然的,就来了!瑟瑟发抖中。。。。](https://www.chat-gpts.plus/wp-content/uploads/2026/07/ai_cover_3-355-768x403.jpg)