1

GPU にクエリを実行して、Web ページのビューポートが現在画面に表示されているかどうかを確認する方法はありますか? たとえば、iframe のキャンバスに 3D シーンのレンダリングがある場合、ハードウェア (iframe 内で、ビューポート内のピクセルまたは頂点のみ) にクエリを実行して、画面上にいるか、画面外にスクロールしているかを確認する方法はありますか? ?

これが頂点シェーダーレベルでできることなのか気になります。WebGL はオフスクリーンのビューポートでもシェーダー プログラムを実行しますか? キャンバスの下にスクロールされているか、ビューポートが別の Web ページ ブラウザー ウィンドウによって遮られているとしましょう。webgl の合成部分にクエリを実行して、それが表示されているかどうかを確認したり、「RenderObject」ツリーを反復して画面上に表示されているかどうかをテストしたり、この値を返したりする方法はありますか? 作業中のプロジェクトのパフォーマンスを大幅に向上させようとしていますが、画面に表示されているものだけをレンダリングしようとしています。

考えられるアイデアはありますか?これは可能ですか?ありがとう!

4

2 に答える 2

1

キャンバス/WebGL レベルでこの質問をする必要はありません。たとえば、別のフレームを描画する前に画面にスクロールして戻る可能性があり、ブラウザーは表示するコンテンツを持たないことを望んでいないため、提供されていないためです。描かない。

.scrollLeftキャンバスが表示されているかどうかを判断するには、スクロール可能な領域の DOM ジオメトリ プロパティ (例: ) を参照する必要があると思います。上記のプロパティには、ページ構造の知識をハードコーディングしなくても一般的にこれを行うことができる十分な情報があります。

また、requestAnimationFrame描画/シミュレーションのスケジューリング専用に使用していることを確認してください。ページが非表示/最小化/別のタブ/明示的に非表示の場合、アニメーションを一時停止します。

于 2012-11-03T01:45:52.147 に答える
1

window.requestAnimationFrame はブラウザにアニメーションを実行したいことを伝えるため、 RequestAnimationFrame は意味的にも不必要なパフォーマンスの低下を処理する唯一の合理的な方法です...したがって、ブラウザは、現在のページの状態を考慮して、最適な方法であなたの願いをどのように処理すべきかを判断します。ただし、iframe はローカル ストレージを使用して通信するため、基本ページの状態をそれらにプッシュできるため、それぞれが RequestAnimationFrame かどうかを決定します。しかし、ページにレンダリング コンテキストを複数持つことが良いことであるとは確信していません。それらはすべてリソースを消費し、それらを共有することはできません (GPU に保存されたデータはサンドボックス化されます)。遅延が発生し、GPU パイプラインは、これらすべての小さなスタンドアロン エンティティに満足できない可能性があります。断片化は、GPU パフォーマンスの主な敵です。

于 2012-11-08T07:51:09.443 に答える