NO BUG: High LCP due to Splide slider reloading preloaded images

Bugs
1

I’m experiencing an issue with the Splide slider in Bricks Builder that negatively impacts the LCP (Largest Contentful Paint) metric of my site.

Current behavior:

  1. I preload the first slider image using a preload tag
  2. Despite the image being already loaded, Splide initiates another load of the same image
  3. This double loading significantly increases the LCP time
    image
    image878×92 4.51 KB

Expected behavior: The Splide slider should recognize and utilize the preloaded image instead of loading it again, which would improve the LCP score.

This optimization would be valuable for improving Core Web Vitals scores across sites built with Bricks Builder

2

Hi @leszek.kotlicki,

thank you for your report, though, I’m not sure this is something that Bricks can fix. Can you try to use options for Splide, to preload the slides/pages? And if you do, make sure that you also set the correct “lazyLoad” option.

Let me know,
Matej

3

Hi Matej,

I figured out how can fix that - thank you!

4

Do you mind to share for other users who may have the same issue? :slight_smile:

I’ll mark this topic as a no-bug as well.

Thanks, Matej

5

Yeah of course ;).

I preload spide.js and prefetch and preload images inside slider - that did a trick.

1 Like
6

Hello @leszek.kotlicki , could you share screen of your settings ? I face same issue, I set prelaod and eager for the first image . But how did you set preload splide.js and prefetch ?
Thanks