12

私は自分のページでハイチャートを使用しています。ちょっと重いです。

ユーザーがボタンをクリックすると、ハイチャートが動的に読み込まれ、ユーザーがcloseボタンをクリックすると、チャートが削除/非表示になります。

どちらがより良い選択肢になるか知りたいです。

  1. ユーザーがクリックしたときにグラフを非表示にしますか？ページの残りの部分の速度が低下しますか（ハンドラーと一緒に重いJavaScriptが存在するため）、または

  2. remove()これにより、ページが明るくなります（ただし、ここで、ユーザーがボタンをもう一度クリックすると、グラフを再度読み込む必要があります）または、

  3. を使用detach()して、ハイチャートをリロードすると、より高速に動作しますremove()（ただし、jQueryハンドラーが常に存在するため、ページが重くなりませんか？）

私はjQueryのドキュメントから知っています、

。削除する（）

.remove（）メソッドは、DOMから要素を取り出します。要素自体とその中のすべてを削除する場合は、.remove（）を使用します。要素自体に加えて、要素に関連付けられているすべてのバインドされたイベントとjQueryデータが削除されます。

.detach（）

.detach（）メソッドは.remove（）と同じですが、.detach（）が削除された要素に関連付けられたすべてのjQueryデータを保持する点が異なります。このメソッドは、削除された要素を後でDOMに再挿入する場合に役立ちます。

。隠れる（）

一致した要素は、アニメーションなしですぐに非表示になります。これは、.css（'display'、'none'）を呼び出すのとほぼ同じです。

4

2 に答える 2

7

オブジェクトを時々非表示/表示したいだけの場合は、jQuery.hide()とを使用して.show()ください。.hide()これは最も単純で、とにかくオブジェクトを保持するのであれば、 andを使用するだけでもかまいません.show()。オブジェクトが大量のメモリを消費しない限り、問題になることはありません。

.remove()（後で同じオブジェクトを保存してからDOMに再挿入する間）オブジェクトに関連付けられたデータの一部が破壊され、ページに簡単に再挿入できない可能性があるため、ほとんど役に立ちません。

.remove()前のオブジェクトをガベージコレクターによって実際に破棄し、必要に応じて最初から再作成するのが最もメモリ効率の高い操作ですが、大量のメモリを消費するか、大量（たとえば数千）のオブジェクトがない限り、意味のあるメリットがなくても、この方法でそれを行うのはおそらくもっと手間がかかります。

.detach().hide()（後で同じオブジェクトを保存してからDOMに再挿入する間）は機能しますが、それよりも作業が多く.show()、正直なところ、2つのオプションの違いが見つかるとは思えません。

于 2012-08-31T07:28:26.393 に答える
7

3 はレンダリングと再描画をトリガーします。したがって、パフォーマンスが問題になる場合は、.hide() を使用してください。これにより、一部の dom 操作が「節約」されます (および 2 回の再描画が行われる可能性があります)。チャートのリスナーも忘れないでください。

ただし、 forperformance.addClass('hidden')と.removeClass('hidden')css ルール ( .hidden {display: none}) を使用すると、最適に機能することがわかりました。（スクロールで隠れていない限り）。

于 2012-08-31T07:47:34.037 に答える