change sorting algorithm

...to always use the slower one :(

since its more reliable

addon/-private/utils.js

@@ -38,14 +38,3 @@ export function startsWithString(string, query) {
   const b = removeDiacritics(normalise(query));
   return a.startsWith(b);
 }
-
-export function sortOptionsFast(elements) {
-  return (a, b) => elements.indexOf(a.element) - elements.indexOf(b.element);
-}
-
-export function sortOptionsSlow(a, b) {
-  return a.element.compareDocumentPosition(b.element) ===
-    Node.DOCUMENT_POSITION_FOLLOWING
-    ? -1
-    : 1;
-}

addon/components/select-box/index.gjs

@@ -10,9 +10,7 @@ import { on } from '@ember/modifier';
 import { scheduleOnce } from '@ember/runloop';
 import {
   startsWithString,
-  pressingModifier,
-  sortOptionsFast,
-  sortOptionsSlow
+  pressingModifier
 } from '@zestia/ember-select-box/-private/utils';
 import { task } from 'ember-concurrency';
 import { tracked } from 'tracked-built-ins';
@@ -29,7 +27,7 @@ const SELECTED = Symbol('SELECTED');
 
 export default class SelectBox extends Component {
   @tracked _activeOption;
-  @tracked _options = tracked([]);
+  @tracked _options = tracked(Set);
   @tracked dropdown;
   @tracked element;
   @tracked inputElement;
@@ -187,19 +185,14 @@ export default class SelectBox extends Component {
 
   @cached
   get options() {
-    if (!this.element) {
-      return [];
-    }
-
-    const options = this._options.filter((option) => !option.isDisabled);
-    const disconnected = options.some((option) => !option.isConnected);
-
-    if (disconnected) {
-      return options.sort(sortOptionsSlow);
-    } else {
-      const els = [...this.element.querySelectorAll('.select-box__option')];
-      return options.sort(sortOptionsFast(els));
-    }
+    return [...this._options]
+      .filter((option) => !option.isDisabled)
+      .sort((a, b) => {
+        return a.element.compareDocumentPosition(b.element) ===
+          Node.DOCUMENT_POSITION_FOLLOWING
+          ? -1
+          : 1;
+      });
   }
 
   @action
@@ -215,17 +208,12 @@ export default class SelectBox extends Component {
 
   @action
   handleInsertOption(option) {
-    this._options.push(option);
+    this._options.add(option);
   }
 
   @action
   handleDestroyOption(option) {
-    // https://github.com/tracked-tools/tracked-built-ins/issues/405
-    // https://stackoverflow.com/questions/30304719/javascript-fastest-way-to-remove-object-from-array
-    // this._options.splice(this._options.indexOf(option), 1);
-    const index = this._options.indexOf(option);
-    this._options[index] = this._options[this._options.length - 1];
-    this._options.pop();
+    this._options.delete(option);
   }
 
   @action

tests/acceptance/performance-test.js

@@ -6,15 +6,15 @@ module('Acceptance | performance', function (hooks) {
   setupApplicationTest(hooks);
 
   hooks.beforeEach(function () {
-    this.startTimer = () => (this.startTime = Date.now());
+    this.startTimer = () => (this.startTime = performance.now());
 
-    this.stopTimer = () => (this.stopTime = Date.now());
+    this.stopTimer = () => (this.stopTime = performance.now());
 
     this.timeTaken = () => this.stopTime - this.startTime;
   });
 
   test('rendering options', async function (assert) {
-    assert.expect(7);
+    assert.expect(5);
 
     await visit('/performance');
 
@@ -28,8 +28,7 @@ module('Acceptance | performance', function (hooks) {
 
     assert.dom('.select-box__option').exists({ count: 10000 });
 
-    assert.ok(this.timeTaken() > 500);
-    assert.ok(this.timeTaken() < 2000);
+    assert.closeTo(this.timeTaken(), 3000, 1000);
 
     this.startTimer();
 
@@ -39,7 +38,6 @@ module('Acceptance | performance', function (hooks) {
 
     assert.dom('.select-box__option').doesNotExist();
 
-    assert.ok(this.timeTaken() > 500);
-    assert.ok(this.timeTaken() < 2000);
+    assert.closeTo(this.timeTaken(), 3000, 1000);
   });
 });