Skip to content

Commit af5cb29

Browse files
lcottercertinialcottercertinia
authored
Merge pull request certinia#621 from lukecotter/fix-search-expand-perf
fix: calltree expand performance regression due to search recursion
2 parents 53e94c5 + bfa923f commit af5cb29

4 files changed

Lines changed: 54 additions & 36 deletions

File tree

‎log-viewer/modules/components/analysis-view/AnalysisView.ts‎

Lines changed: 16 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -110,6 +110,7 @@ export class AnalysisView extends LitElement {
110110
options: { matchCase: false },
111111
};
112112
totalMatches = 0;
113+
blockClearHighlights = false;
113114

114115
constructor() {
115116
super();
@@ -224,8 +225,10 @@ export class AnalysisView extends LitElement {
224225
newFindArgs.text = '';
225226
}
226227
if (newSearch || clearHighlights) {
228+
this.blockClearHighlights = true;
227229
//@ts-expect-error This is a custom function added in by Find custom module
228230
const result = this.analysisTable.find(this.findArgs);
231+
this.blockClearHighlights = false;
229232
this.totalMatches = result.totalMatches;
230233
this.findMap = result.matchIndexes;
231234

@@ -236,6 +239,12 @@ export class AnalysisView extends LitElement {
236239
}
237240
}
238241

242+
const hasHighlights = Object.keys(this.findMap).length !== 0;
243+
if (!hasHighlights) {
244+
return;
245+
}
246+
this.blockClearHighlights = true;
247+
this.analysisTable?.blockRedraw();
239248
const currentRow = this.findMap[this.findArgs.count];
240249
const rows = [
241250
currentRow,
@@ -247,6 +256,8 @@ export class AnalysisView extends LitElement {
247256
});
248257
//@ts-expect-error This is a custom function added in by RowNavigation custom module
249258
this.analysisTable.goToRow(currentRow, { scrollIfVisible: false, focusRow: false });
259+
this.analysisTable?.restoreRedraw();
260+
this.blockClearHighlights = false;
250261
}
251262

252263
async _renderAnalysis(rootMethod: ApexLog) {
@@ -408,9 +419,11 @@ export class AnalysisView extends LitElement {
408419
],
409420
});
410421

