これは基本的に設計上の問題です。
序文
サムネイルのリストを表示する Web ページがあります。画像の数はいくらでもかまいません。
私がする必要があるのはこれですか？
- サムネイルの総数を取得します。
- 各画像の Web URL を取得します。
- 各サムネイルをボックス (div) にロードし、各ボックスをスクロール可能なコンテナー div に動的に追加します。
- ユーザーはできるだけ早くボックスを操作できる必要があります。
ページで他の AJAX 呼び出しが発生しています。
デフォルトの方法では、src各ボックスに を設定してコンテナに追加します。読み込みが停止すると、画像が表示されます。問題は、これらすべての画像の読み込みがネットワークを占有し、他の AJAX 呼び出しがタイムアウトになる可能性があることです。これは許可できません。また、ユーザーにはページの読み込みが完了したことが表示されます (読み込みバーにアクティビティが表示されないようにする必要があります)。
私の解決策
私が思いついた解決策はこれです：
- ローカル イメージをスペース ホルダーとして使用します。
- すべてのボックスの src をローカル イメージとして設定します。
- 最初の画像の src を Web URL に変更します。
- 画像が起動したら
onload、次の画像の src を変更します。
長所：
- 一度に読み込まれる画像は 1 つだけです。
- ユーザーはボックスを操作できます。
短所：
- 一度に 1 つの画像だけでは、帯域幅が無駄になる可能性があります (一度に 5 つの画像についてはどうですか?)
- ユーザーが最後までスクロールすると、他のすべての画像が読み込まれるまで画像が表示されません。
あなたの意見
このソリューションを改善する方法について、専門家の意見が必要です。
要件：
- 他の AJAX 呼び出しに使用できる帯域幅が必要です
- ユーザーはページを操作できる必要があります。
質問:
このソリューションには他の問題がありますか?
これはクロスブラウザですか？
これが他の AJAX 呼び出しに影響を与えないと言うのは正しいですか?