CODEWITHSUNDEEP
performancedebuggingfacebook-graph-api
Jeronimo Cosio
Jeronimo Cosio

Reputation: 113

What can be making my app so slow

I am making an app to add some effects to your facebook images but I don´t know what is making it sooooo slow, you can check the app here:(https://apps.facebook.com/filter_box/) and when you click on "usar una foto" it takes a lot of time to load all the images, I don´t know if it is the CSS animations, the fb query, my web server or something else, so I would like to know if someone could help me out how can I debug it to see what is making it load so slow, thank you all so much in advance!

PPD here is the code using it in usar.php or "usar una foto"

<?php 
    include_once("config.php");
?>
<!DOCTYPE html>
<html lang="es" xmlns:fb="http://www.facebook.com/2008/fbml">
  <head>
    <meta charset=utf-8>
    <title>Minstagram</title>
    <link rel="stylesheet" href="style.css" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>   
  </head>
  <body>
  <div id="fb-root"></div>
  <script>
      window.fbAsyncInit = function() {
        FB.init({
          appId: '<?php echo $facebook->getAppID() ?>',
          cookie: true,
          xfbml: true,
          oauth: true
        });
        FB.Canvas.setAutoResize();
        FB.Canvas.scrollTo(0,0);

      };
      (function() {
        var e = document.createElement('script'); e.async = true;
        e.src = document.location.protocol +
          '//connect.facebook.net/en_US/all.js';
        document.getElementById('fb-root').appendChild(e);
      }());
    </script>
    <div id="main">
        <?php 
        include_once("menu.php"); 

        $albums = $facebook->api('/me/albums?limit=0');

        ?>
        <ul id="breadcrumbs-two">
        <li><a href="/">Inicio</a></li>
        <li><a href="usar.php">Álbumes</a></li>
        </ul>

        <ul class="polaroids" >
        <li> <a href="album.php " title="Todas tus fotos"><img src="" alt="" /> </a> </li>

        <?php

        foreach($albums['data'] as $album)
        {
            // get all photos for album
            $photos = $facebook->api("/{$album['id']}/?fields=picture,name,count");
            $foto = $photos['picture'];
            $nombre = $photos['name'];


            $id = $photos['id'];
            $count = $photos['count'];

            $nombre = $nombre." (".$count.")";


            echo "<li> <a href=\"album.php?numero_album=$id&nombre_album=$nombre \" title=\"$nombre\"><img src=\"$foto\" alt=\"$nombre\" /> </a> </li>";
        }
        echo "</ul>";
        ?>  
    </div>
  </body>   
</html>

Upvotes: 0

Views: 290

Answers (1)

cpilko
cpilko

Reputation: 11852

Your app is running slow because you are making api calls from within a foreach loop. Each time you make a call, your server sends a request to Facebook and suspends execution until it gets a response.

You should be using the batch.request syntax or FQL to return all the photos at once and then process this large response in your script.

Upvotes: 1

Related Questions