From 474fa4f3df2ab40fc0279488aa5b00763c96f147 Mon Sep 17 00:00:00 2001 From: Marc Mintel Date: Thu, 19 Feb 2026 23:21:01 +0100 Subject: [PATCH] perf: optimize PageSpeed Insights performance - Suppress browser source map references to fix 404/SyntaxErrors - Reduce legacy JS polyfills via browserslist config - Optimize LCP by refining Hero animations and image sizes - Implement video lazy loading and reduce SVG animation complexity - Add preconnect hints for critical origins --- app/[locale]/layout.tsx | 6 +++++- components/home/Hero.tsx | 8 ++++---- components/home/HeroIllustration.tsx | 14 +++++++------- components/home/ProductCategories.tsx | 2 +- components/home/VideoSection.tsx | 21 ++++++++++++++------- next.config.mjs | 5 ++++- package.json | 5 +++++ 7 files changed, 40 insertions(+), 21 deletions(-) diff --git a/app/[locale]/layout.tsx b/app/[locale]/layout.tsx index a21c016e..44baf9cd 100644 --- a/app/[locale]/layout.tsx +++ b/app/[locale]/layout.tsx @@ -112,7 +112,11 @@ export default async function Layout(props: { return ( - + + + + + diff --git a/components/home/Hero.tsx b/components/home/Hero.tsx index c11e3758..c566f75b 100644 --- a/components/home/Hero.tsx +++ b/components/home/Hero.tsx @@ -137,12 +137,12 @@ const containerVariants = { } as const; const headingVariants = { - hidden: { opacity: 1, y: 30, scale: 0.95 }, + hidden: { opacity: 1, y: 10, scale: 0.98 }, visible: { opacity: 1, y: 0, scale: 1, - transition: { duration: 0.8, ease: [0.25, 0.46, 0.45, 0.94] }, + transition: { duration: 0.4, ease: [0.25, 0.46, 0.45, 0.94] }, }, } as const; @@ -167,12 +167,12 @@ const scribbleVariants = { } as const; const subtitleVariants = { - hidden: { opacity: 0, y: 40, scale: 0.95 }, + hidden: { opacity: 0, y: 20, scale: 0.98 }, visible: { opacity: 1, y: 0, scale: 1, - transition: { duration: 1, ease: [0.25, 0.46, 0.45, 0.94] }, + transition: { duration: 0.6, ease: [0.25, 0.46, 0.45, 0.94], delay: 0.1 }, }, } as const; diff --git a/components/home/HeroIllustration.tsx b/components/home/HeroIllustration.tsx index a0b818f1..1fe3b3e6 100644 --- a/components/home/HeroIllustration.tsx +++ b/components/home/HeroIllustration.tsx @@ -154,15 +154,15 @@ export default function HeroIllustration() { - - + + - - + + @@ -215,10 +215,10 @@ export default function HeroIllustration() { {/* ANIMATED ENERGY FLOW */} - + {POWER_LINES.map((line, i) => { - // Only animate a subset of lines to reduce main-thread work - if (i % 2 !== 0) return null; + // Only animate a small subset of lines to reduce main-thread work significantly + if (i % 5 !== 0) return null; const from = gridToScreen(line.from.col, line.from.row); const to = gridToScreen(line.to.col, line.to.row); const length = Math.sqrt(Math.pow(to.x - from.x, 2) + Math.pow(to.y - from.y, 2)); diff --git a/components/home/ProductCategories.tsx b/components/home/ProductCategories.tsx index 135cd227..03ecfa47 100644 --- a/components/home/ProductCategories.tsx +++ b/components/home/ProductCategories.tsx @@ -56,7 +56,7 @@ export default function ProductCategories() { alt={category.title} fill className="object-cover transition-transform duration-1000 group-hover:scale-110" - sizes="(max-width: 768px) 100vw, (max-width: 1024px) 50vw, 25vw" + sizes="(max-width: 768px) 100vw, (max-width: 1024px) 50vw, 24vw" />
diff --git a/components/home/VideoSection.tsx b/components/home/VideoSection.tsx index 36d62287..8ebd2d64 100644 --- a/components/home/VideoSection.tsx +++ b/components/home/VideoSection.tsx @@ -6,14 +6,18 @@ export default function VideoSection() { return (
-
@@ -22,9 +26,12 @@ export default function VideoSection() { future: (chunks) => ( {chunks} - + - ) + ), })}
diff --git a/next.config.mjs b/next.config.mjs index 17d82308..071f2027 100644 --- a/next.config.mjs +++ b/next.config.mjs @@ -8,6 +8,7 @@ const nextConfig = { // Make sure entries are not disposed too quickly maxInactiveAge: 60 * 1000, }, + productionBrowserSourceMaps: false, logging: { fetches: { fullUrl: true, @@ -353,4 +354,6 @@ const nextConfig = { }, }; -export default withMintelConfig(nextConfig); +export default withMintelConfig(nextConfig, { + hideSourceMaps: true, +}); diff --git a/package.json b/package.json index cd3f7b21..29347467 100644 --- a/package.json +++ b/package.json @@ -129,6 +129,11 @@ "next": "16.1.6" } }, + "browserslist": [ + "last 3 versions", + "not dead", + "not ie 11" + ], "peerDependencies": { "@remotion/cli": "^4.0.421", "@remotion/google-fonts": "^4.0.421",