Facebook の画像にエフェクトを追加するアプリを作成していますが、何がそんなに遅くなっているのかわかりません。ここでアプリを確認できます:(https://apps.facebook.com/filter_box/)。 「usar una foto」をクリックすると、すべての画像を読み込むのに時間がかかります。それが CSS アニメーションなのか、fb クエリなのか、私の Web サーバーなのか、それとも何か他のものなのかわかりません。ロードが非常に遅い原因を確認するためにデバッグする方法を教えてください。よろしくお願いします。
ここの PPD は、usar.php または「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>