Comments (6)
I'm removing the available tag from here, as I don't feel this is well scoped enough to be immediately actionable. I think we need more research into what this looks like, and maybe for the timeline to stabilize a bit more in its implementation.
from profiler.
I have a use-case as simple as "I have two profiles and would like to know the average fps of each". For this, I don't need a more detailed timeline, just a gross fps number.
However, a frame time histogram would also be great.
from profiler.
What's the difference between the marker information in the profile and the requestAnimationFrame loop in the content of a page? I assume the profile can access markers for this information. For some reason the devtools has a performance framerate actor that accumulates requestAnimationFrame timings manually... Although it might have something to do with displaying framerates as they happen. I haven't dug into that part as much yet. I know jsantell was mentioning that the framerates are unreliable in the devtools perf tool.
https://dxr.mozilla.org/mozilla-central/source/devtools/server/performance/framerate.js
from profiler.
Interesting, I did not know that the devtools were using requestAnimationFrame in the content in order to get refresh driver information. The problem with requestAnimationFrame is that it affects what you're measuring: it will cause the refresh driver to fire at the full rate.
If you just look at the marker information, then you only see the refresh ticks that would actually have occurred; the observations are unaffected by the act of observing.
However, you usually want to know both the rate at which you painted and also the rate at which you could have painted. The requestAnimationFrame approach gives you the latter piece of information. But, since we know how our event loop + refresh driver works in Gecko, we can also obtain that information using a different data source: the "responsiveness" numbers on the samples.
For example: If the responsiveness numbers of all samples in a range are lower than 16ms, then it means that no event had to wait for longer than 16ms during that time. Refresh driver ticks are run from regular events that also go through the event loop, so all required refresh driver ticks would also have happened within 16ms, and we would have reached a refresh driver tick frequency of 60Hz.
from profiler.
I'm going to tentatively label this to be included in the Timeline panel.
from profiler.
Here is an example profile where I really wanted FPS information:
https://perfht.ml/2ClU1wJ
I profiled two tabs of perf.html. The first with React 15, the second with React 16, and I was in the stack chart using the mouse wheel. I wanted to see if there was any better FPS between the two as I was scrolling. It's not immediately obvious.
from profiler.
Related Issues (20)
- The logic to choose a format for a date in the list of uploaded profiles isn't always great HOT 3
- Incorrect rendering in stack chart HOT 1
- Some marker tooltips show urls as links that are not properly wrapped HOT 2
- An error occurred in Firefox Profiler
- Add an option in profiler, so that user could choose only save profile in local HOT 8
- Could not download the profile. Fenix: TypeError: NetworkError when attempting to fetch resource HOT 2
- Reimplement the marker chart by using several canvas elements instead of just one HOT 1
- An error occurred in Firefox Profiler
- Not working on webextension HOT 4
- Marker table toolbar layout is messed up in narrow windows
- Allow collapsing "recursion" of a method across different classes (different overrides when recursing on a virtual method) HOT 1
- Profiler stuck processing stuff for 4min+ while examining a profile HOT 2
- Hit testing in the activity graph isn't working correctly in this profile HOT 2
- TEST ISSUE ONLY FOR JIRA -> SYNC PLEASE IGNORE
- An error occurred in Firefox Profiler
- An error occurred in Firefox Profiler
- Cannot open Chrome Trace Event profile HOT 1
- Allow filtering network markers by content type in the network marker chart
- Make the call tree sidebar localizable
- Python 3.12 perf import HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from profiler.