As the video is stating, you only need to compress or optimize the images you’re gonna use a backgrounds. inline images will be handled by Webflow automatically.
However, it’s better to process the image a bit before giving it to Webflow. Webflow does a very good job at sizing and compressing images. So good that even if you could do better on your own, it would be so slight of a difference that it’s not a reason enought to do it. BUT I noticed that the final image is crisper if you give Webflow jpegs compressed at 60 instead of 90 or 100. If I give totally uncompressed images to Webflow, I notice a very slight blur in the details.
Now for the 3000px for BGs, it’s maybe a bit too much. Most people’s big screens, like 27 inches display, non HDPI, will be 2500 something. HDPI 27" screen will be over 5000px, but display UI and content at actually close to 2500 pt. I don’teven know if Webflow is serving hdpi bg images for Desktop (logically, yes).
So once again: choices. Check for yourself on various devices, sizes, densities, decide if HDPI is overkill (depending on the nature of the image, it can be a great addition, or completely unoticeable.).
I’d use 2500 instead of 3000 in the vast majority of the cases.
And I compress my images using Optimage and ImageOptim.