flutter / flutter/devtools

Make really slow frames clearer in the performance page bar chart

未关闭
#3,094 0 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看
new feature P3 screen: performance
主要语言
Dart
星标
1.7k
派生
404
平均合并
6 天 17 小时
30 天内合并 PR
18

描述

Currently a slightly slow frame (32ms) which a user is unlikely to notice unless it is a glitch in the middle of a smooth animation looks the same as catastrophic jank (200+ms)

Idea: rather than showing a bar chart, show a timeline (perhaps with gaps omitted for periods of inactivity). That way, jank for 300ms would look visually longer than jank for 32 ms.
This is similar to what Chrome DevTools does where they show the frame rate per ms in the performance page instead of a bar chart.
A bonus of this design is it makes it easier to link up time ranges in the flame chart with the bar chart as both now have a consistent X axis. This makes it practical to visualize what time range from the flame chart is visible.

Risk of this approach: makes it less clear how long each frame took to render.
https://user-images.githubusercontent.com/1226812/121062165-9c2b8480-c779-11eb-9081-0a861a942ae2.mp4

贡献指南

打开贡献指南

调研方向

从性能页面当前的帧柱状图开始,将其行为与 issue 中描述的 Chrome DevTools 性能视图进行比较。定义一个时间线,使 32 ms 和 200+ ms 的帧在视觉上有所区别,支持将时间范围与 flame chart 对齐,同时仍能传达每个帧的渲染时长。

由索引模型根据 Issue 内容生成。

评估

技术栈
dart, flutter
领域
devtools, performance
Issue 类型
功能
难度
5/5
预计耗时
一周以上
活跃度
停滞
描述清晰度
需要澄清
新手友好度
35/100

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。