Make the sublists aware of their own list changes

This cuts the render time in half (from ~448ms to ~200ms on my account) per received event, as we're no longer re-mounting the entire room list and instead just the section(s) we care about.
This commit is contained in:
Travis Ralston 2020-07-23 21:23:45 -06:00
parent 60a6b13f4b
commit 7b97c3032b
3 changed files with 58 additions and 22 deletions

View file

@ -42,6 +42,7 @@ import { ViewRoomDeltaPayload } from "../../../dispatcher/payloads/ViewRoomDelta
import { RoomNotificationStateStore } from "../../../stores/notifications/RoomNotificationStateStore";
import SettingsStore from "../../../settings/SettingsStore";
import CustomRoomTagStore from "../../../stores/CustomRoomTagStore";
import { arrayHasDiff } from "../../../utils/arrays";
interface IProps {
onKeyDown: (ev: React.KeyboardEvent) => void;
@ -231,9 +232,14 @@ export default class RoomList extends React.Component<IProps, IState> {
console.log("new lists", newLists);
}
this.setState({sublists: newLists}, () => {
this.props.onResize();
});
const previousListIds = Object.keys(this.state.sublists);
const newListIds = Object.keys(newLists);
if (arrayHasDiff(previousListIds, newListIds)) {
this.setState({sublists: newLists}, () => {
this.props.onResize();
});
}
};
private renderCommunityInvites(): React.ReactElement[] {
@ -304,7 +310,6 @@ export default class RoomList extends React.Component<IProps, IState> {
key={`sublist-${orderedTagId}`}
tagId={orderedTagId}
forRooms={true}
rooms={orderedRooms}
startAsHidden={aesthetics.defaultHidden}
label={aesthetics.sectionLabelRaw ? aesthetics.sectionLabelRaw : _t(aesthetics.sectionLabel)}
onAddRoom={onAddRoomFn}