3

JavaScriptコードをデバッグするためのツール（FireBug、Chromeコンソールなど）はたくさんありますが、プロセスをデバッグするためのツールはあります。これはおそらく、プロセスのボトルネックを見つけるためにリソース（CPUなど）の使用状況を監視する必要があります。

要素を移動するためのJavascriptアニメーションを作成します（より単純な場合はメニューの開閉）が、移動がスムーズになりました。さまざまな要因が過負荷を引き起こす可能性があります。たとえば、CSS3の勾配が大きくなります。しかし、レート制限プロセスを検出する方法は？

これは確かにほとんどのウェブサイトの問題です。Webページを開くときに、JavaScriptプロセスが過負荷になると、ページの読み込みが停止します。ほとんどのアニメーション/メニューアクションが壊れています。

JavaScriptアニメーションがスムーズに実行されていない場合、どのように問題をデバッグしますか？

または、より一般的な質問ですが、実行中のJSプロセスのリソース使用量を監視して、Webページを軽量化する方法（リソースが限られているコンピューターでの負荷を高速化する方法）を教えてください。

4

3 に答える 3

5

Chromeではタイムライン->フレームを使用します。ポールアイリッシュはこれについて多くの素晴らしい話をしています、ここに1つありますhttps://www.youtube.com/watch?v=Vp524yo0p44

また、アニメーションを行うときにsetTimeout / setIntervalを使用しない場合、精度が十分ではありません。代わりにrequestAnimationFrameを使用してください。requestAnimationFrameの詳細については、こちらをご覧ください。http://paulirish.com/2011/requestanimationframe-for-smart-animating/

編集：Paulによるこの講演は、ブラウザの速度とデバッグ速度に関しても非常に興味深いものです：https ://www.youtube.com/watch?v=MllBwuHbWMY 、そしてここに2D変換と絶対測位についてのごく最近の議論があります：https： //www.youtube.com/watch?v=NZelrwd_iRs

于 2013-01-11T13:40:21.520 に答える
1

異なるマシン=>異なるパフォーマンス=>異なるボトルネック

アニメーションがスムーズに実行されない場合は、グラフィックまたはアニメーション自体を低くしようとします。ユーザーがあなたと同じくらい強力なマシンを使用していると誰が言いますか？したがって、彼らはあなたよりも早く問題にぶつかる可能性があります。

ただし、特定のプロセスの負荷を個別に表示できるため、ProcessExplorerをお勧めします。一般に、Windowsが提供するデフォルトのタスクマネージャーと比較して、より洞察に満ちたツールです。

于 2013-01-11T13:34:38.720 に答える
0

私はWindowsのタスクマネージャーのみを使用していますが、 http：//www.compuware.com/application-performance-management/ajax-performance-testing.html（JavaScriptだけでなく）を使用することもできます。

于 2013-01-11T13:32:27.920 に答える