0

スタイルを設定し、レンダリングしてユーザーに表示する前に、ページの DOM を操作する機会が1 度あります。明らかに、ページがレンダリングされた後の DOM 操作は非常にコストがかかるため、このウィンドウ内ですべての動的な楽しい操作を実行したいと考えています。これは主にモバイル デバイスを対象としているため、この最適化は私にとって価値があります。

基本的な概要/タイムラインは次のとおりです。

function CalledBeforePageRendered(){
    DoAsyncDataBaseWorkWithCallBack(AsyncDataBaseCallBack);
    DoLocalizationsAndOtherSYNCRONOUSActions();
}


function AsyncDataBaseCallBack(results){
    // code that processes the results element
    // code that manipulates the DOM *before* it's styled.
}

問題は、DoAsyncDataBaseWorkWithCallBackandDoLocalizationsAndOtherSYNCRONOUSActions がすぐに終了してからCalledBeforePageRendered戻り、その後のスタイリングが適用されることです。

スタイリングが適用された後、ページがユーザーに表示され、AsyncDataBaseCallBack呼び出されて div タグやその他の DOM 変更が適用されます。様式化の前にこれらの変更を行う必要がありました

CalledBeforePageRendered' ' が終了するのを待ってAsyncDataBaseCallBackから戻るようにする方法はありますか? 通常、ここでクロージャーが機能することはわかっていますが、関数の外部で定義されたコールバックを使用してクロージャーを機能させる方法がわかりませんCalledBeforePageRendered。

4

1 に答える 1

1

同期 JavaScript XmlHttpRequest (XHR) 呼び出しを実行しようとしている場合 - それは非常に可能ですが、ページがレンダリングされる前にクライアント側で DOM を操作しようとしていると仮定すると - サーバー側でそれをしないのはなぜですか (最初に HTML を生成しています)。それができない場合は、ページがレンダリングされる前に同期 JavaScript XHR を実行してページを更新しないことを強くお勧めします。これを行うと、XHR の実行中にブラウザー ウィンドウがロックされ、ページの読み込みに大幅な遅延が発生するだけでなく、エンド ユーザーを苛立たせます (ハード 'ロック' のように見えるため)。レンダリングする前に DOM を操作しても、それほどコストはかかりません。これ'

繰り返しますが、強調したいのは、この作業をサーバー側 (クライアント側ではなく) で行うようにすることです。これを 2 次呼び出しとして実行することができず、実行する必要がある場合は、ローディング イメージを追加し、XHR を非同期で実行させます。あなたの目標を誤解している場合は、お知らせください。

于 2012-07-12T19:11:46.177 に答える