Laggy interactions on Chrome with collection item on a static page

Hi everybody, hope someone can help me with this.

I am working on this homepage:

Read only:
https://preview.webflow.com/preview/jackytwostep?utm_medium=preview_link&utm_source=designer&utm_content=jackytwostep&preview=3cbb6610469cec101fee4836833d5728&workflow=preview

Published:
https://jackytwostep.webflow.io/

To achieve independents trigger interactions among the collection items I created 10 collections and then limited the display of the items in each collection. Right now only the 1st image (top-left) has the animation I’d like to implement on each image (hover on the image, then scale of the image plus, text coming in and invert effect on the rest of the images).

I tested the design on Chrome, Safari, Firefox, and Edge, and once-published, the mouse-over interaction and the animation of the text coming into view is ultra-smooth on all except Chrome. On Chrome, it is laggy and it seems I kind of have to run the trigger animation once, and then I have a smooth replay.

I tested that I have better results with 4 collection items instead of 8. So probably the collections are overloading the page somehow? If it’s the case why? I achieve the same results without issues not using any collection list, but I wanted to offer my client the opportunity to update the homepage by himself if needed.

It is very frustrating, am I missing something?

Thanks


https://preview.webflow.com/preview/jackytwostep?utm_medium=preview_link&utm_source=designer&utm_content=jackytwostep&preview=3cbb6610469cec101fee4836833d5728&workflow=preview