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

Use Intersection Observer API for better performance #510

Closed
Danielku15 opened this issue Jan 10, 2021 · 0 comments · Fixed by #515
Closed

Use Intersection Observer API for better performance #510

Danielku15 opened this issue Jan 10, 2021 · 0 comments · Fixed by #515
Assignees
Labels
area-maintenance Overall code maintenance related platform-javascript Related to the JavaScript version of alphaTab

Comments

@Danielku15
Copy link
Member

Danielku15 commented Jan 10, 2021

AlphaTab uses a custom scroll listener for "lazy loading" the generated image chunks into the DOM for smoother UI feedback. This is based on the getBoundingClientRect which is very expensive as it might cause a layout flow in the browser.

The intersection observer API is way more lightweight and provides exactly what we need for lazy loading.

Also this API should be used for detecting the visibility of the element on-load.

https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API

@Danielku15 Danielku15 added the platform-javascript Related to the JavaScript version of alphaTab label Jan 10, 2021
@Danielku15 Danielku15 self-assigned this Jan 10, 2021
@Danielku15 Danielku15 added the area-maintenance Overall code maintenance related label Jan 10, 2021
This was referenced Jan 17, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area-maintenance Overall code maintenance related platform-javascript Related to the JavaScript version of alphaTab
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant