Streaming live at 10am (PST)

Changes to my Webflow website have made it painfully slow

Hey everyone,

My developer recently made changes to my website to include more feature spot articles. However. ever since the changes were made, my site has become almost unusable. I’ve been with Webflow since October 2020 and have never experienced something like this. It’s extremely slow to use, laggy and takes ages to load and scroll up or down.

Does anybody know why this may be and how I can minimise this? The website is here: https://www.respublicamag.com/

Thanks

IMPORTANT: this channel is not maintained by our Support team.

For outages, please check: https://status.webflow.com/

If you have an issue with your account or experience any bugs on the site, please contact our support team directly: Webflow Customer Support | Webflow University (this is the best way to communicate bugs to our team and get the fastest help and updates).

The Webflow team does not maintain this category with updates on outages or bugs.

Hey there @respublica, this is most likely caused by the usage of uncompressed (huge file size) background image. Background images aren’t lazy loaded and responsive like using the Image elements. So your site is essentially loading full image sizes 1-2MB++ on first load which slows down your site heavily.

Hey, thanks! Do you mean the article images? How would you recommend fixing this? Perhaps compressing the article images to a lower image size?

Yes, honestly i only checked the smaller images 180ish px container yet loading 8000px wide images.

yes thats one way to do it use bulkresizephotos.com and tinyjpg.com to save you some time. replace any use of images to an Image element instead of using background-image property

Thanks! How would I do that?

please share your read-only link so that I can use it as an example.

Here you go: Webflow - Res Publica

There are still some sizing and spacing issues left because my developer is still working on this, but any help with the sluggishness would be helpful.

Thank you

This is just to show what I meant with replacing Image backgrounds to Image element.

The current setup looks like this. You’re using a link block and background-image property to fill the link block with the CMS image:
Screen Shot 2021-02-01 at 4.37.02 AM

Instead, do this. Remove the above Get BG Image from Articles and add an Image block inside the Link Block like below:
Screen Shot 2021-02-01 at 4.37.40 AM

What this will do is leverage lazyloading and responsive image. BUT you will still need to compress and resize your images as I mentioned in the post above. At the very least compress it with tinyjpg.com. Just open the site and drop your images in there before uploading it to the CMS.

Hey everyone,

My developer recently made changes to my website to include more feature spot articles. However. ever since the changes were made, my site has become almost unusable. I’ve been with Webflow since October 2020 and have never experienced something like this. It’s extremely slow to use, laggy and takes ages to load and scroll up or down.

Does anybody know why this may be and how I can minimise this? The website is here: https://www.respublicamag.com/

Nice site indeed :+1:

Would you please create a Read-Only link for me to examine? ( You may send me by message if you want to. )

@respublica I’ve given you the solution to speed up your site. If it doesn’t work let me know and we can figure out what other problem it could be.

Thanks! Will try it out and let you know.

Thanks! See here: Webflow - Res Publica

I am looking at your site.

It looks fine actually, not a performance issue as well.
Your images are large, but not really super large.

You could improve by using “img” instead of background-image in your featured image, especially on your home page which loads so many images.

If compressing and resizing images is not a workflow for you, you may consider adopting an auto-compress plugin.

You may also consider putting ShareThis js to last.

And you can also check this to make sure you are doing the updated A Record correctly as your DNS lookup time is not too good, or switch your DNS provider to Cloudflare which is free.