Largest Contentful Paint
Good: < 2.5s
Measures how long it takes for the main content to appear on screen
How to optimize dev.happythoughts.in
LCP image has 7.6 seconds of resource load delay, causing the poor 13.7s LCP score.
Move critical images to same domain to avoid DNS lookups. Add resource hints like <link rel='preload'> for LCP image in Next.js _document.js. Optimize Next.js Image component with priority prop and proper sizes attribute. Consider using a CDN with better cache headers.
A score of 52 falls in the "Needs Improvement" range (50-89). While it is better than poor (0-49), you should aim for 90+ to provide an optimal user experience and maximize SEO benefits.
This site is slower than approximately 35% of similar sites. The main issues affecting performance are image optimization, JavaScript execution time, and layout stability.
Addressing these issues could improve your conversion rate by 15-20% and boost your search engine rankings.
Largest Contentful Paint
Good: < 2.5s
Measures how long it takes for the main content to appear on screen
Interaction to Next Paint
Good: < 200ms
Measures how quickly the page responds to user interactions
Cumulative Layout Shift
Good: < 0.1
Measures visual stability - how much content shifts during page load
This Next.js/React website has poor performance with a score of 52/100, taking an extremely slow 13.7 seconds for the largest content to appear on screen. The biggest problem is massive amounts of unused JavaScript code (196 KiB) that's blocking the page from loading quickly, particularly from Google Analytics and Next.js chunks that are 95-99% unused. The site is also suffering from forced reflows that cause layout thrashing, excessive main-thread work taking 2.4 seconds, and inefficient caching of external resources. Removing unused JavaScript, implementing code splitting, and fixing the caching issues could dramatically improve loading times and boost the performance score by 30+ points.
Why It Matters:
196 KiB of unused JavaScript delays LCP by 1.1 seconds and blocks main thread execution.
How to Fix:
Use Next.js bundle analyzer to identify unused code. Enable tree shaking in next.config.js with experimental.optimizePackageImports. Split large chunks using dynamic imports with next/dynamic for non-critical components. Remove or lazy load Google Analytics until after page interaction.
Why It Matters:
28ms of forced reflows block the main thread and contribute to poor interactivity scores.
How to Fix:
Batch DOM reads before writes in your React components. Use CSS transforms instead of changing layout properties. Implement React.memo() for components that frequently re-render. Move geometric property reads (offsetWidth, getBoundingClientRect) to requestAnimationFrame callbacks.
Once your site is optimized, maintain that speed. Use DeployHQ for zero-downtime, automated deployments—so performance fixes and updates go live safely every time, without breaking your site.
Get AI-powered performance insights with actionable fixes in 30 seconds
More Next.js Speed Tests
Images are 275KB larger than needed and directly impact your LCP performance by 950ms.
Your LCP is delayed by 10.5 seconds due to resource load delay, making the page appear frozen to users.
Legacy JavaScript polyfills add 22 KiB of unnecessary code that delays LCP by 150ms for modern browsers.
LCP is delayed by 10.4 seconds due to resource load delay, making the largest contentful paint occur at 13.3 seconds.