Archived topic
cls desktop
7 replies · Started by Daniel on April 16, 2022
hi its the first time i use your theme
i have installed in cloudways to test it
im really happy with most things
but befor i can change my live site to your theme i had to check speed and pagespeed insights
values was good with wp rocket turned on
not perfect but good
but there was a cls shift on desktop that is too high
so i turned of every cache but the value did not change
so can you please check what causes this problem
thanks in advance and best regards
Hi Daniel,
I assume you are using the Marketer template which doesn't come with CLS problem.
Can you try disable all your cache plugins for us to test?
i already disabled every possible cache
varnish and wp rocket
maybe there is something from the hoster in automatic (cloudways) but if there is i wil have the sameproblem on the live site
It looks WP Rocket is still on:
https://www.screencast.com/t/fbBB8LG0
Can you also disable other plugins except GP premium?
hi
disabled everything the only plugin on the page is gp premium but still have the same cls
please let me know
Hi there,
the only detectable CLS i can see is related to the google font swapping during render. I ran a webpage test so you can see whats going on:
https://www.webpagetest.org/result/220418_AiDcGV_92E/1/details/#step1_request
NOTE: on Line #10 of the Waterfall is the google font.api request. But the actual font isn't loaded until #17 after the render has began.
Which is peculiar as the font generally loads a little after the API request.
Whats even weirder is that Google PSI complains of Ensure text remains visible during webfont load which generally only shows up when there is no font swapping being seen, which clearly isn't the case.
Best option to fix or reduce the CLS is to load the font locally ( or use System Fonts):
https://docs.generatepress.com/article/adding-local-fonts/
This will remove the delay incurred by the additional DNS lookups and 3rd party network requests, and in turn load the font faster which in turn reduces CLS.
thanks for your help
now its perfect
any other advise you can give me to improve the site performance ?
On that site? Aside from Google fonts i would look at:
a. In Customizer > General make sure:
- Dynamic CSS Print Method is set to External File
- Icon Type is SVG
- Cache Dynamic CSS is checked
They're minor things but every little helps
b. Page Caching preferably server side, if not a plugin will do, that will improve initial server response times.
c. Removing jQuery dependencies if possible but that does mean ditching the GP Sticky Navigation.
