Made with ❤️

Your Webflow
Page Speed Checklist

Resize your Damn Images

Know where you are selling. If most of your sales happen on mobile you might not need to optimize for widescreen UHD screens like mine. It is good to find balance.

Most HD screens are 1440px wide. I personally use a 4K display and many websites are optimized for my display which I appreciate.

But Webflow provides responsive images, why should I care? They resize images for different resolutions but are proportional to the image's resolution you are using. A well sized image will improve page performance even more.

Compress CMS images

Other than resizing images, there are compression algorithms which allows images to remain intact visually and even further reduce the size of the images.

Defer or Async your script links whichever may apply

Defer: When present, it specifies that the script is executed when the page has finished parsing.

Async: The script is executed asynchronously with the rest of the page (the script will be executed while the page continues the parsing)

Reference

Pre connect and DNS prefetch for known connections

<link rel="preconnect"> informs the browser that your page intends to establish a connection to another origin, and that you'd like the process to start as soon as possible.

<link rel="dns-prefetch"> is another <link> type related to connections. This handles the DNS lookup only, but it's got wider browser support, so it may serve as a nice fallback.

Reference

<link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin>
<link rel="dns-prefetch" href="https://fonts.gstatic.com/">

<link rel="preconnect" href="https://uploads-ssl.webflow.com/" crossorigin>
<link rel="dns-prefetch" href="https://uploads-ssl.webflow.com/">

Minify Custom Code(if adding custom functionality)

Adding new functionality usually means you are adding considerable code to your Webflow site. If possible, keep a copy of the code and minify it before adding it to Webflow.

Work with high quality Webflow developers

There are maybe 10,000 ways to do the same thing in Webflow. Experienced Webflow developers know which way is the most performant from experience. Rely on them to make the call and ask them how.