From 7d35e861e3294f9484131493483437c36b43c1d2 Mon Sep 17 00:00:00 2001 From: Kegan Dougal Date: Wed, 8 Dec 2021 10:50:27 +0000 Subject: [PATCH] Improve performance of room list re-rendering Only re-render if the room ID has changed, this stops flickering when new messages come in. --- .../web/ui/session/leftpanel/LeftPanelView.js | 18 ++++++++++++------ 1 file changed, 12 insertions(+), 6 deletions(-) diff --git a/src/platform/web/ui/session/leftpanel/LeftPanelView.js b/src/platform/web/ui/session/leftpanel/LeftPanelView.js index af4cd66b..c0bc25a2 100644 --- a/src/platform/web/ui/session/leftpanel/LeftPanelView.js +++ b/src/platform/web/ui/session/leftpanel/LeftPanelView.js @@ -70,13 +70,19 @@ export class LeftPanelView extends TemplateView { vm.loadRoomRange(range); }, shouldRecreateItem: (value, oldValue) => { - return true; - // TODO: We used to just recreate the item if the underlying view model was swapped out e.g ph->room + const oldIsPlaceholder = oldValue instanceof PlaceholderRoomTileViewModel; + const newIsPlaceholder = value instanceof PlaceholderRoomTileViewModel; + if (oldIsPlaceholder != newIsPlaceholder) { + return true; + } + // We used to just recreate the item if the underlying view model was swapped out e.g ph->room // but there is also a need to recreate items on room->room transitions (to re-make the - // subviews), so just always recreate views for now. - const isOldRoom = oldValue instanceof RoomTileViewModel; - const isNewRoom = value instanceof RoomTileViewModel; - return isOldRoom != isNewRoom; + // subviews) + // views can be recycled so if the room ID is different then also recreate + if (oldValue.id !== value.id) { + return true; + } + return false; } }, tileVM => {