-
Notifications
You must be signed in to change notification settings - Fork 32
Hardware requirements
Timeline chart is leveraging the PIXI Js library to take advantage of hardware acceleration. This should allow the new implementation of a timeline to be faster than legacy products.
In terms of actual performance we want probably 60 fps, I would argue 10 fps is a fine compromise for the WORST case
The amount of elements shown depends on the screen resolution, here are the maximum possible amounts of elements to show.
Resolution | Max # states (and textured pixels) | Max # vertexes | Fill rate (mega v/s) |
---|---|---|---|
4k | 8.3 M | 33 M | 330 M |
1440p | 3.6 M | 15 M | 150 M |
1080p | 2 M | 8 M | 80 M |
720p | 1 M | 4 M | 40 M |
To give perspective (2020 numbers):
- This is the worst case, it is very very hard to achieve
- An old laptop or modern tablet should handle 720p
- A new laptop should handle 1080p
- A gaming console or desktop computer should handle 1440p
- A top notch PC can handle 4K
Optimisations that come to mind: Note: these optimizations will not accelerate the "average case" only degenerate cases.
- On the software side a quick optimisation is "if a state is one pixel wide, draw a line" this will divide the number of vertexes by 2
- We can also apply a "Zebra optimisation": one state is full and the other draws over. So we can make alternating colours draw as surfaces. So in some cases we can divide by 2 another time.
- Finally we can draw to a back buffer and over-render, then keep the image as a surface. Then panning will be trivial, we will lose in terms of memory usage and we will suffer aliasing issues with this.
- Check that we wait for VSync to avoid tearing issues. (we might already do that.)
- It appears that PIXI is single threaded and uses OpenGL in a single threaded way, this may lead to CPU bottlenecks.
- Finally we should avoid pre-mature optimisations I wrote them to show that we know there is work that can be done if needed on the software side.
bunny-mark is available by default with PIXI js. It scales really poorly (I tried it on several PCs and the results are not linear), but it uses pixiJS.
Conclusions: you need a GPU, but it is definitely single thread performance limited as a benchmark, it should be treated as a sanity test, not bandwidth test.