Signatur
Beschreibung
Die schreibgeschützte Eigenschaft rtt des NetworkInformation-Interfaces liefert die geschätzte effektive Round-Trip-Zeit (RTT), also die Zeit, die ein Datenpaket zum Server und zurück braucht. Der Wert ist in Millisekunden angegeben und auf das nächste Vielfache von 25 ms gerundet. Sie erreichen die Eigenschaft über navigator.connection.rtt, in Web Workern über self.navigator.connection.rtt.
Der Browser ermittelt den Wert aus Messungen auf Anwendungsebene, die er vor Kurzem beobachtet hat (etwa HTTP-Anfragen), und nicht aus der Art der Verbindung. So spiegelt rtt die tatsächliche Latenz meist besser wider als type. Liegen noch keine Messungen vor, schätzt der Browser den Wert anhand der zugrunde liegenden Verbindungstechnik.
Typische Einsatzgebiete sind adaptive Ladestrategien: Bei hoher Latenz können Sie weniger einzelne Anfragen stellen, Ressourcen bündeln, auf Prefetching verzichten oder längere Zeitlimits setzen. Zusammen mit downlink und effectiveType ergibt sich ein grobes Bild der Netzqualität. Ändert sich die Schätzung deutlich, wird am NetworkInformation-Objekt das Ereignis change ausgelöst.
Rückgabewert
50, 150, 300). Kann 0 sein, wenn keine Schätzung vorliegt oder der Browser den Wert zum Schutz der Privatsphäre verbirgt.Beispiele
Aktuelle RTT mit Feature-Erkennung auslesen
const connection = navigator.connection;
if (connection && 'rtt' in connection) {
console.log(`Geschätzte RTT: ${connection.rtt} ms`);
} else {
console.log('Network Information API wird nicht unterstützt.');
}Prefetching bei hoher Latenz abschalten
const HIGH_LATENCY_MS = 400;
const shouldPrefetch = () => {
const conn = navigator.connection;
// Ohne API-Unterstützung optimistisch vorladen
if (!conn) return true;
if (conn.saveData) return false;
return conn.rtt === 0 || conn.rtt < HIGH_LATENCY_MS;
};
if (shouldPrefetch()) {
const link = document.createElement('link');
link.rel = 'prefetch';
link.href = '/artikel/naechste-seite.html';
document.head.append(link);
console.log('Prefetch aktiviert');
} else {
console.log('Prefetch übersprungen (hohe Latenz oder Datensparmodus)');
}Auf Änderungen der RTT reagieren
const conn = navigator.connection;
const logConnection = () => {
console.log(`RTT: ${conn.rtt} ms, Downlink: ${conn.downlink} Mbit/s, Typ: ${conn.effectiveType}`);
};
if (conn) {
logConnection();
conn.addEventListener('change', logConnection);
// Später wieder abmelden, z. B. beim Verlassen einer Ansicht
// conn.removeEventListener('change', logConnection);
}Timeout für fetch an die Latenz anpassen
const fetchWithAdaptiveTimeout = async (url) => {
const rtt = navigator.connection?.rtt || 200; // Fallback bei fehlender Schätzung
const timeout = Math.max(3000, rtt * 20);
const response = await fetch(url, { signal: AbortSignal.timeout(timeout) });
console.log(`Timeout: ${timeout} ms, Status: ${response.status}`);
return response.json();
};
fetchWithAdaptiveTimeout('/api/daten.json').catch(console.error);// Wichtig · Fallstricke
- Browser-Unterstützung: Nur in Chromium-basierten Browsern (Chrome, Edge, Opera, Samsung Internet) verfügbar. Firefox und Safari kennen
navigator.connectionnicht. Prüfen Sie deshalb immer zuerst, ob die API vorhanden ist, etwa mitnavigator.connection?.rtt. Die Spezifikation ist ein experimenteller Entwurf der WICG und kein Standard. - Nur eine Schätzung: Der Wert ist gerundet und beruht auf vergangenen Messungen. Er kann der tatsächlichen Latenz hinterherhinken und eignet sich nicht für exakte Messungen. Für genaue Zeiten nutzen Sie die
PerformanceResourceTiming-API. - Datenschutz: Die Rundung auf 25 ms und eine Obergrenze (in Chrome etwa 3000 ms) sollen Fingerprinting erschweren. Manche Browser oder Datenschutz-Einstellungen liefern
0oder feste Werte. Behandeln Sie0deshalb als „unbekannt“ und nicht als „keine Latenz“. - Die Eigenschaft ist schreibgeschützt. Eine Zuweisung wird ohne Fehlermeldung ignoriert.
- Nur in sicheren Kontexten (HTTPS) und auch in Web Workern verfügbar.