The star of today's show is none other than the Core Web Vitals report of PodApp's main landing page. Spoiler alert: not only did we pass, but we aced it with flying colours!
The Speed Equation and Conversion Rates
Did you know that a slow page—let's say one that takes more than 5.7 seconds to load—has a paltry conversion rate of less than 0.6%? Shocking, isn't it? On the flip side, get your page to load in under 2.4 seconds and you're looking at a conversion rate of about 1.9%! Check out Cloudflare's blog for more jaw-dropping stats. In short, sorting out your Core Web Vitals isn't just a nice-to-have—it's absolutely essential for conversion rate optimisation.
Your Must-Have Tool: Core Web Vitals Extension
If you're keen to dive into the nitty-gritty metrics, download Google Chrome's "Core Web Vitals" extension. This nifty tool allows you to dissect your page performance in real-time. Stick around as I break down what each metric means and how you can give each one a boost.
Largest Contentful Paint (LCP)
This measures how long it takes for the biggest visual element on your page to show up. It's usually that hero image or video on your landing page. I managed to give our LCP a caffeine kick using image 'priority' properties and video 'poster' attributes. If you're using a modern framework like NextJS (as we do at PodApp), you get to enjoy perks like automatic image optimisation and even cool tricks like blur placeholders.
Cumulative Layout Shift (CLS)
First Input Delay (FID)
First Contentful Paint (FCP)
Similar to LCP, FCP focuses on how quickly any content renders on your page. The key to unlocking a faster FCP is employing static site generation tools instead of server-side rendering (SSR).
Time to First Byte (TTFB)
How quickly does your website send the first byte of data to the browser? This can be dramatically improved by using a CDN (Content Delivery Network). At PodApp, we reduced our TTFB from an unacceptable 2.2 seconds to an amazing 0.01 second by utilising Google Cloud CDN.
Quick Wins for Faster Pages
Keep your site as lean as possible; no one needs a glut of plugins.
Steer clear of Wordpress if you're serious about page speed.
Don't underestimate the power of Cloudflare; it can make even a sluggish Wordpress site zoom.
Automate the boring stuff—image and CSS optimisation, for example.
Want to experience your site from a user's perspective? Open Chrome's developer window, disable cache, and mimic a 'fast 3G' network. If your site crawls, it's time to go back to the drawing board.
So, ready to give your website the speed boost it deserves?
Share this article
Article written by Dylan Moore
Dylan, originaly from Turkey, discovered his passion for programming and podcasting online. Him and his team later founded PodApp, a user-friendly platform designed to make podcasting accessible to everyone. Read more