Selecting / deselecting large amount of items with MultiDrag plugin, extremely sluggish due to inefficient filtering process.

[twilson90]

I have a sortable list with hundreds of items. If I select 100 items with shift + click, there is very noticable delay... If I have 1000+ items (for testing purposes) and select all of them, it took 20-40 seconds.

The issue lies here:

Sortable/plugins/MultiDrag/MultiDrag.js

Lines 347 to 357 in 3696da4

	for (; i < n; i++) {
	if (~multiDragElements.indexOf(children[i])) continue;
	// Check if element is draggable
	if (!closest(children[i], options.draggable, parentEl, false)) continue;
	// Check if element is filtered
	const filtered = filter && (typeof filter === 'function' ?
	filter.call(sortable, evt, children[i], sortable) :
	filter.split(',').some((criteria) => {
	return closest(children[i], criteria.trim(), parentEl, false);
	}));
	if (filtered) continue;

Here's a screenshot from the performance tab in developer tools:

With each iteration through the list it becomes slower. There are more efficient ways of doing this.