Lightbox image and file size.
  • I don't know if this is a bug or simply not a feature, but it seems that the lightbox image that pops up (after you click a thumb) is loading the full size original. This causes those 10 mega pixel images to take forever to load.

    I thought the lightbox was supposed to request an image size that fits the browser screen constraints then the server uses the GD library to make the image only as big an it needs to be.

    Currently it seems to be squishing the image within an img property tag (). I have confirmed that the original is being downloaded by the lightbox by looking that the browser cache (about:cache in firefox).

    Thanks Victor. Keep up the awesome work and support.

    -kc

    v09b65
    http://www.kevincornwell.com/pictures/
  • sure, but if you think of it, if i use the GD libraries (which i did before) the same image has to load in your server's memory (that is 10MB of server memory), be parsed and sent back to your user's browser, where it'll be loaded. and that process is repeated over and over, changing the dimensions every time your user changes its window size. which is, to resume, more burden, more time and more memory.

    and then, when your user clicks in the image for a full size, it has to load *again* the full image.

    with the current method, your user just has to load it once. less server burden, less local burden, less waiting time. belive me, before i had it the way you describe it, and decided to change it the way it is.

    i have a suggestion: upload smaller pictures. it would be easier to add a "download hi-res version" link so everybody's happy (if you want users to d/l the hi-res, if not, i would ask you why do you upload such huge pictures in the first place).

    so batch-resize them once[1], upload 1024x768 versions (more than enough for an online gallery) and save you some bandwidth and time, your user lotsa bandwidth and time, your server some cycles and memory, and php some hard working.

    after all, images in the web don't look better just for being bigger.

    but just in case i did not convince you... open the
    /libraries/ajax.functions.js
    file and on line 19, set
    scale_big_images
    to
    true
    (you need to have
    $settings['create_thumbnails']
    set to
    true
    in
    /config/settings.php
    . simple as that. an undocumented feature, but i never throw away code that can work for someone. hehe...

    [1] there are several programs, utilities and even web services that can do the batch editing, and it'll be just once for each photo.
  • Thanks for the quick response. I tried it with the #settings['create_thumbnails'] set to true and it works much faster! I am very happy with the results. My server is a dual 450mhz with 512 RAM. The bottle neck in my web server setup is the out going pipe (1mb/sec). Therefore the small hit in server performance is more than made up for in faster network transfer with the smaller image.

    I truly think you should have this documented. It made my pictures load much faster on the client for a more responsive gallery browser. (and when you release the next version that uses the cached thumbs for the lightbox mini thumbs, it's going to kick ass even more!).

    PS-I like having the originals on the server so that if someone want the full size huge files for a desktop or to print professionally they have that option by clicking the medium lightbox image. Plus I hate resizing before uploading to my server. To much work when you have 5,000 photos like me.

    BTW, the image has to be loaded into memory anyway before it can be streamed out. And the fact that a user rarely ever re sizes a browser after starting a session make that point not important.

    BTW again, I found another issue that will be fixed soon according to another post you mentioned the lightbox thumbs are reloading anew with every next click. This slows things down dramatically.


    off topic curious... does it take longer to make a huge photo into a tiny thumb or a huge photo into a medium photo?


    Thanks Victor. Have a great Friday!
    -kc
  • i think i have *a wholla lotta buncha* things to go documented, since after the two critical issues and the three improvements i have on the list, documentation is paramount (pun intended).

    yes, the server has to load it into memory, but not php, which is the case with GD image manipulation. technically a 10MB picture occupies in memory three times the size if you're twitching it in real color since it divides by the color bits.

    about the thumbs bug, i've been trying for it to work like an automated scroll (like in flickr) but with no success. i guess my best shot is to ask just for the new thumb. i'll include it in the list.

    it takes the same tiem for PHP and GD to load a huge photo, a little (unnoticeable) less to output a smaller sampled image, and more time/bandwidth for the user to load a bigger sampled image. so in resume, 10MB photo is almost the same for GD wheter is outputting a thumbnail or the same picture.