Largest Contentful Paint
Good: < 2.5s
Measures how long it takes for the main content to appear on screen
How to optimize circles.life
374 KiB of unused JavaScript is being loaded, with chunks showing 75-90% waste and delaying LCP by 150ms.
Implement Next.js tree shaking by ensuring proper ES6 module imports and avoiding default imports for large libraries. Use webpack-bundle-analyzer to identify unused code in chunks. Split large components using Next.js dynamic imports with ssr: false for client-only code. Remove or defer loading of unused polyfills and vendor libraries.
A score of 82 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 site has good performance with a score of 82/100, but suffers from severe JavaScript blocking issues that hurt user interactivity. The biggest problem is an extremely slow Time to Interactive of 10.9 seconds, meaning users can't properly interact with the page for nearly 11 seconds after it loads. The site is loading 374 KiB of unused JavaScript code and using outdated JavaScript polyfills that aren't needed for modern browsers, which could save 37 KiB if removed. Additionally, render-blocking CSS is delaying the initial page display by 150ms, and better caching policies could improve repeat visits.
Why It Matters:
Render-blocking CSS is delaying First Contentful Paint by 150ms and blocking critical page rendering.
How to Fix:
Use Next.js built-in CSS optimization by moving critical styles inline or using CSS-in-JS solutions like styled-components. Split non-critical CSS and load it asynchronously using dynamic imports. Consider inlining critical CSS for above-the-fold content directly in the document head.
Why It Matters:
37 KiB of legacy JavaScript polyfills are unnecessarily bloating your bundle for modern browsers.
How to Fix:
Update Next.js target to 'es2017' or higher in next.config.js to reduce Babel transpilation. Remove unnecessary polyfills like regenerator-runtime and class transforms. Configure browserslist to target modern browsers only, excluding legacy IE support. Use Next.js modern build mode to serve optimized bundles to capable browsers.
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
The corridor shield image is 48KB larger than needed for its display dimensions.
CSS files are blocking initial page render and delaying LCP by 600ms.
The LCP element (background texture SVG) lacks priority hints, delaying critical resource loading.
3.5 seconds of JavaScript execution time is blocking the main thread and causing 2.5 seconds of Total Blocking Time.