Before you ask please READ THIS

Number of images loaded in album

Hi,

My site is now up and running and I'm really happy with it. (www.mirkoreichlin.ch).

Now I try to optimize it (caching, cdn etc.). However, album loading is still slow sometimes. Can I change the number of images loaded (before lazy load)?

Thanks, happy holidays and kind regards
Mirko

Comments

  • AirAir
    Posts: 10,970
    Hi there:-)

    I think something funky is going on. When you have such big photos I think that script should load 2 - 6 six photos, before stopping on lazy load. Script loads 2 photos at time and then measure it there is enough to fill visible space.

    I will investigate this on Wednesday when I will be back in office.

    With kind regards.
  • AirAir
    Posts: 10,970
    Hello :-)

    For some reason it load 10 items at once. I was sure it was set to 2. I think I will add this as a setting in future, for now I will reduce it to 2 in next update. But if you don't want to wait, make such simple tweak:

    Go to file photoproof/js/script.js line ~3050
    and change:
    limit_per_load = 10,
    to
    limit_per_load = 2,

    Thanks for reporting this.

    With kind regards.
  • Hello Air

    Wow, awesome, thank you for the quick response and this handy solution. I definitely see an improvement on my desktop site. On mobile, I still have the feeling, thats the lazy loader is relatively slow/late to load - usually I'm all the way down at the footer, when I see the spinning wheel (I don't mind, if the pictures take some time to load, but the wheel should be visible quicker, if somehow possible).

    I hope, I can improve the theme for others too. But it's already really great! Thanks again for the great support.

    One last questions: Is there a way to easily create a bilingual site with PhotoProof (with a language selector in the footer and/or the main navigation and/or header)?

    Kind regards
    Mirko
  • AirAir
    Posts: 10,970
    Hi there Mirko!
    bigway said: On mobile, I still have the feeling, thats the lazy loader is relatively slow/late to load
    It could be cause scroll events are released on mobile when you stop scrolling actually. It is made to save CPU of mobile. However I will take a look at it :-)
    bigway said: One last questions: Is there a way to easily create a bilingual site with PhotoProof (with a language selector in the footer and/or the main navigation and/or header)?
    PhotoProof works fine with WPML plugin http://apollo13.eu/docs/apollo13_framework_theme/#translating_theme_wpml
    This is commercial plugin, but very popular one. Do you have some other plugin in mind that you like to use?

    With kind regards.
  • Posts: 8
    Hi there

    Thanks for looking into the mobile scolling "issue". And thanks for confirming that WPML works with PhotoProof. I will look into that later this months. Do you have an example site with one of your themes and WPML?

    Now I have one more issue with my CDN solution. I use WP Fastest Cache plugin with CDN77.com. All pictures should then be loaded trough CDN77.com, as all links should be replaced (https://1836297926.rsc.cdn77.org/ replaces https://mirkoreichlin.ch/). The source code of my site shows me however that some images are loaded as part of a list (li/ul). These image-links are not replaced by WP Fastest Cache and load really slowly from abroad. I know, this is a very specific problem. Never mind if you don't have time for this issue. But maybe you have a recommendation for a different setup or what to do about it.

    Kind regards and all the best for 2018
    Mirko
  • AirAir
    edited January 2018 Posts: 10,970
    Hello:-)

    Currently we don't have any demo with WPML activated, so can't show you anything. Sorry:-)
    bigway said: he source code of my site shows me however that some images are loaded as part of a list (li/ul). These image-links are not replaced by WP Fastest Cache and load really slowly from abroad.
    I assume these images are in single album/work right? This is our way for lazy loading images, so it wouldn't request all 100 images at page load.
    However we use standard WordPress function to get this URLs, so it is strange that this plugin can't handle this. Maybe it replace links only after they became real HTML images. I don't know, never used this plugin.

    Can you send me link to this album/work where it happens?

    With kind regards.
    Post edited by Air on
  • Posts: 8
    Can you send me link to this album/work where it happens?
    This happens on the frontpage album already: https://mirkoreichlin.ch/

    Thanks for looking into it.
  • AirAir
    Posts: 10,970
    I wonder what is the reason of this issue. Cause I suspect 2 things.
    1. WP Fast cache is replacing link in not best WordPress way - less likely as they are so popular.
    2. CDN replace only images that are called in img src & a href attributes, when page is called.

    I think it is the second one.
    I took one of your images as example(removed not needed attributes in this case):
    <li 
    data-thumb="https://mirkoreichlin.ch/wp-content/uploads/2017/11/20170914-DSC05473-1-150x150.jpg" 
    data-brick_image="https://mirkoreichlin.ch/wp-content/uploads/apollo13_images/20170914-DSC05473-1-6n226kf0qhd42dgvv3vyh89lsi73nvbzo0.jpg" 
    data-main-image="https://mirkoreichlin.ch/wp-content/uploads/2017/11/20170914-DSC05473-1.jpg">
    <a  
    href="//1836297926.rsc.cdn77.org/wp-content/uploads/2017/11/20170914-DSC05473-1.jpg">Portugal IV</a>
     </li>
    What is interesting is that one link was replaced by CDN and it is in a href attribute.
    It means that if you would use slider instead of bricks, then all your images(except slider thumbs) would be delivered by CDN, as slider uses this main image exactly.

    It also means that if instead of data attributes for delivering all images info, I would use other links like that, all images would be delivered by CDN.


    However there should be easier solution. I expect there should be some configuration in CDN that will tell its script to look for images also in other attributes. Thanks to this you would have solution exactly for your situation.

    Could you ask around on your CDN hosting if that is possible?
    Then you could add those data-brick_image attributes and others as places where images are linked.

    With kind regards.

    PS. If you need I will remove link to your page from this answer.
  • Posts: 8
    Hi again,

    Yeah, I figured that it probably has something to do with the attributes. Now I'm just not sure if CDN77 or Fastest Cache ist the problem. I contacted CDN77 for now.

    I will let you know, if I have a solution or need more help.

    My problem: I like the bricks ;)

    Kind regards
    Mirko
  • AirAir
    Posts: 10,970
    Great! Hope we can find solution to this somehow :-)
  • Posts: 8
    Hi again,

    After I few messages between CDN77 and Fastest Cache I got the following response from CDN77:
    Hello,

    Yes, we support caching .webp images.

    Also for the two no-caching images I tried to curl them-

    curl -I "https://mirkoreichlin.ch/wp-content/uploads/apollo13_images/DSC01215-6n22e74t0e25h6whob2xrhm2y3zkj55hsg.jpg"
    HTTP/1.1 200 OK
    Date: Wed, 10 Jan 2018 20:27:30 GMT
    Server: Apache/2.4
    Upgrade: h2,h2c
    Connection: keep-alive
    Last-Modified: Mon, 25 Dec 2017 10:24:18 GMT
    Accept-Ranges: bytes
    Content-Length: 56130
    Cache-Control: max-age=2592000
    Expires: max-age=2592000, public
    Content-Type: image/jpeg

    The problem is with the part "Expires: max-age=2592000, public"
    The correct syntax should look - Expires:
    for example: Expires: Wed, 10 Oct 2018 07:28:00 GMT .
    Please change this part to correct one.

    Best,

    Vojta Kaninsky
    Is this syntax problem (not sure, if this is correct) coming from the template? Thanks again for your help.

    Kind regards
    Mirko
  • AirAir
    Posts: 10,970
    Hi again!

    No, this is not set by theme. Either server configuration or cache plugin.

    With kind regards.
Sign In or Register to comment.

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!