1

特定の植物種の画像の数に応じて、データベースから写真を呼び出す PHP で構築しているアプリケーションがあります。それ以外の場合は大きな写真のサイズを 100x100 に変更するスクリプトがあります。このプロセスは、ページの読み込みにかなりの時間を要し、私のコンピューターの CPU は 100% に達し、非常にハードに動作します。

すべての画像が一度にロードされているためだと思います...前の画像が終了したときにのみロードする方法はありますか? または、このような画像をレンダリングするより効率的な方法はありますか? これらをロードするスニペットは次のとおりです。

$imagesArray = explode(", ",$images);
unset($imagesArray[count($imagesArray)-1]); // get rid of the last array key which is blank.
echo '<tr><td>Images:</td><td>';
foreach ($imagesArray as $imgloc)
{
  echo '<a target="_blank" href="plant_images/'.$imgloc.'"><img src="plant_images/'.$imgloc.'" width="100" height="100" alt="'.$row[2].'" title="'.$row[2].'" /></a>&nbsp;';
}

これは、ページに部分的に読み込まれた画像のスクリーンショットです (これは、他の場合よりもはるかに優れています! 真剣に、一部の種には 10 ~ 12 個の画像があり、私のコンピューターはページを読み込むのに約 15 秒かかります。苦痛です)

http://www.captainscall.site11.com/temp_stuff/slow-img.png

私はこれをすでに見つけましが、少し役に立ちました。親切にありがとう、カナーク

4

2 に答える 2

2

私はあなたがすべきだと思います:

  • サーバー側: 画像が既に生成されている場合は、次にキャッシュ バージョンを使用できるように画像をキャッシュする必要があります。次に使用する物理イメージ ファイルを作成できます。

  • クライアント側: ライブラリを使用してイメージを遅延ロードできます

于 2013-03-15T02:54:44.927 に答える
2

ユーザーのブラウザーは通常、画像をキャッシュするため、ユーザーが最初にページにアクセスしたときだけ読み込みが遅くなります。

ただし、表示されているすべての画像のサムネイルを用意することを検討する必要があります。これらのサムネイルを自分で作成する必要はありません。2013 年には、それを行うためのコンピューターがあります。

Google で簡単に検索すると、すべての写真のサイズを変更したコピーをすぐに作成できるソフトウェアが見つかる可能性があります。コーディングを知っている場合は、独自のスクリプトを作成できます。たとえば、PHP で Imagick を使用できます ( http://php.net/manual/en/imagick.scaleimage.phpを参照)。次に、2 つのサイズの画像をサーバーに保存します。1 つはサムネイル用、もう 1 つは高解像度のセットです。

これを行う利点の 1 つは、サーバーから送信されるデータが減少することです (サーバーに多くのユニークな訪問者がいる場合、画像のサイズのために多くのトラフィックが発生します)。また、ユーザーはサイトの読み込み時間が短縮されます (あなたが言ったように、画像が読み込まれるのを待つのは退屈です)。

おそらく、JavaScript を使用してブラウザに画像をロードする順序を伝えることができますが、それでは問題は解決しません。主に、画像が大きすぎるということです。

于 2013-03-15T02:48:40.433 に答える