私は多くのトラフィックを伴うソーシャルコミュニティを持っています。サイトのレイアウトの右の列には、40×40ピクセルの友だち、あなたの地域の人などのサムネイル画像をプリントする「オンラインリスト」があります。合計30-40枚の画像。各ページビューで30〜40の動的に読み込まれた画像の読み込みを高速化します
右の列が読み込まれる直前に、これらの画像がすべて読み込まれるとハングします。私はより速いソリューションをIE6まで互換性が必要です。
ページが読み込まれた後にajaxでイメージを読み込むことができますか、インラインgfx（IE6でサポートされています）などの方法を使用できますか？
AJAX経由で画像を読み込むことができます。たとえば、jQueryを使用して簡単に実行できます。表示するすべての画像のdivを定義します。おそらく、ページが最初に表示されたときに、実際の画像の代わりに「Loading ..」画像などを表示することができます。
jQueryには多くのオプションがあります。 lazy loading用のプラグインがあります。preload imagesがあり、画像が表示されたら簡単にエフェクトを追加できます。
このページ領域をバックグラウンドで非同期にロードします。
はい、イメージの読み込みを延期することはできますが、より簡単なユーザーエージェント/スパイダーがページを見ることができるように、<noscript>タグ内に通常のHTMLバージョンを含めることができます。
ブラウザは通常、各ドメインへの接続数が少ないため、別の手法では複数のサブドメインから画像を読み込む方法があります。たとえば、サイトがfoo.comにある場合は、a.foo.com、b.foo.com、c.foo.comから静的画像をロードしてください。
私は30-40の動画を表示しないことも考えますサーバもクライアントも効果的にこれらの写真をキャッシュすることはできない。
イメージのサーバー側のサイズ変更に関する問題が発生した場合は、サイズ変更後にサムネイルを保存した後に、 は次の負荷のサムネイルのみを表示します。
ほとんどのスクリプトでは、小さな画像は問題ありません。 40フルサイズの画像を にリサイズすると負荷が大きくなります。
擬似コード：いない場合はその画像のサムネイルがはい、 サムネイル を果たす場合は、サムネイルを作成し、
これらのイメージをキャッシュするには、apache rewriteを使用して特定の.jpg | .png | etcのリクエストをサイズ変更スクリプトに追加します。間違いなく他のサーバにも同様の機能があります。