[Support request] woocommerce shop page sidebar CLS and delay loading

[Sam]

Hello, just transfer my woocommerce site to a new fresh ubuntu 22.04 site with apache and mysql.

Problems:

1. Load shop page and the sidebar causing CLS and delay loading. Menu is OK.
2. Whenever click the category menu at the sidebar, shop page refresh and sidebar causing CLS and delay loading.

My previous server is nginx. There is no cache enabled either in server level or by wordpress plugins.

I have enclosed a demo site. Thank you very much in advance.

[Ying]

Hi Sam,

Try adding this CSS to avoid CLS:

.both-sidebars #primary {
    margin-left: auto;
    margin-right: auto;
}

[Sam]

I did. It reduced the CLS. However, sidebar delay loading is not solved. This situation did not happen in the old ngnix server. Is it related to the new apache server setting?

Whenever you load the woocommerce shop and category page, they will be reloaded and the sidebar will displayed later. The sidebar and some element will be like flash once.

[Fernando]

Hi Sam,

I can’t seem to replicate the issue of the delay in loading. The sidebar seems to load pretty fast on the category and the shop page, or any page that I tested.

There’s no CLS caused by the sidebar from my tests through PageSpeed Insights as well.

Can you re-check or re-test with a different device?

[Sam]

Please take a look at this video, thanks. I found it very strange. May be it is related to how apache and nginx display the web page differently.

[David]

Hi there,

that could be you server.
The sidebars come after the main-content in the HTML so if the server is rendering on the fly you may see that kind of effect.
Check with your host if that is the case.

[Sam]

Thank you for your reply. Can you tell me more about rendering on the fly? What setting is related to this issue? I did a search about rendering on the fly apache but did not get much information. Thanks!

[Author]

Posts