How do you tell a section of PHP code to load after everything else loads first?

PHP
1

Hi,
I’m not sure if this is a PHP thing, but I have this API call:

<?php

  $search_terms = "scenic people"; // Add your own security checks to cleanse this input
  $api = new ShutterstockAPI($userpwd);
  $images = $api->search($search_terms);
  //$videos = $api->search($search_terms, 'videos');

  if ($images) {
    for ($i = 0; $i < 7; $i++) {
      $imageid= $images->data[$i]->id;
      $description  = $images->data[$i]->description;
      $thumb = $images->data[$i]->assets->large_thumb->url;
      $thumb_width = $images->data[$i]->assets->large_thumb->width;
      $thumb_height = $images->data[$i]->assets->large_thumb->height;
      print "<td valign='top'>";
      print '<div style="height:88px;width:150px;overflow:hidden">';
      $description=htmlspecialchars($description);
      $imageurl="http://www.shutterstock.com/pic.mhtml?id=$imageid";
      $imageurl=urlencode($imageurl);
      $shutterstockurl="http://shutterstock.7eer.net/c/251696/43068/1305?u=$imageurl";
      echo "<a href='$shutterstockurl' target='_blank' rel='nofollow'><img class='lazy' src='blank.gif' data-src='$thumb' alt='$description' width='150' height='100'></a>"; 
      print '</div>';
      print "</td>";
 
    
}
}
    


?>

And when the API from shutterstock is slow, it slows down my website as well. How do I make it so that this section of code loads after everything else on my page loads? Anyone know?

2

That’s not how PHP works. It’s a server-side language, so everything in the php script runs on the server before anything is sent to the client browser.

A possible way around this would be to put this part in a script called by Ajax.

1 Like
3

PHP is a server-side language, which means that it typically must run before the page loads.

If the speed is due to the api itself, there’s not much we can do.

However, I expect that the speed hit is because of the images. In this case, we could - for example - store the search results in a temporary XML or JSON file, or even a session cookie, and provide the results with JS / AJAX after the rest of the page has loaded.

I see a ‘lazy’ class in the markup, so you’ll want to make sure your solution doesn’t break the lazy-load function. I would also check to make sure the lazy-load is already working, before you start tinkering (a broken lazy-load could be the reason it’s going so slow).

1 Like
4

You could also cache the result for a set period of time if the content doesn’t change too much. What happens then is that the first hit is still slow because it’s hitting the API, but then the results are stored locally in a cache like Memcache, redis, or maybe even a database like MySQL.
Then the next hit doesn’t go to the API but loads the result that was previously cached, which is a lot faster.
You can define how long the cache may be kept before it must be invalidated and the API needs to be consulted again.

5

Checkout the following link which was originally designed to overcome mobile slow rendering but is also ideal for desktops.

6

The lazy loading works fine. I know the hangup over the weekend was because the Shutterstock API was running slow, they even said so themselves. So is there a tutorial on how to use ajax code to get that section of code to load last on a page?

7

I do not know of any tutorials but should imagine a search will reveal a vast amount. I used to use one a long time ago which required updating frequently.

What I like abut the AmpProject is that the Ajax/JavaScript is always up to date and does not require any maintenance. There are also other benefits such as a Free Google Cache for valid web pages and also preference is given to mobile searches.

The learning curve is not bad and Google Webmaster Tools has a specific section detailing valid and problematic web pages.

8

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.