Способ определить, отображается ли окно просмотра WebGL на экране?

Есть ли способ запросить у графического процессора информацию о том, отображается ли окно просмотра на моей веб-странице в данный момент на экране или нет? Например, если у меня был рендеринг 3D-сцены на холсте в iframe, есть ли способ запросить оборудование (внутри моего iframe и только пиксели или вершины в окне просмотра), чтобы сказать, нахожусь ли я на экране или прокручивается за пределы экрана ?

Мне любопытно, могу ли я сделать это на уровне вершинного шейдера. Выполняет ли WebGL шейдерную программу даже в области просмотра, находящейся вне экрана? Скажем, если он прокручивается ниже холста или окно просмотра перекрывается другим окном браузера веб-страницы? Есть ли способ запросить композитную часть webgl, чтобы увидеть, находится ли она даже в поле зрения, или выполнить итерацию по дереву «RenderObject», чтобы проверить, отображается ли она даже на экране, а затем вернуть это значение? Я пытаюсь получить гораздо больше производительности от проекта, над которым я работаю, и я пытаюсь отображать только то, что видно на экране.

Любые возможные идеи? Это вообще возможно? Спасибо!


person xtr33me    schedule 02.11.2012    source источник


Ответы (2)


RequestAnimationFrame — единственный разумный способ справиться с ненужной потерей производительности, даже с точки зрения семантики, потому что браузер, который вы хотите выполнить анимацию... Таким образом, браузер выяснит, как он должен оптимально обработать ваше желание, принимая во внимание текущее состояние страницы. Но поскольку фреймы взаимодействуют с использованием локального хранилища, вы можете передать им свое базовое состояние страницы, чтобы каждый из них решал, следует ли ему RequestAnimationFrame или нет. Но я не уверен, что хорошо иметь несколько контекстов рендеринга на вашей странице, все они потребляют ресурсы и не могут ими делиться (данные, хранящиеся в графическом процессоре, изолированы), поэтому в конечном итоге они начнут выталкивать друг друга из памяти графического процессора. и причиной лагов + конвейера графического процессора может быть не так хорошо со всеми этими крошечными автономными объектами. Фрагментация — главный враг производительности графического процессора.

person JAre    schedule 08.11.2012
comment
Спасибо JAre. Кажется, это лучший ответ, который я видел на этот вопрос. Я очень ценю информацию! - person xtr33me; 13.11.2012

Вы не задаете этот вопрос на уровне холста/WebGL, потому что он может, например, прокручиваться назад на экране перед тем, как вы нарисуете другой кадр, а браузеры не хотят, чтобы контент не отображался, поэтому нет возможности не рисовать.

Я считаю, что вам придется проконсультироваться со свойствами геометрии DOM (например, .scrollLeft) ваших прокручиваемых областей, чтобы определить, виден ли холст. В указанных свойствах достаточно информации, чтобы вы могли сделать это в общем случае без жесткого знания структуры вашей страницы.

Кроме того, убедитесь, что вы используете исключительно requestAnimationFrame для планирования рисования/моделирования; он приостановит анимацию, если страница скрыта/свернута/на другой вкладке/иным образом явно невидима.

person Kevin Reid    schedule 03.11.2012
comment
Спасибо за ответ, Кевин, но есть ли способ сделать это на уровне webgl? Каждый из игровых клиентов/персонажей, которых вы собираете, работает в своих собственных фреймах, и я размещаю сервер на другом src, чем веб-страница, отображающая их. В настоящее время он у меня есть, поэтому каждый iframe сам осознает себя и общается, используя локальное хранилище. Однако при тестировании, когда я начинаю получать на экране гораздо больше iframe, я вижу замедление и не хотел бы вызывать обновление на дочернем холсте iframe, если он прокручивается за пределы экрана. - person xtr33me; 03.11.2012