Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft: Large item count performance #1170

Merged
merged 46 commits into from
Aug 27, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
46 commits
Select commit Hold shift + click to select a range
6cb9667
Reduce work done for unhighlightAll during on-click handler (batch ha…
Xon Aug 22, 2024
26c843a
Performance tests with thousands of items selected
Xon Aug 22, 2024
491652b
Inline highlightItem/unhighlightItem to avoid quadratic complexity
Xon Aug 22, 2024
9f9eed4
Switch from string literal type to effectively valueOf<EventType> to …
Xon Aug 22, 2024
8a66486
Update tests to permit newer target versions (main source tree still …
Xon Aug 22, 2024
4468603
Fix fragile highlightall/unhighlightall tests
Xon Aug 22, 2024
0e7789e
Dramatically reduce the performance impact of changing items (avoid r…
Xon Aug 22, 2024
89537aa
Support item rendering latching onto pre-rendered items
Xon Aug 22, 2024
f84bdc9
Handle case where the element needs to be regenerated
Xon Aug 22, 2024
e4d3f9c
Fix placeholder not applying as expected for select-one when loading …
Xon Aug 22, 2024
0d74ffc
Push highlight css toggle into reducer, simplifying state tracking
Xon Aug 23, 2024
a6179d8
Avoid touching every item after an item is added, instead call unhigh…
Xon Aug 23, 2024
60f08bb
Simplify _onBlur & _onFocus
Xon Aug 23, 2024
4a45aba
Adjust unhighlightAll to generally be called in a _store.withTxn to r…
Xon Aug 23, 2024
298ecb7
Hoist variables to reduce bundle size
Xon Aug 23, 2024
e3f085b
Preserve choices associated with groups
Xon Aug 23, 2024
77b2811
Inline renderChoice functionality & cleanup duplication
Xon Aug 23, 2024
68bd104
Cache element/group to reduce rendering time
Xon Aug 23, 2024
3b857c5
Avoid reflows by using display: none; vs visibility: hidden;
Xon Aug 25, 2024
3f849e1
Remove overly fragile unit testing of rendering
Xon Aug 25, 2024
44c2407
Restore older placeholder rendering behavior
Xon Aug 25, 2024
d969bde
Fix dropdown flip logic did not consider verticality of both sides of…
Xon Aug 25, 2024
1f6415a
Update e2e tests
Xon Aug 25, 2024
b9d71ef
linting fixes
Xon Aug 25, 2024
99e33c9
Adjust when the choice's cached element is purged
Xon Aug 25, 2024
a2ddd5a
Simplify groupId check, and push group label rendering into template
Xon Aug 25, 2024
d4db913
Use Element.replaceChildren API, update polyfill definition
Xon Aug 25, 2024
acf08d0
Compile JS files
Xon Aug 25, 2024
e435374
Disable unusably slow test
Xon Aug 25, 2024
e784912
Commit linter fixes
Xon Aug 26, 2024
8b8439a
cleanup css
Xon Aug 27, 2024
1dae822
Remove unused eslint disable
Xon Aug 27, 2024
b364578
Add ValueOf utility type
Xon Aug 27, 2024
a0f42ea
Use const object instead of loose constants for text/select-one/selec…
Xon Aug 27, 2024
c7ab134
Allow renderSelectedChoices to be a direct boolean to simplify intern…
Xon Aug 27, 2024
dfb15a7
Add e2e test for renderSelectedChoices flag
Xon Aug 27, 2024
b5b6c8e
Invalidate cached choice when an item is added/removed & fix renderSe…
Xon Aug 27, 2024
5f5a057
Revert & add some variable hoisting as it compressed better
Xon Aug 27, 2024
f1c3170
Cleanup unused function and redundant variable assignment
Xon Aug 27, 2024
63653f0
Update tests
Xon Aug 27, 2024
f6b54f7
Compile JS files
Xon Aug 27, 2024
d3028c7
Cleanup unused import
Xon Aug 27, 2024
9e60d6e
Commit lint fixed file
Xon Aug 27, 2024
b6e9809
Update CHANGELOG.md
Xon Aug 27, 2024
6e72240
Cleanup appending group label to choices
Xon Aug 27, 2024
f534235
Appease linter
Xon Aug 27, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion .eslintrc.json
Original file line number Diff line number Diff line change
Expand Up @@ -115,7 +115,8 @@
"CustomEvent",
"Element.prototype.classList",
"Element.prototype.closest",
"Element.prototype.dataset"
"Element.prototype.dataset",
"Element.prototype.replaceChildren"
],
"import/resolver": {
"node": {
Expand Down
9 changes: 9 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,14 @@
# Changelog

## [11.0.0]

### ⚠ BREAKING CHANGES
* Update polyfills to include `Element.prototype.replaceChildren`

### Bug Fixes (from 10.2.0)
* Reduce work done for `unhighlightAll` during on-click handler (batching in v11.0.0-rc8 would also have helped) [#522](https://github.com/Choices-js/Choices/issues/522) [#599](https://github.com/Choices-js/Choices/issues/599)
* Improve performance when rendering very large number of items and choices. Stuttering when stopping searching or selecting an item still happens depending on device and number of choices.

## [11.0.0-rc8] (2024-08-23)

### ⚠ BREAKING CHANGES
Expand Down
3 changes: 2 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -1250,7 +1250,7 @@ I suggest including a polyfill from [cdnjs.cloudflare.com/polyfill](https://cdnj
**Polyfill example used for the demo:**

```html
<script src="https://cdnjs.cloudflare.com/polyfill/v3/polyfill.min.js?features=Array.from%2Ces5%2Ces6%2CSymbol%2CSymbol.iterator%2CDOMTokenList%2CObject.assign%2CCustomEvent%2CElement.prototype.classList%2CElement.prototype.closest%2CElement.prototype.dataset%2CArray.prototype.find%2CArray.prototype.includes"></script>
<script src="https://cdnjs.cloudflare.com/polyfill/v3/polyfill.min.js?version=4.8.0&features=Array.from%2CArray.prototype.find%2CArray.prototype.includes%2CSymbol%2CSymbol.iterator%2CDOMTokenList%2CObject.assign%2CCustomEvent%2CElement.prototype.classList%2CElement.prototype.closest%2CElement.prototype.dataset%2CElement.prototype.replaceChildren"></script>
```

**Features used in Choices:**
Expand All @@ -1267,6 +1267,7 @@ CustomEvent
Element.prototype.classList
Element.prototype.closest
Element.prototype.dataset
Element.prototype.replaceChildren
```

## Development
Expand Down
Loading
Loading