Skip to content

fix: calltree expand performance regression due to search recursion #621

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.

Sign up for GitHub

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

Merged
lcottercertinia merged 3 commits into from
May 11, 2025
Merged

fix: calltree expand performance regression due to search recursion #621

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
8d65841
fix: block highlight clear when searching + stepping results
lukecotter May 2, 2025
9712613
fix: clear search highlights on render instead of filter event
lukecotter May 2, 2025
bfa923f
refactor: block redraw when stepping results
lukecotter May 2, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 16 additions & 3 deletions log-viewer/modules/components/analysis-view/AnalysisView.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -110,6 +110,7 @@ export class AnalysisView extends LitElement {
options: { matchCase: false },
};
totalMatches = 0;
blockClearHighlights = false;

constructor() {
super();
Expand Down Expand Up @@ -224,8 +225,10 @@ export class AnalysisView extends LitElement {
newFindArgs.text = '';
}
if (newSearch || clearHighlights) {
this.blockClearHighlights = true;
//@ts-expect-error This is a custom function added in by Find custom module
const result = this.analysisTable.find(this.findArgs);
this.blockClearHighlights = false;
this.totalMatches = result.totalMatches;
this.findMap = result.matchIndexes;

Expand All @@ -236,6 +239,12 @@ export class AnalysisView extends LitElement {
}
}

const hasHighlights = Object.keys(this.findMap).length !== 0;
if (!hasHighlights) {
return;
}
this.blockClearHighlights = true;
this.analysisTable?.blockRedraw();
const currentRow = this.findMap[this.findArgs.count];
const rows = [
currentRow,
Expand All @@ -247,6 +256,8 @@ export class AnalysisView extends LitElement {
});
//@ts-expect-error This is a custom function added in by RowNavigation custom module
this.analysisTable.goToRow(currentRow, { scrollIfVisible: false, focusRow: false });
this.analysisTable?.restoreRedraw();
this.blockClearHighlights = false;
}

async _renderAnalysis(rootMethod: ApexLog) {
Expand Down Expand Up @@ -410,9 +421,11 @@ export class AnalysisView extends LitElement {
],
});

