Hi @roblewi5, there are two things being addressed in the Page Speed report, which indicate that:
The CSS is being loaded from an external url, and pagespeed is asking to have that optimized, perhaps by loading the CSS inline. At the moment however this is not possible to change so that message will continue.
There is some script in the head of the site, that is required for all Webflow sites and cannot be removed. Page speed is asking to remove the scripts from the head and load that somewhere else, such as in the Before Body of custom code, however this too is not something that can be changed at the moment. There is a wishlist item for this here: Ability to toggle On/Off Modernizr script in the | Webflow Wishlist
Thanks for taking time to reply so comprehensively.
Website infrastructure is not my forte, and I was asking because I wondered if this was something I could action myself. I was not doubting Webflow’s abilities
The article is interesting and thanks for sharing. I can understand the Amazon servers and Fastly CDN Network will comfortably keep the TTFB down.
I do have to explain to my clients, whom I pass on the cost of the hosting, is that Webflow uses the fastest and securest servers around. This is because some of them know hosting is far cheaper elsewhere, but they are unaware what they get for their money behind the scenes.
a) By in-lining CSS styles on the page itself rather than a separate stylesheet file
Even if Webflow allows you to load the styles in the page itself (inline), it will be worse-off for the user, as the styles are no longer a separate file and can no longer be cached separately from the structure of the page. So if your user goes to another page of your site, they will have to completely download all the styles for your entire site on the new page, increasing loading times.
Making the styles inline on the page might only work well if your site is a single-page application with minimal styles.
Your project actually has three stylesheets that Webflow combines and minifies into a single file. I wouldn’t call that “minimal” as the process behind this is complicated due to all the options they provide in the project dashboard.
b) By asynchronously loading the external stylesheet
If you do not use any Google font AND Typekit fonts in your Webflow project, the render-blocking scripts that Webflow inserts for these two font libraries will not be placed in your site header. As simple as that. (The other Google Analytics script already has the async attribute).
The workaround described in the above link will only work well for a specially designed site with matching fallback fonts, not for general cases where users pick their fonts from a dropdown list like Webflow.
b) By in-lining JS on the page itself (for Web Font loader)
Yes it’s possible, but you can’t simply inline an external resource that isn’t created by you that might change its implementation/API suddenly and break your site.