kirbydesign / designsystem

Kirby Design System
https://cookbook.kirby.design
MIT License
83 stars 22 forks source link

Menu: Fix floating directive performance issues #3357

Closed Tannex closed 6 months ago

Tannex commented 6 months ago

Which issue does this PR close?

This PR closes #3351

What is the new behavior?

Floating directive now only updates host element position manually when:

Additionally, autoUpdate is enabled only on show, and disabled on hide / destroy.

For now, autoUpdate (from floating-ui) also performs an initial update. If this is changed in the future, tests are added to catch it.

Update: Now also re-enables autoUpdate if reference changes while floating element is shown.

Does this PR introduce a breaking change?

No breaking changes unless users hacked into private functions / fields somehow.

Are there any additional context?

Performance profiling from cookbook menu page.

Before changes:

[video] https://github.com/kirbydesign/designsystem/assets/5255948/118ecc7c-8239-4c45-8764-36f31a7716d4 before

After changes:

[video] https://github.com/kirbydesign/designsystem/assets/5255948/4cebc73e-acc0-4bfd-83db-0f4f0b62bb8e after

Checklist:

The following tasks should be carried out in sequence in order to follow the process of contributing correctly.

Reminders

Review

When the pull request has been approved it will be merged to develop by Team Kirby.