H2 hero text has a 16,000ms Render Delay, why?

Google Page Speed Insights: https://pagespeed.web.dev/analysis/https-www-pushpress-com/t0nmq8untw?form_factor=mobile

Shows that our hero section h2 text is causing a huge render delay. We are using a custom font, but are also using a display: swap command, so it should not be blocking.


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

I recommend doing your analysis with browser dev tools or https://www.webpagetest.org/, which provides lots of great info and resources if you want to learn about performance. GPS is not an optimization tool; rather, it is insightful about real-world visitor experience and how your site generally performs. It also clearly shows whether your site is passing CWVs. Failure to pass CWV’s can impact SEO.

There are plenty of things you can do to improve your site that will reduce the visual loading process and translate into increased conversions. Unfortunately, it requires hard work. Start with each actionable thing that you can, starting with those items that are having the biggest impact on visitors. You can’t expect a no-code tool to make the choices for you; it won’t.

Tip: Don’t load Google fonts from Google. Webflow supports you uploading custom fonts. Do that instead. Sites that do that get an instant improvement in page speed performance and GDPR compliance.

Tip: Since jQuery is already loaded on Webflow deployments, don’t load another version of it unless there is a real reason. If you have a script that has a dependency on old versions, get rid of that script and find a replacement.

Optimizing the performance of a complex site can be a time-consuming process, often requiring you to make tough decisions about what to load. However, it’s a task that can’t be ignored. Slow pages have a detrimental effect on conversions, underscoring the urgency of optimizing your site’s performance. Keep in mind, there may be limitations to what you can do when hosting with Webflow, as some choices are fixed for you.

2 Likes

I also had a similar issue as Shannon, and found that Google Fonts was causing the majority of the problem for me as the sites I was working on were directly importing their fonts from Google Fonts rather than the fonts being uploaded to the ‘Custom Fonts’ section of the Site Settings.

I also found that fonts set in the Designer can cause Google Fonts API calls, even if they’re not ‘imported’ in the Site Settings area. I recently wrote a blog post explaining a bit more in-depth about how I fixed it all and got page speed performance up again: How to Fix Google Fonts Slowing Down Your Webflow Site | Lightning UX

Hope that helps!