411-
this.analysisTable.on('dataFiltering', () => {
412-
this._resetFindWidget();
413-
this._clearSearchHighlights();
422+
this.analysisTable.on('renderStarted', () => {
423+
if (!this.blockClearHighlights) {
424+
this._resetFindWidget();
425+
this._clearSearchHighlights();
426+
}
414427
});
415428
}
416429

‎log-viewer/modules/components/calltree-view/CalltreeView.ts‎

Lines changed: 17 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ export class CalltreeView extends LitElement {
5757
findMap: { [key: number]: RowComponent } = {};
5858
totalMatches = 0;
5959

60-
canClearSearchHighlights = false;
60+
blockClearHighlights = false;
6161
searchString = '';
6262
findArgs: { text: string; count: number; options: { matchCase: boolean } } = {
6363
text: '',
@@ -350,7 +350,6 @@ export class CalltreeView extends LitElement {
350350
if (!isTableVisible && !this.totalMatches) {
351351
return;
352352
}
353-
this.canClearSearchHighlights = false;
354353

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

@@ -375,6 +376,12 @@ export class CalltreeView extends LitElement {
375376
}
376377
}
377378

379+
// Highlight the current row and reset the previous or next depending on whether we are stepping forward or back.
380+
const hasHighlights = Object.keys(this.findMap).length !== 0;
381+
if (!hasHighlights) {
382+
return;
383+
}
384+
this.blockClearHighlights = true;
378385
this.calltreeTable?.blockRedraw();
379386
const currentRow = this.findMap[this.findArgs.count];
380387
const rows = [
@@ -391,7 +398,7 @@ export class CalltreeView extends LitElement {
391398
this.calltreeTable.goToRow(currentRow, { scrollIfVisible: false, focusRow: false });
392399
}
393400
this.calltreeTable?.restoreRedraw();
394-
this.canClearSearchHighlights = true;
401+
this.blockClearHighlights = false;
395402
}
396403

397404
_highlight(inputString: string, substring: string) {
@@ -776,16 +783,6 @@ export class CalltreeView extends LitElement {
776783
],
777784
});
778785

779-
this.calltreeTable.on('dataFiltering', () => {
780-
// With a datatree the dataFiltering event occurs multi times and we only want to call this once.
781-
// We will reset the flag when the user next searches.
782-
if (this.canClearSearchHighlights) {
783-
this.canClearSearchHighlights = false;
784-
this._resetFindWidget();
785-
this._clearSearchHighlights();
786-
}
787-
});
788-
789786
this.calltreeTable.on('dataFiltered', () => {
790787
totalTimeFilterCache.clear();
791788
selfTimeFilterCache.clear();
@@ -795,6 +792,13 @@ export class CalltreeView extends LitElement {
795792
this.typeFilterCache.clear();
796793
});
797794

795+
this.calltreeTable.on('renderStarted', () => {
796+
if (!this.blockClearHighlights) {
797+
this._resetFindWidget();
798+
this._clearSearchHighlights();
799+
}
800+
});
801+
798802
this.calltreeTable.on('tableBuilt', () => {
799803
resolve();
800804
});

‎log-viewer/modules/components/database-view/DMLView.ts‎

Lines changed: 12 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,7 @@ export class DMLView extends LitElement {
6262
};
6363
findMap: { [key: number]: RowComponent } = {};
6464
totalMatches = 0;
65-
canClearHighlights = false;
65+
blockClearHighlights = false;
6666

6767
constructor() {
6868
super();
@@ -204,13 +204,17 @@ export class DMLView extends LitElement {
204204
this.findArgs.count = highlightIndex;
205205
const currentRow = this.findMap[highlightIndex];
206206
const rows = [currentRow, this.findMap[this.oldIndex]];
207+
this.blockClearHighlights = true;
208+
this.dmlTable.blockRedraw();
207209
rows.forEach((row) => {
208210
row?.reformat();
209211
});
210212
if (currentRow) {
211213
//@ts-expect-error This is a custom function added in by RowNavigation custom module
212214
this.dmlTable.goToRow(currentRow, { scrollIfVisible: false, focusRow: false });
213215
}
216+
this.dmlTable.restoreRedraw();
217+
this.blockClearHighlights = false;
214218
this.oldIndex = highlightIndex;
215219
}
216220

@@ -220,8 +224,6 @@ export class DMLView extends LitElement {
220224
return;
221225
}
222226

223-
this.canClearHighlights = true;
224-
225227
const newFindArgs = JSON.parse(JSON.stringify(e.detail));
226228
if (!isTableVisible) {
227229
newFindArgs.text = '';
@@ -237,8 +239,10 @@ export class DMLView extends LitElement {
237239
newFindArgs.text = '';
238240
}
239241
if (newSearch || clearHighlights) {
242+
this.blockClearHighlights = true;
240243
//@ts-expect-error This is a custom function added in by Find custom module
241244
const result = this.dmlTable.find(this.findArgs);
245+
this.blockClearHighlights = false;
242246
this.totalMatches = result.totalMatches;
243247
this.findMap = result.matchIndexes;
244248

@@ -250,7 +254,6 @@ export class DMLView extends LitElement {
250254
);
251255
}
252256
}
253-
this.canClearHighlights = false;
254257
}
255258

256259
_renderDMLTable(dmlTableContainer: HTMLElement, dmlLines: DMLBeginLine[]) {
@@ -382,13 +385,6 @@ export class DMLView extends LitElement {
382385
},
383386
});
384387

385-
this.dmlTable.on('dataFiltering', () => {
386-
if (this.canClearHighlights) {
387-
this._resetFindWidget();
388-
this._clearSearchHighlights();
389-
}
390-
});
391-
392388
this.dmlTable.on('groupClick', (e: UIEvent, group: GroupComponent) => {
393389
const { type } = window.getSelection() ?? {};
394390
if (type === 'Range') {
@@ -417,6 +413,11 @@ export class DMLView extends LitElement {
417413
});
418414

419415
this.dmlTable.on('renderStarted', () => {
416+
if (!this.blockClearHighlights) {
417+
this._resetFindWidget();
418+
this._clearSearchHighlights();
419+
}
420+
420421
const holder = this._getTableHolder();
421422
holder.style.minHeight = holder.clientHeight + 'px';
422423
holder.style.overflowAnchor = 'none';

‎log-viewer/modules/components/database-view/SOQLView.ts‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -73,7 +73,7 @@ export class SOQLView extends LitElement {
7373
};
7474
findMap: { [key: number]: RowComponent } = {};
7575
totalMatches = 0;
76-
canClearHighlights = false;
76+
blockClearHighlights = false;
7777

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

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

248252
this.oldIndex = highlightIndex;
249253
}
@@ -254,8 +258,6 @@ export class SOQLView extends LitElement {
254258
return;
255259
}
256260

257-
this.canClearHighlights = true;
258-
259261
const newFindArgs = JSON.parse(JSON.stringify(e.detail));
260262
const newSearch =
261263
newFindArgs.text !== this.findArgs.text ||
@@ -267,8 +269,10 @@ export class SOQLView extends LitElement {
267269
newFindArgs.text = '';
268270
}
269271
if (newSearch || clearHighlights) {
272+
this.blockClearHighlights = true;
270273
//@ts-expect-error This is a custom function added in by Find custom module
271274
const result = this.soqlTable.find(this.findArgs);
275+
this.blockClearHighlights = false;
272276
this.totalMatches = 0;
273277
this.findMap = result.matchIndexes;
274278

@@ -280,8 +284,6 @@ export class SOQLView extends LitElement {
280284
);
281285
}
282286
}
283-
284-
this.canClearHighlights = false;
285287
}
286288

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

542-
this.soqlTable.on('dataFiltering', () => {
543-
if (this.canClearHighlights) {
544+
this.soqlTable.on('renderStarted', () => {
545+
if (!this.blockClearHighlights) {
544546
this._resetFindWidget();
545547
this._clearSearchHighlights();
546548
}
547-
});
548549

549-
this.soqlTable.on('renderStarted', () => {
550550
const holder = this._getTableHolder();
551551
holder.style.minHeight = holder.clientHeight + 'px';
552552
holder.style.overflowAnchor = 'none';

0 commit comments

Comments
 (0)