⏱️ Chargement de la page en millisecondes • ⚡

Chargement en cours...

⏱️ Script 1 | chargement de la page en millisecondes • ⚡


/**********************************************/
Scripte (1) ✔️ Solution robuste 
(PC + Android + iOS Safari + tablettes)
Script chargement de la page en millisecondes
/**********************************************/
<div id="time">Chargement en cours...</div>

<script>
(function () {
	"use strict";
	// 1. Départ ultra fiable
	const startTime = performance.now();
	// 2. Fonction d'affichage
	function afficherTemps() {
		const endTime = performance.now();
		const elapsed = endTime - startTime;
		const seconds = (elapsed / 1000).toFixed(4);
		const el = document.getElementById("time");
		if (!el) return;
		el.innerHTML = "<span style='color:#990099; font-size:12px;'>" + "Page chargée en " + seconds + " secondes" + "</span>";
	}
	// 3. Détection DOM robuste (PC + mobile + Apple)
	function ready(fn) {
		if (document.readyState === "complete" || document.readyState === "interactive") {
			// DOM déjà prêt (cas iOS fréquent)
			requestAnimationFrame(fn);
		} else {
			document.addEventListener("DOMContentLoaded", function () {
				requestAnimationFrame(fn);
			});
		}
	}
	// 4. Lancement
	ready(afficherTemps);
})();
</script>

⏱️ Script 2 | chargement de la page en millisecondes • ⚡

/**********************************************/
Scripte (2) ✔️ Solution robuste 
(PC + Android + iOS Safari + tablettes) 
🚀 CODE (robuste multi-métriques)
Script chargement de la page en millisecondes
/**********************************************/

<div id="time">Chargement en cours...</div>

<script>
(function () {
	"use strict";
	// 1. Point de départ ultra précoce
	const startTime = performance.now();

	// 2. Sécurisation compatibilité navigation timing
	function getNavTiming() {
		const nav = performance.getEntriesByType("navigation");
		if (nav && nav.length > 0) return nav[0];
		return null;
	}

	// 3. Affichage principal
	function afficherResultats(type, domTime, loadTime, extra) {
		const el = document.getElementById("time");
		if (!el) return;
		let html = "";
		html += "<span style='color:#990099; font-size:14px;'>";
		html += "📊 Diagnostic de chargement<br><br>";
		html += "⏱ JS → DOMReady : " + domTime + " s<br>";
		html += "📦 JS → Load complet : " + loadTime + " s<br>";

		if (extra) {
			html += "<br>⚙️ Détails navigateur :<br>";
			html += extra;
		}
		html += "</span>";
		el.innerHTML = html;
	}

	// 4. Mesure DOM Ready (cross-browser)
	let domStart = null;
	let loadStart = null;

	function onDOMReady() {
		domStart = performance.now();
	}

	function onLoadComplete() {
		loadStart = performance.now();
		const domTime = ((domStart - startTime) / 1000).toFixed(4);
		const loadTime = ((loadStart - startTime) / 1000).toFixed(4);

		// Navigation Timing API (si dispo)
		const nav = getNavTiming();
		let extra = "";

		if (nav) {
			const ttfb = (nav.responseStart - nav.startTime) / 1000;
			const dom = (nav.domContentLoadedEventEnd - nav.startTime) / 1000;
			const load = (nav.loadEventEnd - nav.startTime) / 1000;
			extra += "TTFB : " + ttfb.toFixed(4) + " s<br>";
			extra += "DOM API : " + dom.toFixed(4) + " s<br>";
			extra += "Load API : " + load.toFixed(4) + " s<br>";
		}
		afficherResultats("load", domTime, loadTime, extra);
	}

	// 5. Gestion compatibilité Apple / mobile
	function init() {
		// DOM READY
		if (document.readyState === "interactive" || document.readyState === "complete") {
			requestAnimationFrame(onDOMReady);
		} else {
			document.addEventListener("DOMContentLoaded", function () {
				requestAnimationFrame(onDOMReady);
			});
		}
		// LOAD COMPLET (images etc.)
		window.addEventListener("load", function () {
			requestAnimationFrame(onLoadComplete);
		});
	}
	init();
})();
</script>