Closed Bug 1646410 Opened 5 years ago Closed 3 years ago

Slack frequently hangs 500ms when hovering chat lines, and generally poor performance on Slack when many messages are loaded

Categories

(Web Compatibility :: Site Reports, defect)

Product:
Web Compatibility
Component:
Site Reports
Type:
defect

Tracking

(Not tracked)

Status:
RESOLVED WORKSFORME

People

(Reporter: Harald, Unassigned)

References

Details

(Keywords: webcompat:site-wait)

Basic information

Steps to Reproduce: Slack chat with 500+ people and several typing.

Expected Results: Smooth Slack experience

Actual Results: Slack acts really sluggish when hovering and typing, profiler shows 500ms+ hangs triggered by rFA.

More information

Profile URL: https://share.firefox.dev/37BG3YV

Events don't seen to be involved. FrameRequestCallback does seem to run a lot of baseline code.

See Also: → 1646424

Do we have evidence that Chrome is faster in this scenario? Otherwise, based on the profile, I'd say it's just Slack doing slow things.

I ran Slack in Chrome for 10min, browsing various channels, search and chatting without any noticeable lag.

Maybe we can survey users who run Slack in Electron (which I assume many do within Mozilla) and see if they have performance issues.

Can you capture a profile in Chrome, so that we can compare?

Flags: needinfo?(hkirschner)

I found a difference between the DOM sizes in Firefox and Chrome.
In Chrome, the virtual list for the messages only contains the messages that are on the screen.
In Firefox, the virtual list contains all messages that were loaded.
In my case, .c-virtual_list__scroll_container is currently around 20000px high in both browsers, but contains 8 child nodes in Chrome and 191 child nodes in Firefox.

Mike, can you reach out to Slack? Their virtual list is no longer virtual. In Firefox, all loaded messages are always in the DOM. This in turn makes React updates very expensive and slows everything down.

Flags: needinfo?(miket)

Yep, I just sent an email to my contact who works on front-end perf at Slack.

Flags: needinfo?(miket)

Thanks!

Component: Performance → Desktop
Flags: needinfo?(hkirschner)
Product: Core → Web Compatibility
Summary: Slack frequently hangs 500ms when hovering chat lines → Slack frequently hangs 500ms when hovering chat lines, and generally poor performance on Slack when many messages are loaded

Any update from slack?

I reported the issue in our slack internal page.
https://mycompany.slack.com/intl/en-ro/help/requests

We did get an update from Slack in July. Apologies for not updating this bug.

The different behavior in Firefox is a workaround for an APZ issue with updating the scrollTop property: In Firefox, setting scrollTop interrupts smooth scroll animations. I advised them to switch to scrollBy, which does not have this problem. I am not sure if they have followed this advice.

I have filed bug 1692708 for the scrollTop issue. Once that's fixed, we can ask Slack to enable their fast path for Firefox.

Depends on: 1692708

I was not able to reproduce the issue.

Markus, is the issue still reproducible for you?

Tested with:

Browser / Version: Firefox Release 100.0.2 (64-bit)/ Firefox Nightly 103.0a1 (2022-05-30) (64-bit)
Operating System: Windows 10 PRO x64

Flags: needinfo?(mstange.moz)

I cannot reproduce this issue at the moment. If I scroll up in a channel with a fair amount of history, I can see the messages at the bottom being unloaded; when I scroll back down I need to wait for them to load again. So it seems that the list is kept small even in Firefox now.

Status: NEW → RESOLVED
Closed: 3 years ago
Flags: needinfo?(mstange.moz)
Resolution: --- → WORKSFORME
You need to log in before you can comment on or make changes to this bug.