Workflow list scrolling laggy on Firefox

[BartXZX]

Describe the bug I notice that the workflow list is scrolling laggy on Firefox and this doesn't seem to be the case on chrome. This seems to have been introduced in ui-server 2.14.0 as it does not happen on 2.13.0.

(not sure if related because this happens on 2.13.0 also) I also noticed that it uses quite a lot of CPU for just displaying a few animation (the ones for running workflows). I just have the tab open and I'm not scrolling and it's using 30% of my CPU. Stopping all running workflows reduces CPU usage to 0%, but the scrolling still feels a little sluggish. Maybe it helps, but doesn't completely fix it.

To Reproduce

1. Start ui-server version 2.14.0 or newer and make sure to have quite a few workflows in the history.
2. Using the latest , scroll though the list and notice that it is laggy.

Expected behavior A fluent scrolling experience.

Desktop (please complete the following information):

• OS: Windows 11
• Firefox 116.0.3 (latest according to about page)
• ui-server version >= 2.14.0

[BartXZX]

Small update: It looks like it has something to do with the refresh rate of my monitor. On 144hz its using high CPU, and if I turn it all the way down to 25hz it uses 1~5% continuously. Maybe it tries to redraw at 144 fps?

[rorueda]

I also noticed a high CPU usage and verified most of it is spent on rendering (it's easy to see using the Firefox profiler). It takes only one running workflow svg/css animation to make Firefox take half a CPU core, and in the workflow history it can take a whole CPU core depending on what is being rendered.

I tried updating to the last version but the issue only got worse as it seems that more animations were added.

I also tested in Chrome and although it uses less CPU, it still seems too much.

Processor: i7 10th gen OS: Ubuntu 22.04.4 Firefox 130.0.1 (64-bit) Temporal UI 2.27.3, 2.31.1