Mozilla link prefetching using <link> tag

teedog

I would very much like the browser to prefetch or preload the next image in the particular album to optimize browsing performance. I realize that Test-JS has a JavaScript function for that purpose, but that theme is for testing purposes only at the moment. Would the `` tag be a simple way of making Mozilla-based browsers prefetch the next image? Read about link prefetching here.

I inserted this code in the header section of image.php:

`<?php if (hasNextImage()) { ?>

" />

<?php } ?>`

However, since getNextImageURL() returns the URL to the webpage containing the next image, not the URL to the image itself, I think the browser is just caching the next HTML content of the next page, but not the image.

How do I get the URL to the next image itself? That is, the URL in the `` tag. I looked through the Template Functions Guide but couldn't find any function that does that.

Maybe a function like `printNextDefaultSizedImage()` or `printNextCustomSizedImage()`?

Thanks in advance.

teedog

I was able to get the link of the next default sized image using the following code:

`if (hasNextImage()) {

next_image();

echo '';

}`

However, how do I return the context to the image I was on before I moved forward with `next_image()`?

I tried `set_context(ZP_IMAGE);` but that sends me to the first image in the album even if I wasn't viewing that image.

sbillard

You will have to save $_zp_current_image somewhere then restore it.

However, the approach you are taking will have problems with image pagination. I think a better approach is to use something like:

`$imagarray = $_zp_current_album->getImages(0);

$nextimage = $imagearray[imageNumber()+1];`

You do, of course, need to be sure there is a next image.

teedog

I was able to get the name of the next image using

` $imagearray = $_zp_current_album->getImages(0);

$nextimage = $imagearray[imageNumber()];`

$nextimage is now a text string, the file name of the next image. But how do I get the URL to the default sized image of that name? getDefaultSizedImage() doesn't take parameters and only returns the default sized image URL of $_zp_current_image.

Thanks for your help.

sbillard

YOu can make a new image object from the name:

`$nextimageobject = new Image($_zp_current_album, $nextimage);`

Then use `$nextimageobject->getCustomImage(....);`

or `$nextimageobject->getThumb();`

teedog

Thank you thank you! The following code in image.php's head section seems to be working for me. This should make all Mozilla-based browsers prefetch the next page and image while you are viewing any image in an album, provided there is a next page/image and you are displaying the default sized image.

` <?php // BEGIN prefetch next image<br />
if (hasNextImage()) {

$my_image_array = $_zp_current_album->getImages(0);

$my_nextimage = $my_image_array[imageNumber()];

$my_nextimage_object = new Image($_zp_current_album, $my_nextimage);

$my_nextimage_url = $my_nextimage_object->getSizedImage(getOption('image_size'));

echo ''."n";

echo ''."n";

} // END prefetch next image ?>`

Please let me know if there's anything wrong with it.

aitf311

Works like a charm for me! You just forgot the slash before the n on the links. Any chance of making this into a function? And do you know if mozilla-based browsers load this last?

sbillard

This might be better from an efficiency standpoint:
` $my_image_array = $_zp_current_album->getImages(0);

$n = imageNumber();

if ($n < count($my_image_array) {

$my_nextimage = $my_image_array[$n];

$my_nextimage_object = new Image($_zp_current_album, $my_nextimage);

$my_nextimage_url = $my_nextimage_object->getSizedImage(getOption('image_size'));

echo ''."n";

echo ''."n";

}`

Not sure why you have the two echo statements. Isn't the second enough?

teedog

aitf311: Glad I'm not the only one interested in this, though I probably lack the experience to make this into a neat function.
"And do you know if mozilla-based browsers load this last?"
Yep. Mozilla-based browsers should only start prefetching links when the browser becomes idle, meaning every element on the current page and even on other open tabs are finished loading. See "How is browser idle time determined?" for technical details.

sbillard: Ah, so `if ($n < count($my_image_array))` is more efficient than `if (hasNextImage())`? Thanks for the tip.

If you mean why I have 2 prefetch hints, one for `getNextImageURL()` and one for `$my_nextimage_url`, it's because the first is the URL to the next page, while the second is the URL to the next image itself. I suppose I should choose less confusing variable names.

If you mean why I don't combine everything into 1 echo statement, no reason. Just clearer to write.

zenphoto devs rock.

P.S. Hmm bbpress forums are stripping the slash in \n.

tummblr

I made this feature into a plugin and modified the code a bit. From my rudimentary profiling, the above code took about 0.1 seconds to execute. This version takes about 0.01 seconds.

http://www.tummblr.com/my-code/zenphoto-plugin-link-prefetching-hints/