Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • February 19, 2019 at 9:04 pm #1069095
    Itai

    Hello,

    I’ve recently begun converting my page for phone screens, optimizing the images in the color sections to load alternate versions of smaller dimensions and different proportions.

    When I do a gtmetrix test on my page (heaven11audio.com) I see that both the “desktop” and the “small screen” images loaded, even though the “small screen” color section was hidden.

    If so, is there a way to stop the sections to load, because in the case of multi-image sliders that could slow down my site considerably on the phone…

    If it’s not possible with enfold is there any plugin that does this?

    Cheers,

    i

    February 20, 2019 at 5:52 pm #1069581
    Justin

    I too am trying to find a solution to this. A means to deferring or lazy-loading hidden images. LMK if you have any ideas. Thanks

    February 24, 2019 at 8:50 pm #1071014
    Basilis

    Hi,

    That is happening on retina images actually. They load all the sizes because the image needs to adapt on different screen sizes.

    Best regards,
    Basilis

    February 25, 2019 at 3:34 pm #1071311
    Itai

    Basilis,

    Thanks for answering. Can you clarify?

    Do you mean that hidden color sections are supposed to load if the user is on a retina display?
    I don’t know what display GTmetrix use but I can definitely see the 2 color sections (with the images) loading in the waterfall, even though one is supposed to be hidden.

    Itai

    February 28, 2019 at 6:51 am #1072504
    Ismael

    Hi,

    An image that was hidden using the element’s Screen Options or css is still part of the page, so it is going to be loaded even if it’s not visible. You can try a lazy loading plugin, but there is no guarantee that it will work.

    Best regards,
    Ismael

    February 28, 2019 at 4:24 pm #1072668
    Itai

    Right. That’s too bad. The fact is that layerslider images are horizontal and most people browse in portrait mode on phones. ATM my horizontal website images looks terrible on phones. But I don’t want to affect the speed by having to load 2 sets of photos for each page, which would make it slower.

    I don’t see how lazy loading would work in this situation as the layersliders are the first thing you see in a page. I really wish there would be a coded solution to not have to load both image sets…

    Cheers,

    Itai

    February 28, 2019 at 4:49 pm #1072671
    Justin

    The Enfold theme is absolutely outstanding. But would have to agree with @Itai on this.
    I know there are other focus areas that allow for a well-optimized, fast-loading website.
    But in regards to this particular challenge, I am wondering what the recommended solution would be…?
    Whether from Enfold? Or custom developed on my end?

    March 1, 2019 at 6:08 am #1072894
    Ismael

    Hi,

    Thanks for the update.

    Yes, that would be an awesome feature in any theme but this would have to go through third party customization because it is under site optimization, not an issue with the theme itself.

    Best regards,
    Ismael

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.