問題タブ [reflow]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - DOM のリフロー/リフレッシュを行う
私は JavaScript と D3 を初めて使用します。DOM 要素のいくつかの属性を変更してから、ページのリフロー/リフレッシュを行って、更新された変更を確認できるようにしようとしています。秘訣は、onclickevent、ボタンのクリック、マウスの動きなどを一切行わずに、これを自動的に行う必要があるということです。
インターネットで見つけることができるすべてを試しましたが、何も機能しませんでしたが、奇妙なことに、要素の属性を変更する行の直前に alert() を呼び出すと、[OK] をクリックすると、要素が画面上で再配置されます。alert() を呼び出して [OK] をクリックすることなく、これを行う必要があります。
問題のコードは次のとおりです。
アラート行を削除すると、要素が移動しません。そのままにして [OK] をクリックすると、すぐに要素が再配置されます。
助けてくれてありがとう!!!!
javascript - ブラウザのリフロー/再レンダリングを最小限に抑える
私は現在、修士論文のコードに取り組んでいます。効果的な DOM 操作についていくつか質問があります。
1) 互いに近接している多数のノードで一連の DOM 操作を実行する必要があると考えてください。これらすべてのノードの最上位のparentNodeのディープコピーを作成し(DOMの外部に保持し)、そのサブツリーで操作を実行してから、DOMの対応するノードと交換することは理にかなっていますか. これにより、ブラウザのリフロー/再レンダリングが最小限に抑えられますか?
2) ノードの innerHTML を変更すると、サブツリーを操作するよりもパフォーマンスが向上しますか?
3) バニラ javaScript (フレームワーク/ライブラリなし) での効率的な DOM 操作について、他に良いアドバイスはありますか?
前もって感謝します!
html - DOM リフローとは
display:none
2 つの CSS プロパティの違いについて読んでいて、 DOM リフローという用語visibility:hidden
に遭遇しました。
声明は
display: none
DOM リフローを引き起こしますが、visibility: hidden
しません。
だから私の質問は:
DOM リフローとは何ですか? どのように機能しますか?
android - Android Webview でのテキスト リフロー
Android KitKat のリリース以降、Web ビューからテキスト リフローが削除されました。残念ながら、Lollipop では問題は解決されません。なんらかの理由で、Google はテキストのリフローが不要であると判断したようです。
https://code.google.com/p/android/issues/detail?id=62378
Webviews を使用して、アプリケーションによって生成された HTML コードを表示しています。そのため、HTML コンテンツと Android アプリケーションの両方を完全に制御できます。ユーザーがピンチズームした後にテキストのリフローを実装する方法を知っていますか? おそらく、HTML を変更するか、Javascript や CSS を使用して実行できますか? 数日間 Web を検索し、提案された解決策をいくつか試してみましたが、何も正しく動作していないようです。
または、ピンチズームといくつかの基本的なテキスト形式 (色、太字、サイズなど) の両方をサポートする別のコントロールはありますか?
最後に、Google がピンチズーム テキスト リフローを削除した理由を知っている人はいますか? Android 2.2 で問題なく動作しました。
javascript - DOM 要素が増えるとパフォーマンスの問題が発生する
asp.net mvc、javascript、jQuery (ローカル マシンでホスト) を使用してアプリケーションを作成しました。基本設計は、ユーザーがあるページから別のページに移動するときに HTML ページを非表示にして表示することにより、破棄するのではなく、すべての HMTL 要素を DOM オブジェクト (ブラウザー) に保持することです。
私たちのアプリケーションは日々成長しています。以前は、プロジェクトでパフォーマンスの問題は見られませんでした。しかし、最近では、あるページから別のページに移動するのに時間がかかります。今日、自分のページで DOM 要素を確認したところ、20,000 を超えています。
質問:
HTMLページを非表示/表示することは、破棄して再作成するよりも優れた設計ですか?
20,000 DOM オブジェクトを使用した JavaScript からの DOM 操作、リフローと再印刷に関してパフォーマンスへの影響は何ですか?