Lazy load on background images not working

  • Lazy loading for background images is implemented with javascript. At least in some scenario’s, this will not work. I’m using Visual Composer and checking my site in Chrome.

    With F12, I can see that the “background-image: none !important” is set, but the images is still gets loaded on the network tab.

    In general, it’s hard to guarantee lazy loading with pure JS, but it might make sense to add a warning about this somewhere.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author Radek Mezulanik

    (@zedna)

    Hi @igorkalders, we were dealing with VC already, but it′s possible, that after some update BG images stopped working. Can you please share your website so i can take a look?
    Thanks

    Thread Starter igorkalders

    (@igorkalders)

    The plugin is currently disabled because I’m relying on some custom module I created to fix the VC lazy loading on the server side.

    I don’t think you need a sample to tell you the issue, though. Lazy loads generally work by outputting the data-src on the server side, and transforming that to a background-url on the client side. Your plugin does both the transformation to data-src and back to background-url on the client side. Because you’re never sure when javascript is executed, the browser may already be loading the images when your script triggers.

    Also note that (1) VC outputs styles in-page, so they are available at page load time and (2) your plugin scripts might be loaded after that because of WordPress optimizations

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Lazy load on background images not working’ is closed to new replies.