CSS doesn’t load for a second or two

You should read this: https://blog.litespeedtech.com/2021/06/01/guest-mode-for-wordpress-in-lscwp-v4-0/

Thanks for the article. I have Guest Mode switched on – although I had it switched on WITHOUT Mobile Cache. That’s now on so I’ll see what difference it makes

Mobile cache doesn’t matter in this case. If Guestmode is ON the first view is max optimized according to the post at LiteSpeed for fast page load. You can try to combine CSS and UCSS inline. Also always keep the cache warmed with the crawler. This reduces the time for page reload at the first request dramatically.

Thanks for this. I’ve combined the CSS and UCSS inline. I’ll see what the result is in a few days. See below for the CSS settings I currently have.

I’m not sure about enabling the Crawler. Its default turned off on my (shared) hosting and running Woocommerce on this site has already caused memory and usage issues. I’d prefer to optimize as much as I can without it and then work though it carefully at the end if I have to. Basically, I don’t want two hungry systems competing for resources, making everything run slow and me not know what to do except switch stuff off.

It may sound paradoxical to you, but the loading time of a website does not become fast from optimizations. Only the cache can make your site really fast. This does not mean, however, that optimizations are unnecessary. You just have to differentiate. There is the loading time and there is the “display time”. Both are something completely different. The loading time is the time it takes to load sources from the server. But loading is not enough. The loaded data must also be processed by the browser and this processing is the display time. PageSpeed cannot measure the loading time, only the display time. Ultimately, however, it is not the display time that counts, but both, the loading time AND the display time, because only both determine how quickly a page is loaded. In any case, you must ensure that the cache is warmuped, precisely because only a warmed cache makes your site faster and not the optimizations. If your hosting provider has disabled the crawler function, you should either look for another hosting provider or look for alternatives to the built-in crawler. There are special crawlers that have been programmed exactly for LiteSpeed and for the LiteSpeed Cache Plugin and cannot be blocked by the hosting provider.

That explains why I’m seeing the issue after I’ve left the site for a few days. The cache isn’t warmed up.

Will the issue only be solved by having the cache warmed up?

Thanks again by the way.

Will the issue only be solved by having the cache warmed up?

This is relative. The faster the page loads, the less the side effect is perceived. So the obvious solution is already with the warmed cache. Normally this side effect should not occur at all and you would only see a short flickering of the page with no content. However, this only works if less data has to be loaded. If you load external sources, such as Google Analytics or any social media sources, then these external requests slow down the page loading process considerably, which is very difficult to fix. Ultimately, the solution lies in loading as little as possible. The optimization settings can help with this, but it doesn’t work perfectly in all cases, which is usually due to an overloaded theme.

I built the theme myself so I’m going to tweak functions.php and see if I can get the CSS loading first. Thanks for your help. I’ll have to wait a few days for these changes to percolate through so I won’t be able to measure successes yet.

With the cache plugin and activated guest mode, you cannot influence the loading of CSS through manual changes.

Ah OK, so I should switch that off if I’m messing around with functions.php