Bandwidth Usage Optimization for Webflow Websites

A new client of Rapid Fire web studio recently expressed concerns about high bandwidth usage on their existing websites. They were curious whether it was possible to optimize their sites to reduce this usage. This has become a common request, especially since Webflow updated their pricing policies. With the new website plans, only 50GB of monthly bandwidth is included with the CMS plan and 100GB with the Business plan. If you need more bandwidth, you'll have to pay extra, with costs reaching up to $199/month for 500GB of bandwidth on the Business plan.

So, what is bandwidth?

Bandwidth is the amount of data transferred between your website and its users over the internet. It is typically measured in gigabytes (GB) or terabytes (TB) per month.

When someone visits your website, data is sent from your web server to their browser. This data includes HTML files, images, videos, stylesheets, scripts, and other resources that make up your website. The more visitors you have and the larger the files on your website (like high-resolution images or videos), the more bandwidth you will use.

For example, if a webpage is 2 MB in size and 1,000 users visit that page in a month, your website would use 2 GB of bandwidth just for that one page (2 MB x 1,000 = 2,000 MB or 2 GB).

What is the average bandwidth usage for websites of different sizes?

I'm fully aware of the misleading nature of average statistics, and I won’t try to give you an "average temperature in the hospital." Instead, I'll provide a few examples of websites and their bandwidth usage, leaving it to you to avoid generalizations.

Website #1: Small Agency Portfolio Website

• 31 static pages, 152 collection items, total asset size: 207.489 MiB (files, fonts, and backups).
• In the last 28 days: 145 clicks in Google search, 220 visitors.
• Bandwidth used: 1.1 GB.

Website #2: Medium-Sized Enterprise Corporate Website

• 52 static pages, 476 collection items, total asset size: 10.738 GiB (files, fonts, and backups).
• In the last 28 days: 1.67k clicks in Google search, 5.3k visitors.
• Bandwidth used: 82.2 GB.

Website #3: Blog

• 12 static pages, 1,864 collection items (blog-heavy), total asset size: 5.653 GiB (files, fonts, and backups).
• In the last 28 days: 3.69k clicks in Google search, 12k visitors.
• Bandwidth used: 456.3 GB.

This data clearly shows how total asset size and visitor numbers correlate with bandwidth usage.

How can you lower your bandwidth in Webflow?

Webflow University offers a solid to-do list that should be implemented as soon as possible:

1. Compress images in the Assets panel.
2. Compress images in the CMS panel.
3. Reduce usage of background videos.
4. Minify your site’s HTML, CSS, and JS.
5. Clean up unused styles.
6. Clean up unused interactions.
7. Optimize your site for different devices and browsers.
8. Replace background image styles with inline images positioned via object-fit.
9. Delete unused fonts from your site.
10. Delete unused assets from the Assets panel.

These steps won't drastically reduce your website’s bandwidth, but they do make a difference. We recommend implementing them as soon as possible if you haven’t already.

For more complex solutions, consider edge caching or splitting your website into multiple projects and serving them from one domain with a reverse proxy. You can also increase your bandwidth beyond 500GB with the Enterprise website plan, which reportedly starts at $15,000 USD billed yearly.