firefox-devtools / firefox-devtools/profiler

Be able to change the threshold for janks measurement

Open
#680 3 comments 0 reactions 0 assignees View on GitHub
timeline ux-needed
Dominant language
TypeScript
Stars
1.5k
Forks
491
Avg merge
3d 5h
Merged PRs (30d)
30

Description

Currently this threshold is hardcoded in https://github.com/devtools-html/perf.html/blob/c8801086a711b0fff7e0d87bb88b8ebfa57c620d/src/reducers/profile-view.js#L607.

We should provide an UI to change this, as different users have different requirements. 50ms is good for events like click, but not good enough to debug smooth CSS animations, or scrolling, or rendering 3D in a canvas.

Here are several possibilities I can think of:

* have several hardcoded values we can choose: 50, 32, 16, 11.
* something like input type=range to define the threshold value
* same to define the intended fps, from which we'd derive the threshold (1/fps).

Of course this would need to be persisted in the URL.

I don't have a good idea of where to put this UI.

┆Issue is synchronized with this [Jira Task](https://mozilla-hub.atlassian.net/browse/FP-678)

Contributor guide

Open the contributing guide

Research direction

Start at src/reducers/profile-view.js around the hardcoded janks threshold referenced in the issue, then trace how profile settings are represented in the UI and URL. Compare the listed threshold or FPS options and choose where the control belongs; done means users can change the threshold and the choice persists in the URL.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, redux, typescript
Domain
frontend, performance
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.