2

私は奇妙な問題に直面しました。力指向のグラフ レイアウト スクリプトを作成しました。ノードの配置がほぼリアルタイムでどのように行われるかを確認したいので、力を計算し、要素をそれぞれ 1 回だけ再描画します。 requestAnimationFrame を使用した画面の更新 (ただし、「while」ステートメントを使用して 1 ステップでレイアウトを計算し、すぐに描画する方が効率的であることはわかっています)。

したがって、問題は、ページをリロードした後に初めて発生したときに、希望どおりに機能することです。たとえば、60 ノードのグラフの計算には 8879 ミリ秒かかり、すべてのノードが最終目的地にどのように移動するかを確認できます。 、しかし、ページをリロードせずに同じグラフを再構築しようとすると、結果として生じる各計算がはるかに高速に行われます。

8879ms
5797ms
4649ms
4330ms
3923ms
....
3046ms
....
etc

したがって、ノードはほぼ瞬時に安定します。小さなグラフの違いは、10 ~ 20 倍にもなる可能性があります。16 ノード グラフ:

3041
1583
1101
818
660
551
524
436
373
360
352
305
167

ページをリロードすると、プロセスが繰り返されます。そもそもなぜそれが起こるのか(ブラウザはキャッシュしてコードを最適化しますか?)、可能であればそれを回避する方法を考えています。同じ結果でIE、FF、Chromeで試してみました。

ありがとう

4

3 に答える 3

0

はい、そうでした。それが js エンジンのパフォーマンスを向上させる鍵です。

google chrome の V8 js エンジンは JavaScript をネイティブ マシン コードにコンパイルすると聞いたことがあります。これが chrome が非常に高速な理由です。

http://en.wikipedia.org/wiki/V8_(JavaScript_engine)

あなたの問題は、ブラウザーではなく、javascript の知識にあるようです。javascript は退屈で、完全に習得するのが難しい場合があります。場合によっては、コードが期待どおりの順序に従わずに実行されることがあります。

于 2013-10-04T14:37:11.343 に答える
0

結果を確認できるほど計算が遅いとは期待しないでください。遅かれ早かれ、あなたは常に間違っていることが証明されます。requestAnimationFrame可能な限りスムーズに描画する必要があるアニメーション用で、任意の FPS が得られる可能性があります。何かが発生する速度を制限する必要がある場合は、 を使用するsetIntervalか、または を使用しますrequestAnimationFrameが、最後のフレームから経過した時間に比例して各ノードを移動する量を減らします。

于 2013-10-04T14:40:47.933 に答える