1

私は現在、同じページに大量の写真をロードする必要があるポートフォリオサイトで作業しています。

これらの画像はPHPを介して動的に読み込まれます。現時点では、これらの画像のサムネイルバージョンを事前に保存して、読み込むことを選択しました。

ただし、私の懸念は、サイトに多数のユーザーがいる場合、これは最適なソリューションではない可能性があることです。基本的に、各画像の複製にユーザーがアップロードした画像の数を掛けたものになります。

あなたへの私の質問は、この問題に対するより良い解決策があるかどうかです。スペースをあまり犠牲にすることなく、できるだけ速くページをロードする方法はありますか？

トンありがとう。

4

5 に答える 5

2

たくさんの画像でいっぱいの Web ページの読み込みは遅くなります。この理由は、これらのイメージを転送するために必要な帯域幅のためです。

いくつかのオプションがあります

  1. タイル モードで完全な画像を読み込みます。これらの画像は、「サムネイル」ビューに収まるようにサイズ変更された完全な画像になります。これの利点は、保存する画像が 1 つだけであることですが、その画像はフル サイズであり、読み込みに時間がかかります。

  2. あなたが言ったようにサムネイルをロードします。これの利点はパフォーマンスですが、各イメージのコピーを 2 つ保存する必要があります。また、サムネイルの作成方法によっては、ユーザーが独自のサムネイルを提供するために画像の 2 つのコピーをアップロードする必要がある場合があります。

  3. サムネイルを読み込みますが、アップロード時に動的に生成します。基本的に、イメージの 2 つのコピーをディスクに保持していますが、php のイメージ変更 API を使用して動的に作成しています。これにより読み込みは速くなりますが、それでもディスク容量を消費します。また、サムネイルを提供するためのユーザー/管理要件を最小限に抑えます。

  4. ページがリクエストされると、オンデマンドでサムネイルを読み込みます。私は試したことがないので、このアプローチにはいくつかのテストが必要です。基本的には、php 画像変更 API を呼び出して (またはネイティブ ソリューションに外部委託することをお勧めします!)、使用する 1 回限りの (またはキャッシュされた) サムネイルを作成します。「OMG、それにはとても時間がかかります!」と言うかもしれません。このアプローチは、適切なキャッシュ メカニズムを適用して、同じサムネイルを常に再作成しないようにすれば、実際に使用できると思います。帯域幅を抑えます。ここでの制限要因はネットワーク接続であるため、完全な画像を送信するよりも高速になる可能性があります (サムネイル作成の制限要因が CPU/メモリ/ハードディスクになるため)。

#4 は興味深いコンセプトであり、検討する価値があると思います。

于 2012-04-26T20:37:20.767 に答える
1
  1. 大きな画像のサムネイルをその場で生成します。（いくつかのヒント）
  2. 画像を非同期でロードします（JAILを試してください）
  3. ページ付け
  4. キャッシングもオプションですが、サイトが2回目にロードされたときから機能します。
于 2012-04-26T20:30:17.093 に答える
1

私が思うのは：

A.キャッシュを利用する（システムキャッシュ、ヘッダー内キャッシュ、HTTPキャッシュ..すべてのキャッシュ）

B.常にThumbを生成しないでください

GearmanC.またはなどのジョブキューイングシステムを使用してbeanstalkd親指を生成し、すぐに実行する必要がないようにします。

D.使用Imagickはより効率的です

E.パジネート

F.例では、元のファイルが変更された場合にのみthumbを生成します

$file = "a.jpg" ;
$thumbFile = "a.thumb.jpg" ;
$createThumb = true;
if(is_file($thumbFile))
{
    if((filemtime($file) - 10) < filemtime($thumbFile));
    {
        $createThumb = false;
    }
}


if($createThumb === true)
{
    $thumb = new Imagick();
    $thumb->readImage($file);
    $thumb->thumbnailImage(50, null);
    $thumb->writeImage($thumbFile);
    $thumb->destroy();
}
于 2012-04-26T20:31:45.507 に答える
1

すべての画像のスプライトまたはコラージュを使用することを検討してください。これにより、1 つの大きな画像のみが読み込まれ、帯域幅が節約され、ページの読み込み時間が短縮されます。

また、すでに提案されているように、ページネーションと非同期読み込みにより、ある程度改善される可能性があります。

参考文献:

于 2012-04-26T20:33:33.883 に答える
1

はい、サムネイルをキャッシュすることは良い考えであり、正しく行われればうまくいきます。この種のものは、水平スケーリングに最適な場所です。

  1. CDNの使用を検討する必要があります 。(または、似たようなものを実装する可能性があります。) キャッシュ システムは、一般的に要求されるサイズの画像を生成し、後で要求される頻度が低くなった場合にそれらを削除します。
  2. また、水平方向にスケーリングして、このサービスをネットワークまたはクラウド内の別のサーバーまたは vserver に移植することもできます。

これは、ディスクを集中的に使用し、帯域幅を集中的に使用するものであり、画像配信です。ビデオほど悪くない！

于 2012-04-26T20:33:36.840 に答える