-
-
Notifications
You must be signed in to change notification settings - Fork 2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Scrolling the room list is laggy 🐌 #21262
Closed
Labels
A-Performance
A-Room-List
O-Uncommon
Most users are unlikely to come across this or unexpected workflow
S-Minor
Impairs non-critical functionality or suitable workarounds exist
T-Defect
Comments
MadLittleMods
added
A-Performance
A-Room-List
O-Uncommon
Most users are unlikely to come across this or unexpected workflow
S-Minor
Impairs non-critical functionality or suitable workarounds exist
T-Defect
labels
Mar 2, 2022
MadLittleMods
added a commit
to matrix-org/matrix-react-sdk
that referenced
this issue
Mar 2, 2022
Fix element-hq/element-web#21262 Optimizations: 1. Don't update the `style` (positioning) of hidden tooltips 1. Don't add DOM elements to the page for hidden tooltips > ## Performance problems broken down > > > ### Hidden tooltips rendering on `scroll` > > You can see that the Tooltip render is attached to the `scroll` event at [`src/components/views/elements/Tooltip.tsx#L78-L81`](https://github.com/matrix-org/matrix-react-sdk/blob/31f0a37ca2eeba6a6296787f2fcb33c4b26efebc/src/components/views/elements/Tooltip.tsx#L78-L81) > > The rendering calls [`src/components/views/elements/Tooltip.tsx#L101` -> `updatePosition`](https://github.com/matrix-org/matrix-react-sdk/blob/36adba101caf58afd280e6eedad003b38165be4f/src/components/views/elements/Tooltip.tsx#L101) which ends up as an expensive "Recalculate Style" because it uses [`Element.getBoundingClientRect()`](https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect). This happens many many times within a single `scroll` event. Probably once for each tooltip within the room list **even though no tooltips are event visible as I scroll**. I can see that we're just updating the `style` attribute for a bunch of `.mx_Tooltip_invisible` elements at the end of the document. > > Each one of the purple spans below the `scroll` span ends up as a call to `updatePosition`. And a `scroll` event takes 35ms to 60ms to complete which is way over the 16.6ms 60 FPS budget (on a powerful desktop PC), granted these times are with the performance profiling running. This is without the Passbolt extension explained below. > > And the room list contains about 141 rooms (`document.querySelectorAll('.mx_RoomTile').length`): > > ![](https://user-images.githubusercontent.com/558581/156273551-e744d3d6-93c6-4b07-bb12-6aad361f96a2.png) > > > > ### Passbolt Chrome browser extension exacerbates the problem > > In order to login to Passbolt, it requires a browser extension which defaults to mucking up all pages: > > <img src="https://user-images.githubusercontent.com/558581/156275644-bc26b1f5-5d99-4eae-b74b-c2028f2f1baf.png" width="300"> > > > The extension source seems to be available: https://github.com/passbolt/passbolt_browser_extension > > The Passbolt Chrome extension has a `MutationObserver` listening to all attribute and element changes to the whole `<body>` of the `document` so it can `findAndSetAuthenticationFields` (find form elements and autofill). > > > [`passbolt/passbolt_styleguide` -> `src/react-web-integration/lib/InForm/InFormManager.js#L143`](https://github.com/passbolt/passbolt_styleguide/blob/1c5eddc9102c7cd1029d10dc6836af4722cdba61/src/react-web-integration/lib/InForm/InFormManager.js#L143) > ```js > this.mutationObserver.observe(document.body, { attributes: true, childList: true, subtree: true }); > ``` > > This causes a bunch of `Forced reflow` because the Tooltip `updatePosition` is mutating the element `style` attribute and Passbolt `MutationObserver` callbacks are querying the whole DOM looking for form elements all in the same frame. > > Under the `scroll` event, all of the little spans are the `MutationObserver` -> `findAndSetAuthenticationFields`. With the Passbolt extension, scrolling is verrrrry crunchy and bad. > > ![](https://user-images.githubusercontent.com/558581/156144998-8cf7686f-3c7b-42f8-8d81-ff780bae0ab5.png) > > > #### Workaround > > Instead of running Passbolt on all sites, we can enable the extension to only run on the domain for Passbolt instance itself. I'm guessing the Passbolt extension also does autofill stuff on sites but I always login manually to the Passbolt instance so this solution works for me � > > **Extensions** -> **Passbolt** -> **Details** -> Change **Site access** to `On specific sites` -> Enter in your Passbolt instance `https://passbolt.example.com/` > > ![](https://user-images.githubusercontent.com/558581/156275630-a53ef6a1-c058-4ac9-aa08-ae50b90e72c9.png) > > *-- element-hq/element-web#21262
ooh, good catch! |
MadLittleMods
added a commit
to matrix-org/matrix-react-sdk
that referenced
this issue
Mar 2, 2022
Fix element-hq/element-web#21262 Optimizations: 1. Don't update the `style` (positioning) of hidden tooltips 1. Don't add DOM elements to the page for hidden tooltips > ## Performance problems broken down > > > ### Hidden tooltips rendering on `scroll` > > You can see that the Tooltip render is attached to the `scroll` event at [`src/components/views/elements/Tooltip.tsx#L78-L81`](https://github.com/matrix-org/matrix-react-sdk/blob/31f0a37ca2eeba6a6296787f2fcb33c4b26efebc/src/components/views/elements/Tooltip.tsx#L78-L81) > > The rendering calls [`src/components/views/elements/Tooltip.tsx#L101` -> `updatePosition`](https://github.com/matrix-org/matrix-react-sdk/blob/36adba101caf58afd280e6eedad003b38165be4f/src/components/views/elements/Tooltip.tsx#L101) which ends up as an expensive "Recalculate Style" because it uses [`Element.getBoundingClientRect()`](https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect). This happens many many times within a single `scroll` event. Probably once for each tooltip within the room list **even though no tooltips are event visible as I scroll**. I can see that we're just updating the `style` attribute for a bunch of `.mx_Tooltip_invisible` elements at the end of the document. > > Each one of the purple spans below the `scroll` span ends up as a call to `updatePosition`. And a `scroll` event takes 35ms to 60ms to complete which is way over the 16.6ms 60 FPS budget (on a powerful desktop PC), granted these times are with the performance profiling running. This is without the Passbolt extension explained below. > > And the room list contains about 141 rooms (`document.querySelectorAll('.mx_RoomTile').length`): > > ![](https://user-images.githubusercontent.com/558581/156273551-e744d3d6-93c6-4b07-bb12-6aad361f96a2.png) > > > > ### Passbolt Chrome browser extension exacerbates the problem > > In order to login to Passbolt, it requires a browser extension which defaults to mucking up all pages: > > <img src="https://user-images.githubusercontent.com/558581/156275644-bc26b1f5-5d99-4eae-b74b-c2028f2f1baf.png" width="300"> > > > The extension source seems to be available: https://github.com/passbolt/passbolt_browser_extension > > The Passbolt Chrome extension has a `MutationObserver` listening to all attribute and element changes to the whole `<body>` of the `document` so it can `findAndSetAuthenticationFields` (find form elements and autofill). > > > [`passbolt/passbolt_styleguide` -> `src/react-web-integration/lib/InForm/InFormManager.js#L143`](https://github.com/passbolt/passbolt_styleguide/blob/1c5eddc9102c7cd1029d10dc6836af4722cdba61/src/react-web-integration/lib/InForm/InFormManager.js#L143) > ```js > this.mutationObserver.observe(document.body, { attributes: true, childList: true, subtree: true }); > ``` > > This causes a bunch of `Forced reflow` because the Tooltip `updatePosition` is mutating the element `style` attribute and Passbolt `MutationObserver` callbacks are querying the whole DOM looking for form elements all in the same frame. > > Under the `scroll` event, all of the little spans are the `MutationObserver` -> `findAndSetAuthenticationFields`. With the Passbolt extension, scrolling is verrrrry crunchy and bad. > > ![](https://user-images.githubusercontent.com/558581/156144998-8cf7686f-3c7b-42f8-8d81-ff780bae0ab5.png) > > > #### Workaround > > Instead of running Passbolt on all sites, we can enable the extension to only run on the domain for Passbolt instance itself. I'm guessing the Passbolt extension also does autofill stuff on sites but I always login manually to the Passbolt instance so this solution works for me � > > **Extensions** -> **Passbolt** -> **Details** -> Change **Site access** to `On specific sites` -> Enter in your Passbolt instance `https://passbolt.example.com/` > > ![](https://user-images.githubusercontent.com/558581/156275630-a53ef6a1-c058-4ac9-aa08-ae50b90e72c9.png) > > *-- element-hq/element-web#21262
su-ex
added a commit
to SchildiChat/element-desktop
that referenced
this issue
Mar 17, 2022
* Fix a bug where URL previews could be enabled in the left-panel when they should not have been. * Add a config.json option to skip the built-in Jitsi welcome screen ([\#21190](element-hq/element-web#21190)). * Add unexposed account setting for hiding poll creation ([\#7972](matrix-org/matrix-react-sdk#7972)). * Allow pinning polls ([\#7922](matrix-org/matrix-react-sdk#7922)). Fixes element-hq/element-web#20152. * Make trailing `:` into a setting ([\#6711](matrix-org/matrix-react-sdk#6711)). Fixes element-hq/element-web#16682. Contributed by @SimonBrandner. * Location sharing > back button ([\#7958](matrix-org/matrix-react-sdk#7958)). * use LocationAssetType ([\#7965](matrix-org/matrix-react-sdk#7965)). * Location share type UI ([\#7924](matrix-org/matrix-react-sdk#7924)). * Add a few more UIComponent flags, and ensure they are used in existing code ([\#7937](matrix-org/matrix-react-sdk#7937)). * Add support for overriding strings in the app ([\#7886](matrix-org/matrix-react-sdk#7886)). * Add support for redirecting to external pages after logout ([\#7905](matrix-org/matrix-react-sdk#7905)). * Expose redaction power level in room settings ([\#7599](matrix-org/matrix-react-sdk#7599)). Fixes element-hq/element-web#20590. Contributed by @SimonBrandner. * Update and expand ways to access pinned messages ([\#7906](matrix-org/matrix-react-sdk#7906)). Fixes element-hq/element-web#21209 and element-hq/element-web#21211. * Add slash command to switch to a room's virtual room ([\#7839](matrix-org/matrix-react-sdk#7839)). * Remove Lojban translation ([\#21302](element-hq/element-web#21302)). * Merge pull request from GHSA-qmf4-7w7j-vf23 ([\#8059](matrix-org/matrix-react-sdk#8059)). * Add another null guard for member ([\#7984](matrix-org/matrix-react-sdk#7984)). Fixes element-hq/element-web#21319. * Fix room account settings ([\#7999](matrix-org/matrix-react-sdk#7999)). * Fix missing summary text for pinned message changes ([\#7989](matrix-org/matrix-react-sdk#7989)). Fixes element-hq/element-web#19823. * Pass room to getRoomTombstone to avoid racing with setState ([\#7986](matrix-org/matrix-react-sdk#7986)). * Hide composer and call buttons when the room is tombstoned ([\#7975](matrix-org/matrix-react-sdk#7975)). Fixes element-hq/element-web#21286. * Fix bad ternary statement in autocomplete user pill insertions ([\#7977](matrix-org/matrix-react-sdk#7977)). Fixes element-hq/element-web#21307. * Fix sending locations into threads and fix i18n ([\#7943](matrix-org/matrix-react-sdk#7943)). Fixes element-hq/element-web#21267. * Fix location map attribution rendering over message action bar ([\#7974](matrix-org/matrix-react-sdk#7974)). Fixes element-hq/element-web#21297. * Fix wrongly asserting that PushRule::conditions is non-null ([\#7973](matrix-org/matrix-react-sdk#7973)). Fixes element-hq/element-web#21305. * Fix account & room settings race condition ([\#7953](matrix-org/matrix-react-sdk#7953)). Fixes element-hq/element-web#21163. * Fix bug with some space selections not being applied ([\#7971](matrix-org/matrix-react-sdk#7971)). Fixes element-hq/element-web#21290. * Revert "replace all require(.svg) with esm import" ([\#7969](matrix-org/matrix-react-sdk#7969)). Fixes element-hq/element-web#21293. * Hide unpinnable pinned messages in more cases ([\#7921](matrix-org/matrix-react-sdk#7921)). * Fix room list being laggy while scrolling 🐌 ([\#7939](matrix-org/matrix-react-sdk#7939)). Fixes element-hq/element-web#21262. * Make pinned messages more reliably reflect edits ([\#7920](matrix-org/matrix-react-sdk#7920)). Fixes element-hq/element-web#17098. * Improve accessibility of the BetaPill ([\#7949](matrix-org/matrix-react-sdk#7949)). Fixes element-hq/element-web#21255. * Autofocus correct composer after sending reaction ([\#7950](matrix-org/matrix-react-sdk#7950)). Fixes element-hq/element-web#21273. * Consider polls as message events for rendering redactions ([\#7944](matrix-org/matrix-react-sdk#7944)). Fixes element-hq/element-web#21125. * Prevent event tiles being shrunk/collapsed by flexbox ([\#7942](matrix-org/matrix-react-sdk#7942)). Fixes element-hq/element-web#21269. * Fix ExportDialog title on export cancellation ([\#7936](matrix-org/matrix-react-sdk#7936)). Fixes element-hq/element-web#21260. Contributed by @luixxiul. * Mandate use of js-sdk/src/matrix import over js-sdk/src ([\#7933](matrix-org/matrix-react-sdk#7933)). Fixes element-hq/element-web#21253. * Fix backspace not working in the invite dialog ([\#7931](matrix-org/matrix-react-sdk#7931)). Fixes element-hq/element-web#21249. Contributed by @SimonBrandner. * Fix right panel soft crashes due to missing room prop ([\#7923](matrix-org/matrix-react-sdk#7923)). Fixes element-hq/element-web#21243. * fix color of location share caret ([\#7917](matrix-org/matrix-react-sdk#7917)). * Wrap all EventTiles with a TileErrorBoundary and guard parsePermalink ([\#7916](matrix-org/matrix-react-sdk#7916)). Fixes element-hq/element-web#21216. * Fix changing space sometimes bouncing to the wrong space ([\#7910](matrix-org/matrix-react-sdk#7910)). Fixes element-hq/element-web#20425. * Ensure EventListSummary key does not change during backpagination ([\#7915](matrix-org/matrix-react-sdk#7915)). Fixes element-hq/element-web#9192. * Fix positioning of the thread context menu ([\#7918](matrix-org/matrix-react-sdk#7918)). Fixes element-hq/element-web#21236. * Inject sender into pinned messages ([\#7904](matrix-org/matrix-react-sdk#7904)). Fixes element-hq/element-web#20314. * Tweak info message padding in right panel timeline ([\#7901](matrix-org/matrix-react-sdk#7901)). Fixes element-hq/element-web#21212. * Fix another freeze on room switch ([\#7900](matrix-org/matrix-react-sdk#7900)). Fixes element-hq/element-web#21127. * Clean up error listener when location picker closes ([\#7902](matrix-org/matrix-react-sdk#7902)). Fixes element-hq/element-web#21213. * Fix edge case in context menu chevron positioning ([\#7899](matrix-org/matrix-react-sdk#7899)). * Fix composer format buttons on WebKit ([\#7898](matrix-org/matrix-react-sdk#7898)). Fixes element-hq/element-web#20868. * manage voicerecording state when deleting or sending a voice message ([\#7896](matrix-org/matrix-react-sdk#7896)). Fixes element-hq/element-web#21151. * Fix bug with useRoomHierarchy tight-looping loadMore on error ([\#7893](matrix-org/matrix-react-sdk#7893)). * Fix upload button & shortcut not working for narrow composer mode ([\#7894](matrix-org/matrix-react-sdk#7894)). Fixes element-hq/element-web#21175 and element-hq/element-web#21142. * Fix emoji insertion in thread composer going to the main composer ([\#7895](matrix-org/matrix-react-sdk#7895)). Fixes element-hq/element-web#21202. * Try harder to keep context menus inside the window ([\#7863](matrix-org/matrix-react-sdk#7863)). Fixes element-hq/element-web#17527 and element-hq/element-web#18377. * Fix edge case around event list summary layout ([\#7891](matrix-org/matrix-react-sdk#7891)). Fixes element-hq/element-web#21180. * Fix event list summary 1 hidden message pluralisation ([\#7890](matrix-org/matrix-react-sdk#7890)). Fixes element-hq/element-web#21196. * Fix vanishing recently viewed menu ([\#7887](matrix-org/matrix-react-sdk#7887)). Fixes element-hq/element-web#20827. * Fix freeze on room switch ([\#7884](matrix-org/matrix-react-sdk#7884)). Fixes element-hq/element-web#21127. * Check 'useSystemTheme' in quick settings theme switcher ([\#7809](matrix-org/matrix-react-sdk#7809)). Fixes element-hq/element-web#21061. * Fix 'my threads' filtering to include participated threads ([\#7882](matrix-org/matrix-react-sdk#7882)). Fixes element-hq/element-web#20877. * Remove log line to try to fix freeze on answering VoIP call ([\#7883](matrix-org/matrix-react-sdk#7883)). * Support social login & password on soft logout page ([\#7879](matrix-org/matrix-react-sdk#7879)). Fixes element-hq/element-web#21099. * Fix missing padding on server picker ([\#7864](matrix-org/matrix-react-sdk#7864)). * Throttle RoomState.members handlers ([\#7876](matrix-org/matrix-react-sdk#7876)). Fixes element-hq/element-web#21127. * Only show joined/invited in search dialog ([\#7875](matrix-org/matrix-react-sdk#7875)). Fixes element-hq/element-web#21161. * Don't pillify code blocks ([\#7861](matrix-org/matrix-react-sdk#7861)). Fixes element-hq/element-web#20851 and element-hq/element-web#18687. * Fix keyboard shortcut icons on macOS ([\#7869](matrix-org/matrix-react-sdk#7869)).
su-ex
added a commit
to SchildiChat/element-web
that referenced
this issue
Mar 17, 2022
* Fix a bug where URL previews could be enabled in the left-panel when they should not have been. * Add a config.json option to skip the built-in Jitsi welcome screen ([\element-hq#21190](element-hq#21190)). * Add unexposed account setting for hiding poll creation ([\#7972](matrix-org/matrix-react-sdk#7972)). * Allow pinning polls ([\element-hq#7922](matrix-org/matrix-react-sdk#7922)). Fixes element-hq#20152. * Make trailing `:` into a setting ([\element-hq#6711](matrix-org/matrix-react-sdk#6711)). Fixes element-hq#16682. Contributed by @SimonBrandner. * Location sharing > back button ([\element-hq#7958](matrix-org/matrix-react-sdk#7958)). * use LocationAssetType ([\element-hq#7965](matrix-org/matrix-react-sdk#7965)). * Location share type UI ([\element-hq#7924](matrix-org/matrix-react-sdk#7924)). * Add a few more UIComponent flags, and ensure they are used in existing code ([\element-hq#7937](matrix-org/matrix-react-sdk#7937)). * Add support for overriding strings in the app ([\element-hq#7886](matrix-org/matrix-react-sdk#7886)). * Add support for redirecting to external pages after logout ([\element-hq#7905](matrix-org/matrix-react-sdk#7905)). * Expose redaction power level in room settings ([\element-hq#7599](matrix-org/matrix-react-sdk#7599)). Fixes element-hq#20590. Contributed by @SimonBrandner. * Update and expand ways to access pinned messages ([\#7906](matrix-org/matrix-react-sdk#7906)). Fixes element-hq#21209 and element-hq#21211. * Add slash command to switch to a room's virtual room ([\element-hq#7839](matrix-org/matrix-react-sdk#7839)). * Remove Lojban translation ([\element-hq#21302](element-hq#21302)). * Merge pull request from GHSA-qmf4-7w7j-vf23 ([\element-hq#8059](matrix-org/matrix-react-sdk#8059)). * Add another null guard for member ([\element-hq#7984](matrix-org/matrix-react-sdk#7984)). Fixes element-hq#21319. * Fix room account settings ([\element-hq#7999](matrix-org/matrix-react-sdk#7999)). * Fix missing summary text for pinned message changes ([\element-hq#7989](matrix-org/matrix-react-sdk#7989)). Fixes element-hq#19823. * Pass room to getRoomTombstone to avoid racing with setState ([\element-hq#7986](matrix-org/matrix-react-sdk#7986)). * Hide composer and call buttons when the room is tombstoned ([\element-hq#7975](matrix-org/matrix-react-sdk#7975)). Fixes element-hq#21286. * Fix bad ternary statement in autocomplete user pill insertions ([\element-hq#7977](matrix-org/matrix-react-sdk#7977)). Fixes element-hq#21307. * Fix sending locations into threads and fix i18n ([\element-hq#7943](matrix-org/matrix-react-sdk#7943)). Fixes element-hq#21267. * Fix location map attribution rendering over message action bar ([\element-hq#7974](matrix-org/matrix-react-sdk#7974)). Fixes element-hq#21297. * Fix wrongly asserting that PushRule::conditions is non-null ([\element-hq#7973](matrix-org/matrix-react-sdk#7973)). Fixes element-hq#21305. * Fix account & room settings race condition ([\element-hq#7953](matrix-org/matrix-react-sdk#7953)). Fixes element-hq#21163. * Fix bug with some space selections not being applied ([\element-hq#7971](matrix-org/matrix-react-sdk#7971)). Fixes element-hq#21290. * Revert "replace all require(.svg) with esm import" ([\element-hq#7969](matrix-org/matrix-react-sdk#7969)). Fixes element-hq#21293. * Hide unpinnable pinned messages in more cases ([\element-hq#7921](matrix-org/matrix-react-sdk#7921)). * Fix room list being laggy while scrolling 🐌 ([\element-hq#7939](matrix-org/matrix-react-sdk#7939)). Fixes element-hq#21262. * Make pinned messages more reliably reflect edits ([\element-hq#7920](matrix-org/matrix-react-sdk#7920)). Fixes element-hq#17098. * Improve accessibility of the BetaPill ([\element-hq#7949](matrix-org/matrix-react-sdk#7949)). Fixes element-hq#21255. * Autofocus correct composer after sending reaction ([\element-hq#7950](matrix-org/matrix-react-sdk#7950)). Fixes element-hq#21273. * Consider polls as message events for rendering redactions ([\element-hq#7944](matrix-org/matrix-react-sdk#7944)). Fixes element-hq#21125. * Prevent event tiles being shrunk/collapsed by flexbox ([\element-hq#7942](matrix-org/matrix-react-sdk#7942)). Fixes element-hq#21269. * Fix ExportDialog title on export cancellation ([\element-hq#7936](matrix-org/matrix-react-sdk#7936)). Fixes element-hq#21260. Contributed by @luixxiul. * Mandate use of js-sdk/src/matrix import over js-sdk/src ([\element-hq#7933](matrix-org/matrix-react-sdk#7933)). Fixes element-hq#21253. * Fix backspace not working in the invite dialog ([\element-hq#7931](matrix-org/matrix-react-sdk#7931)). Fixes element-hq#21249. Contributed by @SimonBrandner. * Fix right panel soft crashes due to missing room prop ([\element-hq#7923](matrix-org/matrix-react-sdk#7923)). Fixes element-hq#21243. * fix color of location share caret ([\element-hq#7917](matrix-org/matrix-react-sdk#7917)). * Wrap all EventTiles with a TileErrorBoundary and guard parsePermalink ([\element-hq#7916](matrix-org/matrix-react-sdk#7916)). Fixes element-hq#21216. * Fix changing space sometimes bouncing to the wrong space ([\element-hq#7910](matrix-org/matrix-react-sdk#7910)). Fixes element-hq#20425. * Ensure EventListSummary key does not change during backpagination ([\element-hq#7915](matrix-org/matrix-react-sdk#7915)). Fixes element-hq#9192. * Fix positioning of the thread context menu ([\element-hq#7918](matrix-org/matrix-react-sdk#7918)). Fixes element-hq#21236. * Inject sender into pinned messages ([\element-hq#7904](matrix-org/matrix-react-sdk#7904)). Fixes element-hq#20314. * Tweak info message padding in right panel timeline ([\#7901](matrix-org/matrix-react-sdk#7901)). Fixes element-hq#21212. * Fix another freeze on room switch ([\#7900](matrix-org/matrix-react-sdk#7900)). Fixes element-hq#21127. * Fix out of memory error when failing to acquire location ([\element-hq#7902](matrix-org/matrix-react-sdk#7902)). Fixes element-hq#21213. * Fix edge case in context menu chevron positioning ([\element-hq#7899](matrix-org/matrix-react-sdk#7899)). * Fix composer format buttons on WebKit ([\element-hq#7898](matrix-org/matrix-react-sdk#7898)). Fixes element-hq#20868. * manage voicerecording state when deleting or sending a voice message ([\element-hq#7896](matrix-org/matrix-react-sdk#7896)). Fixes element-hq#21151. * Fix bug with useRoomHierarchy tight-looping loadMore on error ([\element-hq#7893](matrix-org/matrix-react-sdk#7893)). * Fix upload button & shortcut not working for narrow composer mode ([\element-hq#7894](matrix-org/matrix-react-sdk#7894)). Fixes element-hq#21175 and element-hq#21142. * Fix emoji insertion in thread composer going to the main composer ([\element-hq#7895](matrix-org/matrix-react-sdk#7895)). Fixes element-hq#21202. * Try harder to keep context menus inside the window ([\element-hq#7863](matrix-org/matrix-react-sdk#7863)). Fixes element-hq#17527 and element-hq#18377. * Fix edge case around event list summary layout ([\element-hq#7891](matrix-org/matrix-react-sdk#7891)). Fixes element-hq#21180. * Fix event list summary 1 hidden message pluralisation ([\element-hq#7890](matrix-org/matrix-react-sdk#7890)). Fixes element-hq#21196. * Fix vanishing recently viewed menu ([\element-hq#7887](matrix-org/matrix-react-sdk#7887)). Fixes element-hq#20827. * Fix freeze on room switch ([\element-hq#7884](matrix-org/matrix-react-sdk#7884)). Fixes element-hq#21127. * Check 'useSystemTheme' in quick settings theme switcher ([\element-hq#7809](matrix-org/matrix-react-sdk#7809)). Fixes element-hq#21061. * Fix 'my threads' filtering to include participated threads ([\element-hq#7882](matrix-org/matrix-react-sdk#7882)). Fixes element-hq#20877. * Remove log line to try to fix freeze on answering VoIP call ([\element-hq#7883](matrix-org/matrix-react-sdk#7883)). * Support social login & password on soft logout page ([\element-hq#7879](matrix-org/matrix-react-sdk#7879)). Fixes element-hq#21099. * Fix missing padding on server picker ([\element-hq#7864](matrix-org/matrix-react-sdk#7864)). * Throttle RoomState.members handlers ([\element-hq#7876](matrix-org/matrix-react-sdk#7876)). Fixes element-hq#21127. * Only show joined/invited in search dialog ([\element-hq#7875](matrix-org/matrix-react-sdk#7875)). Fixes element-hq#21161. * Don't pillify code blocks ([\element-hq#7861](matrix-org/matrix-react-sdk#7861)). Fixes element-hq#20851 and element-hq#18687. * Fix keyboard shortcut icons on macOS ([\element-hq#7869](matrix-org/matrix-react-sdk#7869)).
su-ex
added a commit
to SchildiChat/matrix-react-sdk
that referenced
this issue
Mar 17, 2022
* Fix a bug where URL previews could be enabled in the left-panel when they should not have been. * Add unexposed account setting for hiding poll creation ([\matrix-org#7972](matrix-org#7972)). * Allow pinning polls ([\matrix-org#7922](matrix-org#7922)). Fixes element-hq/element-web#20152. * Make trailing `:` into a setting ([\matrix-org#6711](matrix-org#6711)). Fixes element-hq/element-web#16682. Contributed by @SimonBrandner. * Location sharing > back button ([\matrix-org#7958](matrix-org#7958)). * use LocationAssetType ([\matrix-org#7965](matrix-org#7965)). * Location share type UI ([\matrix-org#7924](matrix-org#7924)). * Add a few more UIComponent flags, and ensure they are used in existing code ([\matrix-org#7937](matrix-org#7937)). * Add support for overriding strings in the app ([\matrix-org#7886](matrix-org#7886)). * Add support for redirecting to external pages after logout ([\matrix-org#7905](matrix-org#7905)). * Expose redaction power level in room settings ([\matrix-org#7599](matrix-org#7599)). Fixes element-hq/element-web#20590. Contributed by @SimonBrandner. * Update and expand ways to access pinned messages ([\matrix-org#7906](matrix-org#7906)). Fixes element-hq/element-web#21209 and element-hq/element-web#21211. * Add slash command to switch to a room's virtual room ([\matrix-org#7839](matrix-org#7839)). * Merge pull request from GHSA-qmf4-7w7j-vf23 ([\matrix-org#8059](matrix-org#8059)). * Add another null guard for member ([\matrix-org#7984](matrix-org#7984)). Fixes element-hq/element-web#21319. * Fix room account settings ([\matrix-org#7999](matrix-org#7999)). * Fix missing summary text for pinned message changes ([\matrix-org#7989](matrix-org#7989)). Fixes element-hq/element-web#19823. * Pass room to getRoomTombstone to avoid racing with setState ([\matrix-org#7986](matrix-org#7986)). * Hide composer and call buttons when the room is tombstoned ([\matrix-org#7975](matrix-org#7975)). Fixes element-hq/element-web#21286. * Fix bad ternary statement in autocomplete user pill insertions ([\matrix-org#7977](matrix-org#7977)). Fixes element-hq/element-web#21307. * Fix sending locations into threads and fix i18n ([\matrix-org#7943](matrix-org#7943)). Fixes element-hq/element-web#21267. * Fix location map attribution rendering over message action bar ([\matrix-org#7974](matrix-org#7974)). Fixes element-hq/element-web#21297. * Fix wrongly asserting that PushRule::conditions is non-null ([\matrix-org#7973](matrix-org#7973)). Fixes element-hq/element-web#21305. * Fix account & room settings race condition ([\matrix-org#7953](matrix-org#7953)). Fixes element-hq/element-web#21163. * Fix bug with some space selections not being applied ([\matrix-org#7971](matrix-org#7971)). Fixes element-hq/element-web#21290. * Revert "replace all require(.svg) with esm import" ([\matrix-org#7969](matrix-org#7969)). Fixes element-hq/element-web#21293. * Hide unpinnable pinned messages in more cases ([\matrix-org#7921](matrix-org#7921)). * Fix room list being laggy while scrolling 🐌 ([\matrix-org#7939](matrix-org#7939)). Fixes element-hq/element-web#21262. * Make pinned messages more reliably reflect edits ([\matrix-org#7920](matrix-org#7920)). Fixes element-hq/element-web#17098. * Improve accessibility of the BetaPill ([\matrix-org#7949](matrix-org#7949)). Fixes element-hq/element-web#21255. * Autofocus correct composer after sending reaction ([\matrix-org#7950](matrix-org#7950)). Fixes element-hq/element-web#21273. * Consider polls as message events for rendering redactions ([\matrix-org#7944](matrix-org#7944)). Fixes element-hq/element-web#21125. * Prevent event tiles being shrunk/collapsed by flexbox ([\matrix-org#7942](matrix-org#7942)). Fixes element-hq/element-web#21269. * Fix ExportDialog title on export cancellation ([\matrix-org#7936](matrix-org#7936)). Fixes element-hq/element-web#21260. Contributed by @luixxiul. * Mandate use of js-sdk/src/matrix import over js-sdk/src ([\matrix-org#7933](matrix-org#7933)). Fixes element-hq/element-web#21253. * Fix backspace not working in the invite dialog ([\matrix-org#7931](matrix-org#7931)). Fixes element-hq/element-web#21249. Contributed by @SimonBrandner. * Fix right panel soft crashes due to missing room prop ([\matrix-org#7923](matrix-org#7923)). Fixes element-hq/element-web#21243. * fix color of location share caret ([\matrix-org#7917](matrix-org#7917)). * Wrap all EventTiles with a TileErrorBoundary and guard parsePermalink ([\matrix-org#7916](matrix-org#7916)). Fixes element-hq/element-web#21216. * Fix changing space sometimes bouncing to the wrong space ([\matrix-org#7910](matrix-org#7910)). Fixes element-hq/element-web#20425. * Ensure EventListSummary key does not change during backpagination ([\matrix-org#7915](matrix-org#7915)). Fixes element-hq/element-web#9192. * Fix positioning of the thread context menu ([\matrix-org#7918](matrix-org#7918)). Fixes element-hq/element-web#21236. * Inject sender into pinned messages ([\matrix-org#7904](matrix-org#7904)). Fixes element-hq/element-web#20314. * Tweak info message padding in right panel timeline ([\matrix-org#7901](matrix-org#7901)). Fixes element-hq/element-web#21212. * Fix another freeze on room switch ([\matrix-org#7900](matrix-org#7900)). Fixes element-hq/element-web#21127. * Clean up error listener when location picker closes ([\matrix-org#7902](matrix-org#7902)). Fixes element-hq/element-web#21213. * Fix edge case in context menu chevron positioning ([\matrix-org#7899](matrix-org#7899)). * Fix composer format buttons on WebKit ([\matrix-org#7898](matrix-org#7898)). Fixes element-hq/element-web#20868. * manage voicerecording state when deleting or sending a voice message ([\matrix-org#7896](matrix-org#7896)). Fixes element-hq/element-web#21151. * Fix bug with useRoomHierarchy tight-looping loadMore on error ([\matrix-org#7893](matrix-org#7893)). * Fix upload button & shortcut not working for narrow composer mode ([\matrix-org#7894](matrix-org#7894)). Fixes element-hq/element-web#21175 and element-hq/element-web#21142. * Fix emoji insertion in thread composer going to the main composer ([\matrix-org#7895](matrix-org#7895)). Fixes element-hq/element-web#21202. * Try harder to keep context menus inside the window ([\matrix-org#7863](matrix-org#7863)). Fixes element-hq/element-web#17527 and element-hq/element-web#18377. * Fix edge case around event list summary layout ([\matrix-org#7891](matrix-org#7891)). Fixes element-hq/element-web#21180. * Fix event list summary 1 hidden message pluralisation ([\matrix-org#7890](matrix-org#7890)). Fixes element-hq/element-web#21196. * Fix vanishing recently viewed menu ([\matrix-org#7887](matrix-org#7887)). Fixes element-hq/element-web#20827. * Fix freeze on room switch ([\matrix-org#7884](matrix-org#7884)). Fixes element-hq/element-web#21127. * Check 'useSystemTheme' in quick settings theme switcher ([\matrix-org#7809](matrix-org#7809)). Fixes element-hq/element-web#21061. * Fix 'my threads' filtering to include participated threads ([\matrix-org#7882](matrix-org#7882)). Fixes element-hq/element-web#20877. * Remove log line to try to fix freeze on answering VoIP call ([\matrix-org#7883](matrix-org#7883)). * Support social login & password on soft logout page ([\matrix-org#7879](matrix-org#7879)). Fixes element-hq/element-web#21099. * Fix missing padding on server picker ([\matrix-org#7864](matrix-org#7864)). * Throttle RoomState.members handlers ([\matrix-org#7876](matrix-org#7876)). Fixes element-hq/element-web#21127. * Only show joined/invited in search dialog ([\matrix-org#7875](matrix-org#7875)). Fixes element-hq/element-web#21161. * Don't pillify code blocks ([\matrix-org#7861](matrix-org#7861)). Fixes element-hq/element-web#20851 and element-hq/element-web#18687. * Fix keyboard shortcut icons on macOS ([\matrix-org#7869](matrix-org#7869)).
su-ex
added a commit
to SchildiChat/element-desktop
that referenced
this issue
Apr 1, 2022
* Fix a bug where URL previews could be enabled in the left-panel when they should not have been. * Add a config.json option to skip the built-in Jitsi welcome screen ([\#21190](element-hq/element-web#21190)). * Add unexposed account setting for hiding poll creation ([\#7972](matrix-org/matrix-react-sdk#7972)). * Allow pinning polls ([\#7922](matrix-org/matrix-react-sdk#7922)). Fixes element-hq/element-web#20152. * Make trailing `:` into a setting ([\#6711](matrix-org/matrix-react-sdk#6711)). Fixes element-hq/element-web#16682. Contributed by @SimonBrandner. * Location sharing > back button ([\#7958](matrix-org/matrix-react-sdk#7958)). * use LocationAssetType ([\#7965](matrix-org/matrix-react-sdk#7965)). * Location share type UI ([\#7924](matrix-org/matrix-react-sdk#7924)). * Add a few more UIComponent flags, and ensure they are used in existing code ([\#7937](matrix-org/matrix-react-sdk#7937)). * Add support for overriding strings in the app ([\#7886](matrix-org/matrix-react-sdk#7886)). * Add support for redirecting to external pages after logout ([\#7905](matrix-org/matrix-react-sdk#7905)). * Expose redaction power level in room settings ([\#7599](matrix-org/matrix-react-sdk#7599)). Fixes element-hq/element-web#20590. Contributed by @SimonBrandner. * Update and expand ways to access pinned messages ([\#7906](matrix-org/matrix-react-sdk#7906)). Fixes element-hq/element-web#21209 and element-hq/element-web#21211. * Add slash command to switch to a room's virtual room ([\#7839](matrix-org/matrix-react-sdk#7839)). * Remove Lojban translation ([\#21302](element-hq/element-web#21302)). * Merge pull request from GHSA-qmf4-7w7j-vf23 ([\#8059](matrix-org/matrix-react-sdk#8059)). * Add another null guard for member ([\#7984](matrix-org/matrix-react-sdk#7984)). Fixes element-hq/element-web#21319. * Fix room account settings ([\#7999](matrix-org/matrix-react-sdk#7999)). * Fix missing summary text for pinned message changes ([\#7989](matrix-org/matrix-react-sdk#7989)). Fixes element-hq/element-web#19823. * Pass room to getRoomTombstone to avoid racing with setState ([\#7986](matrix-org/matrix-react-sdk#7986)). * Hide composer and call buttons when the room is tombstoned ([\#7975](matrix-org/matrix-react-sdk#7975)). Fixes element-hq/element-web#21286. * Fix bad ternary statement in autocomplete user pill insertions ([\#7977](matrix-org/matrix-react-sdk#7977)). Fixes element-hq/element-web#21307. * Fix sending locations into threads and fix i18n ([\#7943](matrix-org/matrix-react-sdk#7943)). Fixes element-hq/element-web#21267. * Fix location map attribution rendering over message action bar ([\#7974](matrix-org/matrix-react-sdk#7974)). Fixes element-hq/element-web#21297. * Fix wrongly asserting that PushRule::conditions is non-null ([\#7973](matrix-org/matrix-react-sdk#7973)). Fixes element-hq/element-web#21305. * Fix account & room settings race condition ([\#7953](matrix-org/matrix-react-sdk#7953)). Fixes element-hq/element-web#21163. * Fix bug with some space selections not being applied ([\#7971](matrix-org/matrix-react-sdk#7971)). Fixes element-hq/element-web#21290. * Revert "replace all require(.svg) with esm import" ([\#7969](matrix-org/matrix-react-sdk#7969)). Fixes element-hq/element-web#21293. * Hide unpinnable pinned messages in more cases ([\#7921](matrix-org/matrix-react-sdk#7921)). * Fix room list being laggy while scrolling 🐌 ([\#7939](matrix-org/matrix-react-sdk#7939)). Fixes element-hq/element-web#21262. * Make pinned messages more reliably reflect edits ([\#7920](matrix-org/matrix-react-sdk#7920)). Fixes element-hq/element-web#17098. * Improve accessibility of the BetaPill ([\#7949](matrix-org/matrix-react-sdk#7949)). Fixes element-hq/element-web#21255. * Autofocus correct composer after sending reaction ([\#7950](matrix-org/matrix-react-sdk#7950)). Fixes element-hq/element-web#21273. * Consider polls as message events for rendering redactions ([\#7944](matrix-org/matrix-react-sdk#7944)). Fixes element-hq/element-web#21125. * Prevent event tiles being shrunk/collapsed by flexbox ([\#7942](matrix-org/matrix-react-sdk#7942)). Fixes element-hq/element-web#21269. * Fix ExportDialog title on export cancellation ([\#7936](matrix-org/matrix-react-sdk#7936)). Fixes element-hq/element-web#21260. Contributed by @luixxiul. * Mandate use of js-sdk/src/matrix import over js-sdk/src ([\#7933](matrix-org/matrix-react-sdk#7933)). Fixes element-hq/element-web#21253. * Fix backspace not working in the invite dialog ([\#7931](matrix-org/matrix-react-sdk#7931)). Fixes element-hq/element-web#21249. Contributed by @SimonBrandner. * Fix right panel soft crashes due to missing room prop ([\#7923](matrix-org/matrix-react-sdk#7923)). Fixes element-hq/element-web#21243. * fix color of location share caret ([\#7917](matrix-org/matrix-react-sdk#7917)). * Wrap all EventTiles with a TileErrorBoundary and guard parsePermalink ([\#7916](matrix-org/matrix-react-sdk#7916)). Fixes element-hq/element-web#21216. * Fix changing space sometimes bouncing to the wrong space ([\#7910](matrix-org/matrix-react-sdk#7910)). Fixes element-hq/element-web#20425. * Ensure EventListSummary key does not change during backpagination ([\#7915](matrix-org/matrix-react-sdk#7915)). Fixes element-hq/element-web#9192. * Fix positioning of the thread context menu ([\#7918](matrix-org/matrix-react-sdk#7918)). Fixes element-hq/element-web#21236. * Inject sender into pinned messages ([\#7904](matrix-org/matrix-react-sdk#7904)). Fixes element-hq/element-web#20314. * Tweak info message padding in right panel timeline ([\#7901](matrix-org/matrix-react-sdk#7901)). Fixes element-hq/element-web#21212. * Fix another freeze on room switch ([\#7900](matrix-org/matrix-react-sdk#7900)). Fixes element-hq/element-web#21127. * Clean up error listener when location picker closes ([\#7902](matrix-org/matrix-react-sdk#7902)). Fixes element-hq/element-web#21213. * Fix edge case in context menu chevron positioning ([\#7899](matrix-org/matrix-react-sdk#7899)). * Fix composer format buttons on WebKit ([\#7898](matrix-org/matrix-react-sdk#7898)). Fixes element-hq/element-web#20868. * manage voicerecording state when deleting or sending a voice message ([\#7896](matrix-org/matrix-react-sdk#7896)). Fixes element-hq/element-web#21151. * Fix bug with useRoomHierarchy tight-looping loadMore on error ([\#7893](matrix-org/matrix-react-sdk#7893)). * Fix upload button & shortcut not working for narrow composer mode ([\#7894](matrix-org/matrix-react-sdk#7894)). Fixes element-hq/element-web#21175 and element-hq/element-web#21142. * Fix emoji insertion in thread composer going to the main composer ([\#7895](matrix-org/matrix-react-sdk#7895)). Fixes element-hq/element-web#21202. * Try harder to keep context menus inside the window ([\#7863](matrix-org/matrix-react-sdk#7863)). Fixes element-hq/element-web#17527 and element-hq/element-web#18377. * Fix edge case around event list summary layout ([\#7891](matrix-org/matrix-react-sdk#7891)). Fixes element-hq/element-web#21180. * Fix event list summary 1 hidden message pluralisation ([\#7890](matrix-org/matrix-react-sdk#7890)). Fixes element-hq/element-web#21196. * Fix vanishing recently viewed menu ([\#7887](matrix-org/matrix-react-sdk#7887)). Fixes element-hq/element-web#20827. * Fix freeze on room switch ([\#7884](matrix-org/matrix-react-sdk#7884)). Fixes element-hq/element-web#21127. * Check 'useSystemTheme' in quick settings theme switcher ([\#7809](matrix-org/matrix-react-sdk#7809)). Fixes element-hq/element-web#21061. * Fix 'my threads' filtering to include participated threads ([\#7882](matrix-org/matrix-react-sdk#7882)). Fixes element-hq/element-web#20877. * Remove log line to try to fix freeze on answering VoIP call ([\#7883](matrix-org/matrix-react-sdk#7883)). * Support social login & password on soft logout page ([\#7879](matrix-org/matrix-react-sdk#7879)). Fixes element-hq/element-web#21099. * Fix missing padding on server picker ([\#7864](matrix-org/matrix-react-sdk#7864)). * Throttle RoomState.members handlers ([\#7876](matrix-org/matrix-react-sdk#7876)). Fixes element-hq/element-web#21127. * Only show joined/invited in search dialog ([\#7875](matrix-org/matrix-react-sdk#7875)). Fixes element-hq/element-web#21161. * Don't pillify code blocks ([\#7861](matrix-org/matrix-react-sdk#7861)). Fixes element-hq/element-web#20851 and element-hq/element-web#18687. * Fix keyboard shortcut icons on macOS ([\#7869](matrix-org/matrix-react-sdk#7869)).
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Labels
A-Performance
A-Room-List
O-Uncommon
Most users are unlikely to come across this or unexpected workflow
S-Minor
Impairs non-critical functionality or suitable workarounds exist
T-Defect
Scrolling the room list is laggy 🐌
Related issues:
Performance problems broken down
Hidden tooltips rendering on
scroll
You can see that the Tooltip render is attached to the
scroll
event atsrc/components/views/elements/Tooltip.tsx#L78-L81
The rendering calls
src/components/views/elements/Tooltip.tsx#L101
->updatePosition
which ends up as an expensive "Recalculate Style" because it usesElement.getBoundingClientRect()
. This happens many many times within a singlescroll
event. Probably once for each tooltip within the room list even though no tooltips are even visible as I scroll. I can see that we're just updating thestyle
attribute for a bunch of.mx_Tooltip_invisible
elements at the end of the document.Each one of the purple spans below the
scroll
span ends up as a call toupdatePosition
. And ascroll
event takes 35ms to 60ms to complete which is way over the 16.6ms 60 FPS budget (on a powerful desktop PC), granted these times are with the performance profiling running. This is without the Passbolt extension explained below.And the room list contains about 141 rooms (
document.querySelectorAll('.mx_RoomTile').length
):Passbolt Chrome browser extension exacerbates the problem
In order to login to Passbolt, it requires a browser extension which defaults to mucking up all pages:
The extension source seems to be available: https://github.com/passbolt/passbolt_browser_extension
The Passbolt Chrome extension has a
MutationObserver
listening to all attribute and element changes to the whole<body>
of thedocument
so it canfindAndSetAuthenticationFields
(find form elements and autofill).passbolt/passbolt_styleguide
->src/react-web-integration/lib/InForm/InFormManager.js#L143
This causes a bunch of
Forced reflow
because the TooltipupdatePosition
is mutating the elementstyle
attribute and PassboltMutationObserver
callbacks are querying the whole DOM looking for form elements all in the same frame.Under the
scroll
event, all of the little spans are theMutationObserver
->findAndSetAuthenticationFields
. With the Passbolt extension, scrolling is verrrrry crunchy and bad.Workaround
Instead of running Passbolt on all sites, we can enable the extension to only run on the domain for Passbolt instance itself. I'm guessing the Passbolt extension also does autofill stuff on sites but I always login manually to the Passbolt instance so this solution works for me 🤷
Extensions -> Passbolt -> Details -> Change Site access to
On specific sites
-> Enter in your Passbolt instancehttps://passbolt.example.com/
Potential solutions
Stop changing the
style
of hidden tooltips. This will stop massive number of callbacks and DOM manipulation from the Tooltip code. And we will no longer trigger theMutationObserver
in the Passbolt extension listening for attribute changes. 🎉Alternative is to only change Tooltip
style
in awindow.requestAnimationFrame()
callback which will do the DOM modifications in a much more opportune time (and once per frame).The text was updated successfully, but these errors were encountered: