150 行のリストがあり、各行には 3 つのスキン選択アイテムがあります。
各結果を表示する前に大量の処理を行う必要があるため、「このページのスクリプトがビジーであるか、応答を停止している可能性があります。スクリプトを今すぐ停止するか、引き続きスクリプトが動作するかどうかを確認できます」というエラーが表示されます。完了。" jquery.js ファイルを参照します。
jQueryの作業を行うことでこのエラーを回避することは可能ですか?
ありがとうございました。
150 行のリストがあり、各行には 3 つのスキン選択アイテムがあります。
各結果を表示する前に大量の処理を行う必要があるため、「このページのスクリプトがビジーであるか、応答を停止している可能性があります。スクリプトを今すぐ停止するか、引き続きスクリプトが動作するかどうかを確認できます」というエラーが表示されます。完了。" jquery.js ファイルを参照します。
jQueryの作業を行うことでこのエラーを回避することは可能ですか?
ありがとうございました。
処理を複数の部分に分割し、0 ミリ秒または 1 ミリ秒の setTimeout を使用して、ブラウザにそれら以外の処理を行うための時間を与える必要があります。
非常に簡単な方法は、非同期ライブラリのforEachSeries
メソッドを使用することです。
async.forEachSeries(yourData, function(item, cb) {
// process item
async.nextTick(cb);
});
yourData
行を含むjQueryオブジェクトである可能性があり、item
1行のDOM要素になります。
ページの読み込み時にすべてをダウンロードするのではなく、必要に応じて JavaScript をダウンロードします。
Web サイトのパフォーマンスの第一人者である Steve Souders は、この問題とその解決方法について、彼の著書「Evenfast Web Sites」に書いています。彼は、タイムアウトを使用して他のプロセスにも時間を与えるソリューションについて説明しています。
これは、この問題を扱っている本の一部です。
jQueryについては知りませんが(jQueryで利用可能なラッパーがある場合)、バニラJSにはWebWorkersの概念があります(サポートはIEを除いてかなり良いです-こちらを参照)。
ここで、UI スレッドをブロックしない計算への追加スレッドを開始します。計算が完了し、結果表示だけが残ったら、ワーカーから UI スレッドにデータを送信し、結果を表示するだけです。
詳細については、MDN チュートリアルをご覧ください。