Intersection Observer: How it should be used

Photo by Lukas Blazek on Unsplash

How to create an Intersection Observer?

let observer = new IntersectionObserver(this.intersectionObserverCallback, options);observer.observe(this.myElement.nativeElement);
intersectionObserverCallback = (entries) => {
if (entries[0].isIntersecting) {
// show the element
this.el.nativeElement.style.visibility = 'visible';
} else {
// hide the element
this.el.nativeElement.style.visibility = 'hidden';
}
};

The main question is: Which option is better?

Project for testing multiple observed elements
Comparison of the profiling result

Limitation

Last words

Lives in Austria; Passionate software developer

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store