lazy load below the fold images served, and duplicated ?

  • Resolved RL

    (@lutzryan)


    1 year, 8 months ago

    report # QUCGDKKC
    Trying to improve my LCP for mobile scores.
    Im using an Instagram plugin by Smash Balloon @instagram-feed to “stream” Instagram top posts and these are below the fold, however dev tools suggests they are being served on intial load.

    The images are usually being served by LSCWP, with some outliers such as this 1 image on the subject page. Seemingly the largest images are not being served by LSCWP.

    They are also being duplicated on some images, served 2x for the same below the fold file.

    (I also see this phenomena with Font awesome where it seems the same file is served in different sizes)

    Ive tried to exclude css and js(below) from the Smash Balloon plugin in the tuning section of LSCWP, which seemed to make the performance much worse.

    What do I need to do to improve the LCP? Perhaps get the lazy load correctly implemented?

    I have put the class which I believe corresponds with the Instagram content box in HTML Lazy Load Selectors, event_customfield2
    ——

    /wp-content/plugins/instagram-feed-pro/js/sbi-scripts.min.js
    /wp-content/plugins/instagram-feed-pro/css/sbi-styles.min.css

    • This topic was modified 1 year, 8 months ago by RL.
    • This topic was modified 1 year, 8 months ago by RL.

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Support qtwrk

    (@qtwrk)

    <a class="sbi_link_area nofancybox" href="https://scontent-ord5-2.cdninstagram.com/v/t51.29350-15/321708668_199487169237632_8419142961576851725_n.jpg......

    it looks like the image is loaded as <a tag , LSCWP can only lazyload images from <img tag

    Thread Starter RL

    (@lutzryan)

    It looks as if there is the link you reference which is from instagram, and then there is a link with the same image which in the <img> tag and served from my wordpress installation.

    https://ibb.co/WNr0BFY

    I use this plugin on about 100 different pages on my site, serving about 100 different streams from Instagram.

    How can I get this to use the image from my site so that it is lazy loaded using the image links which in my local wordpress installation? For example this page has 9 images, and the top left image is at this location below and it is in an <img> tag

    https://xzib.com/art/sb-instagram-feed-images/314788719_5794082353968120_2633739037136916384_nfull.jpg

    <img data-lazyloaded="1" data-placeholder-resp="640x481" src="https://xzib.com/art/sb-instagram-feed-images/314788719_5794082353968120_2633739037136916384_nfull.jpg" width="640" height="481" data-src="https://xzib.com/art/sb-instagram-feed-images/314788719_5794082353968120_2633739037136916384_nfull.jpg" alt="Albi Serfaty Marks his his Design Miami/ debut with a Curio installation and contemporary take on freshwater resources.
    • This reply was modified 1 year, 8 months ago by RL.
    • This reply was modified 1 year, 8 months ago by RL.
    • This reply was modified 1 year, 8 months ago by RL.
    • This reply was modified 1 year, 8 months ago by RL.
    Plugin Support qtwrk

    (@qtwrk)

    that image was loaded by CSS , LSCWP can only lazyload the image that is loaded by <img

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘lazy load below the fold images served, and duplicated ?’ is closed to new replies.