TeaSpeak/TeaWeb
TeaSpeak/TeaWeb
1
0
Fork 0
Code Issues 1 Pull requests Activity

Improved channel tree performance on voice state updates

Browse source
This commit is contained in:
WolverinDEV 2021-01-07 13:26:58 +01:00
parent 039c87454b
commit ceb0ada606
3 changed files with 62 additions and 52 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
shared/js/ui/tree/Controller.tsx
View file

@ -280,7 +280,8 @@ class ChannelTreeController {
return; return;
} }
this.channelTree.channels.forEach(channel => this.sendChannelIcons(channel)); /* Quicker than sending info for every client & channel */
this.sendChannelTreeEntriesFull(undefined);
} }
private handleGroupsUpdated(event: GroupManagerEvents["notify_groups_updated"]) { private handleGroupsUpdated(event: GroupManagerEvents["notify_groups_updated"]) {

55
shared/js/ui/tree/RendererDataProvider.tsx
View file

@ -651,18 +651,19 @@ export class RDPChannelTree {
this.orderedTree = event.entries.map((entry, index) => { this.orderedTree = event.entries.map((entry, index) => {
let result: RDPEntry; let result: RDPEntry;
if(oldEntryInstances[entry.entryId]) {
result = oldEntryInstances[entry.entryId];
delete oldEntryInstances[entry.entryId];
} else {
switch (entry.type) { switch (entry.type) {
case "channel": case "channel":
const channel = new RDPChannel(this, entry.entryId); const channel = oldEntryInstances[entry.entryId] || new RDPChannel(this, entry.entryId);
if(!(channel instanceof RDPChannel)) {
throw tr("entry id type changed");
}
if(entry.fullInfo) { if(entry.fullInfo) {
channel.info = entry.info; channel.stateQueried = true;
channel.icon = entry.icon; channel.handleInfoUpdate(entry.info);
channel.icons = entry.icons; channel.handleIconUpdate(entry.icon);
} else { channel.handleIconsUpdate(entry.icons);
} else if(!channel.stateQueried) {
channel.queryState(); channel.queryState();
} }
result = channel; result = channel;
@ -670,24 +671,33 @@ export class RDPChannelTree {
case "client": case "client":
case "client-local": case "client-local":
const client = new RDPClient(this, entry.entryId, entry.type === "client-local"); const client = oldEntryInstances[entry.entryId] || new RDPClient(this, entry.entryId, entry.type === "client-local");
if(!(client instanceof RDPClient)) {
throw tr("entry id type changed");
}
if(entry.fullInfo) { if(entry.fullInfo) {
client.name = entry.name; client.stateQueried = true;
client.status = entry.status; client.handleNameUpdate(entry.name);
client.icons = entry.icons; client.handleStatusUpdate(entry.status);
client.talkStatus = entry.talkStatus; client.handleIconsUpdate(entry.icons);
client.talkRequestMessage = entry.talkRequestMessage; client.handleTalkStatusUpdate(entry.talkStatus, entry.talkRequestMessage);
} else { } else if(!client.stateQueried) {
client.queryState(); client.queryState();
} }
result = client; result = client;
break; break;
case "server": case "server":
const server = new RDPServer(this, entry.entryId); const server = oldEntryInstances[entry.entryId] || new RDPServer(this, entry.entryId);
if(!(server instanceof RDPServer)) {
throw tr("entry id type changed");
}
if(entry.fullInfo) { if(entry.fullInfo) {
server.state = entry.state; server.stateQueried = true;
} else { server.handleStateUpdate(entry.state);
} else if(server.stateQueried) {
server.queryState(); server.queryState();
} }
result = server; result = server;
@ -696,7 +706,7 @@ export class RDPChannelTree {
default: default:
throw "invalid channel entry type " + (entry as any).type; throw "invalid channel entry type " + (entry as any).type;
} }
} delete oldEntryInstances[entry.entryId];
this.treeEntries[entry.entryId] = result; this.treeEntries[entry.entryId] = result;
result.handlePositionUpdate(index, entry.depth); result.handlePositionUpdate(index, entry.depth);
@ -734,6 +744,8 @@ export abstract class RDPEntry {
readonly refUnread = React.createRef<UnreadMarkerRenderer>(); readonly refUnread = React.createRef<UnreadMarkerRenderer>();
stateQueried: boolean;
offsetTop: number; /* In 16px units */ offsetTop: number; /* In 16px units */
offsetLeft: number; /* In channel units */ offsetLeft: number; /* In channel units */
@ -765,8 +777,9 @@ export abstract class RDPEntry {
/* do the initial state query */ /* do the initial state query */
queryState() { queryState() {
const events = this.getEvents(); this.stateQueried = true;
const events = this.getEvents();
events.fire("query_unread_state", { treeEntryId: this.entryId }); events.fire("query_unread_state", { treeEntryId: this.entryId });
} }

12
shared/js/ui/tree/RendererView.tsx
View file

@ -91,17 +91,13 @@ export class ChannelTreeView extends ReactComponentBase<ChannelTreeViewPropertie
} }
const bounds = entries[0].contentRect; const bounds = entries[0].contentRect;
if (this.state.viewHeight !== bounds.height) { const fontSize = parseFloat(getComputedStyle(entries[0].target).getPropertyValue("font-size"));
if (this.state.viewHeight !== bounds.height || this.state.fontSize !== fontSize) {
this.setState({ this.setState({
viewHeight: bounds.height viewHeight: bounds.height,
fontSize: fontSize
}); });
} }
const fontSize = parseFloat(getComputedStyle(entries[0].target).getPropertyValue("font-size"));
console.error("Updated font size to: %o", fontSize);
this.setState({
fontSize: fontSize || 0
});
}); });
this.resizeObserver.observe(this.refContainer.current); this.resizeObserver.observe(this.refContainer.current);