Principle
Optimize for PageSpeed Insights on mobile first, and measure again after every change.
Techniques in use
- Critical CSS per template, inlined in the
<head>; the remaining CSS loads asynchronously on mobile. - Deferred third-party scripts (Google Analytics, GTM, Facebook, Clarity) until the visitor interacts or 12 seconds have passed, which reduces Total Blocking Time.
- PurgeCSS on the theme and plugin source files, removing WooCommerce CSS on pages that do not need it.
- Viewport-based section loading: homepage product sections render only the first few cards, and the rest load as the visitor scrolls to them.
- Images: square sizes of 100 / 300 / 450 / 600, and
td-responsivefrom 320 to 1200 for srcset. - Preconnect, font preload, and removal of the
?verparameter from assets.
Measurements
Google PageSpeed on 12 Jul 2026: mobile 91, desktop 97. The pre-built PC landing pages reach Lighthouse mobile 98 to 100.