From 62467348f47ac85c1c18ed9180a8f8b9e653ea20 Mon Sep 17 00:00:00 2001 From: Francisco Anfuso Date: Sat, 12 Sep 2026 21:03:44 -0300 Subject: [PATCH] extraccion de menu y footer --- include/footer.html | 0 include/header.html | 0 index.html | 111 ++----------------------------------------- partials/footer.html | 43 +++++++++++++++++ partials/menu.html | 71 +++++++++++++++++++++++++++ scripts/loader.js | 50 +++++++++++++++++++ 6 files changed, 169 insertions(+), 106 deletions(-) delete mode 100644 include/footer.html delete mode 100644 include/header.html create mode 100644 partials/footer.html create mode 100644 partials/menu.html create mode 100644 scripts/loader.js diff --git a/include/footer.html b/include/footer.html deleted file mode 100644 index e69de29..0000000 diff --git a/include/header.html b/include/header.html deleted file mode 100644 index e69de29..0000000 diff --git a/index.html b/index.html index 17aa3cd..75ff145 100644 --- a/index.html +++ b/index.html @@ -5,6 +5,8 @@ Amor & Roma — Estudio Creativo + + @@ -14,73 +16,7 @@
- +
@@ -616,48 +552,11 @@ - + - + \ No newline at end of file diff --git a/partials/footer.html b/partials/footer.html new file mode 100644 index 0000000..073d26e --- /dev/null +++ b/partials/footer.html @@ -0,0 +1,43 @@ + \ No newline at end of file diff --git a/partials/menu.html b/partials/menu.html new file mode 100644 index 0000000..a7aa657 --- /dev/null +++ b/partials/menu.html @@ -0,0 +1,71 @@ + +
+ + + \ No newline at end of file diff --git a/scripts/loader.js b/scripts/loader.js new file mode 100644 index 0000000..86a9bf0 --- /dev/null +++ b/scripts/loader.js @@ -0,0 +1,50 @@ +/** + * Loader de partials HTML (menú + footer). + * - Usa fetch + cache del navegador. + * - Inyecta con innerHTML (sin reflow bloqueante). + * - Diferido con requestIdleCallback para no competir con el render. + */ +(function () { + 'use strict'; + + const PARTIALS = [ + { url: 'partials/menu.html', target: 'menu-placeholder' }, + { url: 'partials/footer.html', target: 'footer-placeholder' } + ]; + + // Cache en memoria para evitar refetch si se llama varias veces + const cache = new Map(); + + async function loadPartial({ url, target }) { + const el = document.getElementById(target); + if (!el) return; + + try { + let html = cache.get(url); + if (!html) { + const res = await fetch(url, { cache: 'force-cache' }); + if (!res.ok) throw new Error(`HTTP ${res.status} en ${url}`); + html = await res.text(); + cache.set(url, html); + } + // Inserción vía fragmento para minimizar reflows + el.outerHTML = html; + } catch (err) { + console.warn(`[loader] No se pudo cargar ${url}:`, err); + // Fallback silencioso: deja el placeholder vacío + } + } + + function loadAll() { + // En paralelo: ambas peticiones viajan juntas + PARTIALS.forEach(loadPartial); + } + + // Espera al idle para no bloquear LCP/FCP + if ('requestIdleCallback' in window) { + requestIdleCallback(loadAll, { timeout: 1500 }); + } else { + // Fallback para Safari + window.addEventListener('load', () => setTimeout(loadAll, 0)); + } +})(); \ No newline at end of file