Signatur
Beschreibung
Die statische Methode XRWebGLLayer.getNativeFramebufferScaleFactor() gibt eine Gleitkommazahl zurück. Wenn man die Standardgröße des Framebuffers einer XRSession mit dieser Zahl multipliziert, erhält man die native Auflösung des XR-Displays, also eine Auflösung, bei der ein Pixel im Framebuffer genau einem physischen Pixel im Zentrum der Linse entspricht.
Viele User Agents legen den Standard-Framebuffer absichtlich kleiner an als die native Auflösung, damit die Bildrate stabil bleibt. Der zurückgegebene Wert eignet sich deshalb direkt als Option framebufferScaleFactor im Konstruktor new XRWebGLLayer(session, gl, { framebufferScaleFactor }). So lässt sich für einfache Szenen die volle Schärfe des Geräts nutzen oder ein Kompromiss zwischen Standard und nativer Auflösung einstellen.
Ein Wert von 1.0 bedeutet, dass der Standard-Framebuffer schon der nativen Auflösung entspricht. Werte über 1.0 heißen, dass der Browser standardmäßig herunterskaliert. Gibt es keine sinnvolle native Auflösung (z. B. bei einer schon beendeten Sitzung), liefert die Methode 0.
Parameter
| Name | Typ | Default | Beschreibung |
|---|---|---|---|
| $session Pflicht | XRSession | Die XRSession, für die der native Skalierungsfaktor ermittelt werden soll. |
Rückgabewert
0, wenn die Sitzung beendet ist oder kein Wert ermittelt werden kann.Beispiele
Native Auflösung für eine immersive Sitzung nutzen
const startXR = async () => {
const session = await navigator.xr.requestSession('immersive-vr');
const canvas = document.createElement('canvas');
const gl = canvas.getContext('webgl2', { xrCompatible: true });
// Skalierungsfaktor für volle Geräteauflösung ermitteln
const nativeScale = XRWebGLLayer.getNativeFramebufferScaleFactor(session);
console.log('Nativer Faktor:', nativeScale);
const layer = new XRWebGLLayer(session, gl, {
framebufferScaleFactor: nativeScale
});
await session.updateRenderState({ baseLayer: layer });
console.log(`Framebuffer: ${layer.framebufferWidth} x ${layer.framebufferHeight}`);
};
document.querySelector('#enter-vr').addEventListener('click', startXR);Kompromiss zwischen Standard und nativer Auflösung
const createLayer = (session, gl, quality = 0.5) => {
const nativeScale = XRWebGLLayer.getNativeFramebufferScaleFactor(session);
// quality 0 = Standardauflösung (1.0), quality 1 = native Auflösung
const scale = nativeScale > 0
? 1 + (nativeScale - 1) * quality
: 1;
return new XRWebGLLayer(session, gl, { framebufferScaleFactor: scale });
};
// Nutzung innerhalb einer laufenden Sitzung:
// const layer = createLayer(session, gl, 0.5);
// await session.updateRenderState({ baseLayer: layer });Feature-Erkennung vor dem Aufruf
const getScale = (session) => {
if (typeof XRWebGLLayer === 'undefined' ||
typeof XRWebGLLayer.getNativeFramebufferScaleFactor !== 'function') {
console.warn('WebXR wird nicht unterstützt – Standardfaktor 1.0');
return 1;
}
return XRWebGLLayer.getNativeFramebufferScaleFactor(session) || 1;
};// Wichtig · Fallstricke
- Statische Methode: Aufruf über die Klasse
XRWebGLLayer, nicht über eine Instanz (layer.getNativeFramebufferScaleFactor()gibt es nicht). - Performance: Die native Auflösung kann die GPU-Last spürbar erhöhen. Bei aufwendigen Szenen kommt es dann zu verlorenen Frames und Übelkeit bei den Nutzern. Nimm den nativen Faktor nur für einfache Szenen oder als Obergrenze einer adaptiven Qualitätsstufe.
- Der Browser kann den angeforderten
framebufferScaleFactorauf einen unterstützten Bereich begrenzen. Prüf daher die tatsächliche Größe überframebufferWidthundframebufferHeight. - Rückgabewert
0bei beendeter Sitzung. Fang diesen Fall ab, bevor du den Wert weiterverwendest. - Kompatibilität: WebXR gibt es nur in sicheren Kontexten (HTTPS). Unterstützt wird es vor allem in Chromium-Browsern und im Meta Quest Browser, Firefox und Safari auf dem Desktop unterstützen es nicht. Mach vor dem Aufruf immer eine Feature-Erkennung.