サーバーの時刻同期を使用してJavaScriptで時計を実行する最善の方法

私はjsがそれを見るようにしたいと思います:

  • 開始時間はサーバ時間です(サーバはページのソースコードでそれを供給します)。
  • 毎秒更新されます。
  • (環境設定、必須ではありません)gecko、webkit、presto、IEの最新バージョンと互換性があります。

私はすでに多くの実装をチェックしましたが、どれが最も効率的かを知りたかったのです。それは、PCからのリソースを減らすものと存在するすべてのものの中でより正確なものです。

1
単純なsetIntervalでは何も問題ありません。私はちょうど最も効率的な方法を知りたがっていました。できるだけ効率的にするためにjsスクリプトを作成するように求められました。私はすでにいくつかのWebサイトでinternet.comのようなGoogleを使っていくつかをチェックしてきましたが、もしそれがあれば(例えば、Dateオブジェクトを使って)
追加された 著者 brunoais,
あなたがチェックした多くの実装を共有するように気をつけますか?単純な setInterval の何が問題なのですか。本当に厳格にしたい場合は、数分(2番目の間隔または内部カウンタ)ごとに経過して同期を確認します。
追加された 著者 davin,
それは効率的であるほど簡単です。それはネイティブの解決策です。
追加された 著者 davin,

1 答え

1秒ごとに刻々と変化するクロックは基本的にアニメーションなので、再帰的な requestAnimationFramesetTimeout <// a>)。

var previousTime = 0;

function update(time) {
    if (time - previousTime >= 1000) {
        redrawClock(time);
        previousTime = time;
    }
    requestAnimationFrame(update);
}

setInterval の独自の遅延は正式な値よりも長くかかる可能性があるため、 setInterval を使用すると、各繰り返しで Date オブジェクトを作成する必要があります。

JavaScriptのタイマーに関するJohn Resigの華麗な記事を参照してください。

requestAnimationFrame on the contrary is:

  1. より効率的で、タスクに最適化されています。
  2. コールバックに正確なタイムスタンプを提供します。
1
追加された
ブロックの中に previousTime = time を置いてください。そうしないと、その時計は再描画されません。
追加された 著者 Milosz,
@Milosz正解、ありがとう!スニペットを更新しました。
追加された 著者 katspaugh,
JavaScript - 日本のコミュニティ
JavaScript - 日本のコミュニティ
2 参加者の

日本人コミュニティのjavascript