Signatur
Beschreibung
Die schreibgeschützte Eigenschaft secureConnectionStart eines PerformanceResourceTiming-Eintrags gibt den Zeitpunkt zurück, direkt bevor der Browser den Handshake zur Absicherung der Verbindung startet (in der Regel TLS bei HTTPS). Der Wert ist ein DOMHighResTimeStamp in Millisekunden relativ zu performance.timeOrigin.
Zusammen mit connectEnd ergibt sich die Dauer des TLS-Handshakes: connectEnd - secureConnectionStart. Der Wert liegt zeitlich zwischen connectStart und connectEnd. Das hilft beim Aufspüren langsamer Zertifikatsprüfungen, fehlender Session-Resumption oder zu vieler neuer Verbindungen zu Drittanbieter-Domains.
Die Eigenschaft ist 0, wenn keine sichere Verbindung verwendet wurde (z. B. bei http:), wenn eine bestehende Verbindung wiederverwendet wurde (Keep-Alive, HTTP/2-Multiplexing), wenn die Ressource aus dem Cache kam oder wenn es sich um eine Cross-Origin-Ressource ohne passenden Timing-Allow-Origin-Header handelt.
Rückgabewert
0, wenn kein Handshake stattfand bzw. die Timing-Daten nicht zugänglich sind.Beispiele
TLS-Handshake-Dauer aller Ressourcen ermitteln
const entries = performance.getEntriesByType('resource');
for (const entry of entries) {
if (entry.secureConnectionStart > 0) {
const tls = entry.connectEnd - entry.secureConnectionStart;
console.log(`${entry.name}: TLS ${tls.toFixed(1)} ms`);
}
}Neue Ressourcen mit PerformanceObserver überwachen
const observer = new PerformanceObserver((list) => {
for (const entry of list.getEntries()) {
const { name, secureConnectionStart, connectEnd } = entry;
if (secureConnectionStart === 0) continue; // keine neue TLS-Verbindung
const tls = connectEnd - secureConnectionStart;
if (tls > 100) {
console.warn(`Langsamer Handshake (${tls.toFixed(0)} ms): ${name}`);
}
}
});
observer.observe({ type: 'resource', buffered: true });Verbindungsphasen pro Host aufschlüsseln
const phases = performance.getEntriesByType('resource')
.filter((e) => e.connectStart !== e.connectEnd) // nur neue Verbindungen
.map((e) => ({
host: new URL(e.name).host,
tcp: (e.secureConnectionStart || e.connectEnd) - e.connectStart,
tls: e.secureConnectionStart ? e.connectEnd - e.secureConnectionStart : 0
}));
console.table(phases);// Wichtig · Fallstricke
- Immer auf
0prüfen: Wer ohne PrüfungconnectEnd - secureConnectionStartrechnet, bekommt bei wiederverwendeten oder unverschlüsselten Verbindungen unsinnig große Werte. - Cross-Origin: Ressourcen fremder Origins liefern
0, solange der Server keinenTiming-Allow-Origin-Header sendet (z. B.Timing-Allow-Origin: *oder die eigene Origin). - Verbindungswiederverwendung: Bei HTTP/2 und HTTP/3 teilen sich viele Anfragen eine Verbindung – nur die erste Anfrage zeigt einen Handshake. Bei HTTP/3 (QUIC) sind TCP- und TLS-Handshake verschmolzen, deshalb können Werte je nach Browser anders ausfallen.
- Browser-Unterschiede: Ältere Safari-Versionen gaben teils
undefinedzurück oder setzten den Wert auch bei wiederverwendeten Verbindungen. Die Eigenschaft steht auch in Web Workern zur Verfügung. - Die Zeitstempel werden aus Datenschutzgründen (Fingerprinting, Spectre) je nach Browser in der Genauigkeit reduziert.