From 9e8f0f139aaa4ce97c2592af26aaca29b021634d Mon Sep 17 00:00:00 2001 From: Ricardo Date: Sun, 8 Mar 2026 15:23:27 +0100 Subject: [PATCH] perf: remove skeleton loader to fix CLS (0.916 mobile / 1.004 desktop) The skeleton-to-content swap was the root cause of extreme CLS scores. Critical CSS already provides correct first-paint layout, making the skeleton unnecessary. Removes html.loading class, skeleton div, page-content wrapper, and all skeleton CSS rules. Confab-Link: http://localhost:8080/sessions/edb1b7b0-da66-4486-bd9c-d1cfa7553b88 --- _includes/layouts/base.njk | 26 +++----------------------- css/critical.css | 9 +-------- 2 files changed, 4 insertions(+), 31 deletions(-) diff --git a/_includes/layouts/base.njk b/_includes/layouts/base.njk index 053c598..49bab81 100644 --- a/_includes/layouts/base.njk +++ b/_includes/layouts/base.njk @@ -1,5 +1,5 @@ - + {# OG image resolution handled by og-fix transform in eleventy.config.js to bypass Eleventy 3.x parallel rendering race condition (#3183). @@ -57,7 +57,7 @@ {# Critical CSS — inlined for fast first paint #} {# Defer full stylesheet — loads after first paint #} - + @@ -90,9 +90,7 @@ [x-data] > .flex.border-b { display: none !important; } /* Hide loading spinners and JS-only buttons */ [x-show*="loading"], button[\\@click*="fetch"], button[\\@click*="loadMore"] { display: none !important; } - /* Show content and hide skeleton for no-JS (stylesheet loads synchronously via noscript link) */ - .page-skeleton { display: none !important; } - html.loading main.container > .page-content { display: block !important; } + /* Content is always visible — no skeleton loader */ @@ -282,23 +280,6 @@
- {# Skeleton loader — shown until Tailwind stylesheet loads #} - - -
{% if withSidebar and page.url == "/" and homepageConfig and homepageConfig.sections %} {# Homepage: builder controls its own layout and sidebar #} {{ content | safe }} @@ -323,7 +304,6 @@ {% else %} {{ content | safe }} {% endif %} -