The loading is done

Features

Now the loading at the mutationObserver is finished, it finally loads or unloads the images that should be (or not) loaded!
The new observer is way faster, because it can detect the image way before it enters the screen, loading it before and having more time to do it. Also the system loads just a maximum of images (with the configs that i put it is 13), so it will not fry an cellphone.

Problems

The loading part was easy to do, i already done it before in the past observer (intersectionObserver), so i just had to pass the old code to the new part. But when the cover-flow element dont got atleast 13 elements the mutationObserver code breaks completely! Im still pondering how to solve it, when i do i will post about!

Results

• The performance went from 78 to 100!
• The system is way faster!
• The user does not see a blank image anymore!

Why

The old method was slow even with a good internet connection, because it was loading the images just when the element was already in the screen, leaving to a perceptive delay for the user and a blank image to the user. Also i thought about creating an observer from scratch (maybe i was a little off my ideas, because that was insane), but the browser already had exactly what i wanted (the mutationObserver)

Videos

1. The new features
2. The performance of the new feats
3. The old features

Reasoning

While i was trying to sleep i thought about a system that fill the cover-flow with a maximum of images (like 10, or 13, or the code decides) at the DOM, using less memory to run. That system will free a lot of memory based on how many cards the cover-flow have. But that will have noticeable effects just with a lot of elements and probably would be hard to develop, maybe i will do in next updates.

What next

Im leading to the shipping, so i will improve metrics about the lighthouse, improve the readme and post it.