0

ページの要素を配置する機能があります。例えば：

refresh_positions = function(){
    set_pos(arrow_div,mouse_x,mouse_y);
    set_pos(title_tiv,window_width/2,20);
};

これは、要素が常に正しく配置されるように、可能な限り高速に継続的に実行する必要があります。しかし、どのように？

のように速いタイマーを設定するとsetInterval(refresh_positions,10)、遅いコンピューターがフリーズします。より遅いタイマーを設定すると、より高速なコンピューターのエクスペリエンスが低下します。また、モバイル機器のバッテリーの消耗も懸念されます。関数に基づいて要素を配置する正しい方法は何ですか?

4

1 に答える 1

1

setTimeoutまたはを使用してみてくださいwindow.requestAnimationFrame。これにより、前の関数の実行が終了したときにのみ、新しい関数呼び出しがキューに入れられます。このようにして、関数が計画した間隔よりも長くかかる場合、ブラウザ UI はそれほど速くフリーズしません。

var interval = <so many seconds should it take>;

function update(){
    //do you stuff here




    setTimeout( update, interval );
    //or
    window.requestAnimationFrame( update );
}

を使用した 2 番目の方法にwindow.requestAnimationFrameは、可能であれば 1 秒間に最大 60 回トリガーされるという利点があります。ブラウザがそれほど高速に実行できない場合は、それよりも少ない回数でトリガーされます。また、タブまたはブラウザーがフォーカスを失った場合、コールバックはトリガーされません。

于 2013-02-25T16:24:54.757 に答える