Dropdown list items rendered multiple times when bulk adding options

It seems that render() is called every time a choice is added and render removes all innerHTML DOM elements from the dropdown and recreates the list leading to poor performance with large sets, O(n2).

setChoices calls _addChoice in a loop which in turn calls store.dispatch and store calls render on every state change.

The pattern seems to look like: render 1 - clear - render 1, render 2 - clear render 1, render 2, render3

[nilsschmidthamburg]

Hi there, first of all: Thanks for the great work!

I just tested the integrate-morphdom branch to see if it is beneficial for our performance problems with choichesjs. I cannot say that it solved our issues. Maybe the search and update is faster. But adding a lot (aprox. 2000 Items) via setItems on an initially empty list still takes several seconds. I didn’t have time (nor the skills) to look deeper into this, but its pretty easy to reproduce like this:

const data = [...Array(1000).keys()].map(value => ({value, label: `${value}`}));

    // Pretty fast
    new Choices(element, {choices: data});

    // Very, very slow
    new Choices(element).setChoices(data);

[flying-sheep]

@stale no