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.
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: 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
<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/">
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.
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.