perf: reduce editor redraw sorting overhead

This commit is contained in:
OpenClaw Agent
2026-07-09 21:10:06 +00:00
parent 7bb54f61d6
commit 119692160a

View File

@@ -81,6 +81,16 @@ function findSegmentIndexById(segments = [], segmentId) {
function findSegmentById(segments = [], segmentId) {
return (segments || []).find((seg) => seg.id === segmentId);
}
function partitionSegmentsBySelection(segments = [], selectedIdSet) {
const unselected = [];
const selected = [];
for (const seg of segments || []) {
if (selectedIdSet.has(seg.id)) selected.push(seg);
else unselected.push(seg);
}
return unselected.concat(selected);
}
function hideWidget(w) {
if (!w) return;
@@ -6055,23 +6065,9 @@ class TimelineEditor {
if (this._previewSegments && previewIsMotion) renderMotionSegments = this._previewSegments;
}
const sortedSegments = [...renderSegments].sort((a, b) => {
const aSel = selectedIdSet.has(a.id) ? 1 : 0;
const bSel = selectedIdSet.has(b.id) ? 1 : 0;
return aSel - bSel;
});
const sortedMotionSegments = [...renderMotionSegments].sort((a, b) => {
const aSel = selectedIdSet.has(a.id) ? 1 : 0;
const bSel = selectedIdSet.has(b.id) ? 1 : 0;
return aSel - bSel;
});
const sortedAudioSegments = [...renderAudioSegments].sort((a, b) => {
const aSel = selectedIdSet.has(a.id) ? 1 : 0;
const bSel = selectedIdSet.has(b.id) ? 1 : 0;
return aSel - bSel;
});
const sortedSegments = partitionSegmentsBySelection(renderSegments, selectedIdSet);
const sortedMotionSegments = partitionSegmentsBySelection(renderMotionSegments, selectedIdSet);
const sortedAudioSegments = partitionSegmentsBySelection(renderAudioSegments, selectedIdSet);
if (this.retakeMode) {
// Draw Retake Mode Filmstrip and Overlay
@@ -7643,16 +7639,17 @@ class TimelineEditor {
clickedId = targetArray[clickedIdx].id;
}
if (clickedId) {
if (isCtrl) {
const sibId = clickedId.endsWith("_v") ? clickedId.slice(0, -2) + "_a" : (clickedId.endsWith("_a") ? clickedId.slice(0, -2) + "_v" : null);
const isSelected = this.selectedSegmentIds.includes(clickedId);
if (isSelected) {
this.selectedSegmentIds = this.selectedSegmentIds.filter(id => id !== clickedId && id !== sibId);
} else {
if (!this.selectedSegmentIds.includes(clickedId)) this.selectedSegmentIds.push(clickedId);
if (sibId && !this.selectedSegmentIds.includes(sibId)) this.selectedSegmentIds.push(sibId);
}
if (clickedId) {
const selectedIdSet = new Set(this.selectedSegmentIds || []);
if (isCtrl) {
const sibId = clickedId.endsWith("_v") ? clickedId.slice(0, -2) + "_a" : (clickedId.endsWith("_a") ? clickedId.slice(0, -2) + "_v" : null);
const isSelected = selectedIdSet.has(clickedId);
if (isSelected) {
this.selectedSegmentIds = this.selectedSegmentIds.filter(id => id !== clickedId && id !== sibId);
} else {
if (!selectedIdSet.has(clickedId)) this.selectedSegmentIds.push(clickedId);
if (sibId && !selectedIdSet.has(sibId)) this.selectedSegmentIds.push(sibId);
}
if (this.selectedSegmentIds.length > 0) {
this.selectionType = clickedTrack;
@@ -7661,16 +7658,16 @@ class TimelineEditor {
this.selectedIndex = -1;
}
this._multiDragClickPendingDeselect = null;
} else {
if (this.selectedSegmentIds.includes(clickedId)) {
this._multiDragClickPendingDeselect = clickedId;
} else {
this.selectedSegmentIds = [clickedId];
const sibId = clickedId.endsWith("_v") ? clickedId.slice(0, -2) + "_a" : (clickedId.endsWith("_a") ? clickedId.slice(0, -2) + "_v" : null);
if (sibId && !this.selectedSegmentIds.includes(sibId)) this.selectedSegmentIds.push(sibId);
this.selectionType = clickedTrack;
this.selectedIndex = clickedIdx;
this._multiDragClickPendingDeselect = null;
} else {
if (selectedIdSet.has(clickedId)) {
this._multiDragClickPendingDeselect = clickedId;
} else {
this.selectedSegmentIds = [clickedId];
const sibId = clickedId.endsWith("_v") ? clickedId.slice(0, -2) + "_a" : (clickedId.endsWith("_a") ? clickedId.slice(0, -2) + "_v" : null);
if (sibId && !selectedIdSet.has(sibId)) this.selectedSegmentIds.push(sibId);
this.selectionType = clickedTrack;
this.selectedIndex = clickedIdx;
this._multiDragClickPendingDeselect = null;
}
}
}