各ユーザーが最大数百の連絡先を持つことができるオンライン チャット アプリケーションを中心とした Web サイトを持っています。各連絡先には、独自のプロファイル画像があります。連絡先のプロフィール画像が名前の横に読み込まれるようにしたい。ただし、ユーザーがサイトをロードするたびに 100 枚以上の画像をダウンロードするのは負荷がかかるようです (調査によると、ユーザーの 40% がキャッシュを利用していないことが示されています)。各画像のサイズは約 60x60 ピクセルです。
Google で検索したり、Facebook にサインオンしたりすると、数十の画像がほぼ瞬時に表示されます。高速サーバーと良好な接続だけでなく、非常に多くの画像をユーザーに配信するための最適な方法は何ですか?
私が思いついた可能なアプローチは次のとおりです。
- 各ユーザーのプロフィール画像をデータベースに保存し、php ファイルに 1 つの画像を作成してから、ユーザーにそれをダウンロードしてから、css を使用して各プロフィール画像を表示します。ただし、これはサーバー上で非常に負荷がかかるようであり、このような大きなファイルを何度も参照すると、ユーザーのブラウザーに負担がかかる可能性があります。
- Apache ではなく nginx を使用して画像をサーバーに保存します (nginx は通常、このような静的コンテンツをサーバーに送信するのに適しています)。ただし、これはソリューション自体というよりも、ソリューションの最適化のように見えます。
また、永続的な http 接続を介してデータを配信できるため、サーバーに対して複数のファイルに対して複数の要求を行う必要がないことも認識しています。ただし、1 つの永続的な接続で配信できるファイルの正確な数。この永続的なモデルは、画像を個別のファイルとしてロードするだけで、必ずしも悪い考えではないということでしょうか?
関連する問題に関する個人的な経験に関する提案、解決策、および/またはメモは大歓迎です。ここではスケーラビリティと、クロスブラウザーのサポート (IE7+、Opera、Firefox、Chrome、Safari) が非常に重要です。
編集：私はJQUERYを使用していません。