From 5e58ceb4e02eee078437642715c48c1aa05af160 Mon Sep 17 00:00:00 2001
From: Ghislain B <gbeaulac@gmail.com>
Date: Thu, 9 Nov 2023 01:44:53 -0500
Subject: [PATCH] perf: don't recreate items list twice while filtering (#154)

- when we are filtering, the previous code was calling `initListItems()` and then `updateSelected()` which both recreate the rows list, there's no need to do it twice when we can simply pass it from the 1st pass to the 2nd method for other transformation
---
 lib/src/MultipleSelectInstance.ts | 15 +++++++--------
 1 file changed, 7 insertions(+), 8 deletions(-)

diff --git a/lib/src/MultipleSelectInstance.ts b/lib/src/MultipleSelectInstance.ts
index 5049a12f..f230680b 100644
--- a/lib/src/MultipleSelectInstance.ts
+++ b/lib/src/MultipleSelectInstance.ts
@@ -424,7 +424,7 @@ export class MultipleSelectInstance {
     this.initListItems();
   }
 
-  protected initListItems() {
+  protected initListItems(): HtmlStruct[] {
     let offset = 0;
     const rows = this.getListRows();
 
@@ -483,16 +483,15 @@ export class MultipleSelectInstance {
       this.virtualScroll = null;
     }
     this.events();
+
+    return rows;
   }
 
   protected getListRows(): HtmlStruct[] {
     const rows: HtmlStruct[] = [];
     this.updateData = [];
-    // console.time('perf');
-
     this.data?.forEach((row) => rows.push(...this.initListItem(row)));
     rows.push({ tagName: 'li', props: { className: 'ms-no-results', textContent: this.formatNoMatchesFound() } });
-    // console.timeEnd('perf');
 
     return rows;
   }
@@ -1061,7 +1060,7 @@ export class MultipleSelectInstance {
     }
   }
 
-  protected updateSelected() {
+  protected updateSelected(rows?: HtmlStruct[]) {
     for (let i = this.updateDataStart!; i < this.updateDataEnd!; i++) {
       const row = this.updateData[i];
       const inputElm = this.dropElm.querySelector<HTMLInputElement>(`input[data-key=${row._key}]`);
@@ -1088,7 +1087,7 @@ export class MultipleSelectInstance {
     toggleElement(this.noResultsElm, noResult);
 
     if (this.virtualScroll) {
-      this.virtualScroll.rows = this.getListRows();
+      this.virtualScroll.rows = rows ?? this.getListRows(); // recreate the rows list only when not already created
     }
   }
 
@@ -1366,9 +1365,9 @@ export class MultipleSelectInstance {
       }
     }
 
-    this.initListItems();
+    const rows = this.initListItems();
     this.initSelected(ignoreTrigger);
-    this.updateSelected();
+    this.updateSelected(rows); // no need to recreate the rows list twice
 
     if (!ignoreTrigger) {
       this.options.onFilter(originalSearch);