this.analysisTable.on('dataFiltering', () => {
this._resetFindWidget();
this._clearSearchHighlights();
this.analysisTable.on('renderStarted', () => {
if (!this.blockClearHighlights) {
this._resetFindWidget();
this._clearSearchHighlights();
}
});
}

Expand Down
30 changes: 17 additions & 13 deletions log-viewer/modules/components/calltree-view/CalltreeView.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@ export class CalltreeView extends LitElement {
findMap: { [key: number]: RowComponent } = {};
totalMatches = 0;

canClearSearchHighlights = false;
blockClearHighlights = false;
searchString = '';
findArgs: { text: string; count: number; options: { matchCase: boolean } } = {
text: '',
Expand Down Expand Up @@ -350,7 +350,6 @@ export class CalltreeView extends LitElement {
if (!isTableVisible && !this.totalMatches) {
return;
}
this.canClearSearchHighlights = false;

const newFindArgs = JSON.parse(JSON.stringify(e.detail));
const newSearch =
Expand All @@ -363,8 +362,10 @@ export class CalltreeView extends LitElement {
newFindArgs.text = '';
}
if (newSearch || clearHighlights) {
this.blockClearHighlights = true;
//@ts-expect-error This is a custom function added in by Find custom module
const result = this.calltreeTable.find(this.findArgs);
this.blockClearHighlights = false;
this.totalMatches = result.totalMatches;
this.findMap = result.matchIndexes;

Expand All @@ -375,6 +376,12 @@ export class CalltreeView extends LitElement {
}
}

// Highlight the current row and reset the previous or next depending on whether we are stepping forward or back.
const hasHighlights = Object.keys(this.findMap).length !== 0;
if (!hasHighlights) {
return;
}
this.blockClearHighlights = true;
this.calltreeTable?.blockRedraw();
const currentRow = this.findMap[this.findArgs.count];
const rows = [
Expand All @@ -391,7 +398,7 @@ export class CalltreeView extends LitElement {
this.calltreeTable.goToRow(currentRow, { scrollIfVisible: false, focusRow: false });
}
this.calltreeTable?.restoreRedraw();
this.canClearSearchHighlights = true;
this.blockClearHighlights = false;
}

_highlight(inputString: string, substring: string) {
Expand Down Expand Up @@ -772,16 +779,6 @@ export class CalltreeView extends LitElement {
],
});

this.calltreeTable.on('dataFiltering', () => {
// With a datatree the dataFiltering event occurs multi times and we only want to call this once.
// We will reset the flag when the user next searches.
if (this.canClearSearchHighlights) {
this.canClearSearchHighlights = false;
this._resetFindWidget();
this._clearSearchHighlights();
}
});

this.calltreeTable.on('dataFiltered', () => {
totalTimeFilterCache.clear();
selfTimeFilterCache.clear();
Expand All @@ -791,6 +788,13 @@ export class CalltreeView extends LitElement {
this.typeFilterCache.clear();
});

this.calltreeTable.on('renderStarted', () => {
if (!this.blockClearHighlights) {
this._resetFindWidget();
this._clearSearchHighlights();
}
});

this.calltreeTable.on('tableBuilt', () => {
resolve();
});
Expand Down
23 changes: 12 additions & 11 deletions log-viewer/modules/components/database-view/DMLView.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,7 @@ export class DMLView extends LitElement {
};
findMap: { [key: number]: RowComponent } = {};
totalMatches = 0;
canClearHighlights = false;
blockClearHighlights = false;

constructor() {
super();
Expand Down Expand Up @@ -204,13 +204,17 @@ export class DMLView extends LitElement {
this.findArgs.count = highlightIndex;
const currentRow = this.findMap[highlightIndex];
const rows = [currentRow, this.findMap[this.oldIndex]];
this.blockClearHighlights = true;
this.dmlTable.blockRedraw();
rows.forEach((row) => {
row?.reformat();
});
if (currentRow) {
//@ts-expect-error This is a custom function added in by RowNavigation custom module
this.dmlTable.goToRow(currentRow, { scrollIfVisible: false, focusRow: false });
}
this.dmlTable.restoreRedraw();
this.blockClearHighlights = false;
this.oldIndex = highlightIndex;
}

Expand All @@ -220,8 +224,6 @@ export class DMLView extends LitElement {
return;
}

this.canClearHighlights = true;

const newFindArgs = JSON.parse(JSON.stringify(e.detail));
if (!isTableVisible) {
newFindArgs.text = '';
Expand All @@ -237,8 +239,10 @@ export class DMLView extends LitElement {
newFindArgs.text = '';
}
if (newSearch || clearHighlights) {
this.blockClearHighlights = true;
//@ts-expect-error This is a custom function added in by Find custom module
const result = this.dmlTable.find(this.findArgs);
this.blockClearHighlights = false;
this.totalMatches = result.totalMatches;
this.findMap = result.matchIndexes;

Expand All @@ -250,7 +254,6 @@ export class DMLView extends LitElement {
);
}
}
this.canClearHighlights = false;
}

_renderDMLTable(dmlTableContainer: HTMLElement, dmlLines: DMLBeginLine[]) {
Expand Down Expand Up @@ -380,13 +383,6 @@ export class DMLView extends LitElement {
},
});

this.dmlTable.on('dataFiltering', () => {
if (this.canClearHighlights) {
this._resetFindWidget();
this._clearSearchHighlights();
}
});

this.dmlTable.on('groupClick', (e: UIEvent, group: GroupComponent) => {
const { type } = window.getSelection() ?? {};
if (type === 'Range') {
Expand Down Expand Up @@ -415,6 +411,11 @@ export class DMLView extends LitElement {
});

this.dmlTable.on('renderStarted', () => {
if (!this.blockClearHighlights) {
this._resetFindWidget();
this._clearSearchHighlights();
}

const holder = this._getTableHolder();
holder.style.minHeight = holder.clientHeight + 'px';
holder.style.overflowAnchor = 'none';
Expand Down
18 changes: 9 additions & 9 deletions log-viewer/modules/components/database-view/SOQLView.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,7 @@ export class SOQLView extends LitElement {
};
findMap: { [key: number]: RowComponent } = {};
totalMatches = 0;
canClearHighlights = false;
blockClearHighlights = false;

get _soqlTableWrapper(): HTMLDivElement | null {
return this.renderRoot?.querySelector('#db-soql-table') ?? null;
Expand Down Expand Up @@ -235,6 +235,8 @@ export class SOQLView extends LitElement {

this.findArgs.count = highlightIndex;
const currentRow = this.findMap[highlightIndex];
this.blockClearHighlights = true;
this.soqlTable.blockRedraw();
const rows = [currentRow, this.findMap[this.oldIndex]];
rows.forEach((row) => {
row?.reformat();
Expand All @@ -244,6 +246,8 @@ export class SOQLView extends LitElement {
//@ts-expect-error This is a custom function added in by RowNavigation custom module
this.soqlTable.goToRow(currentRow, { scrollIfVisible: false, focusRow: false });
}
this.soqlTable.restoreRedraw();
this.blockClearHighlights = false;

this.oldIndex = highlightIndex;
}
Expand All @@ -254,8 +258,6 @@ export class SOQLView extends LitElement {
return;
}

this.canClearHighlights = true;

const newFindArgs = JSON.parse(JSON.stringify(e.detail));
const newSearch =
newFindArgs.text !== this.findArgs.text ||
Expand All @@ -267,8 +269,10 @@ export class SOQLView extends LitElement {
newFindArgs.text = '';
}
if (newSearch || clearHighlights) {
this.blockClearHighlights = true;
//@ts-expect-error This is a custom function added in by Find custom module
const result = this.soqlTable.find(this.findArgs);
this.blockClearHighlights = false;
this.totalMatches = 0;
this.findMap = result.matchIndexes;

Expand All @@ -280,8 +284,6 @@ export class SOQLView extends LitElement {
);
}
}

this.canClearHighlights = false;
}

_renderSOQLTable(soqlTableContainer: HTMLElement, soqlLines: SOQLExecuteBeginLine[]) {
Expand Down Expand Up @@ -537,14 +539,12 @@ export class SOQLView extends LitElement {
row.getCell('soql').getElement().style.height = origRowHeight + 'px';
});

this.soqlTable.on('dataFiltering', () => {
if (this.canClearHighlights) {
this.soqlTable.on('renderStarted', () => {
if (!this.blockClearHighlights) {
this._resetFindWidget();
this._clearSearchHighlights();
}
});

this.soqlTable.on('renderStarted', () => {
const holder = this._getTableHolder();
holder.style.minHeight = holder.clientHeight + 'px';
holder.style.overflowAnchor = 'none';
Expand Down
Loading