Archived topic
Performance on mobile
7 replies · Started by Bernhard on November 13, 2019
Hi there,
I try to improve performance on mobile and try to figure how to proceed.
I made a test with darebust.com report
The first thing I see it is loading images in the sidebar, but the sidebar is hidden with the code
@media (max-width: 768px) {
#right-sidebar {
display: none;
}
}
How can I avoid that it is still loading these resources?
Then I see a lot more items in the report and I'm wondering, how relevant they are.
For example, the duplicate menu items, is this because I created a backup of the menus or is it another problem?
I see some items which probably will need coding. Then it complains, that instead of the wpfastest cache file I shall group some scripts in one or more distinct files. This is quite confusing for me.
It would be very helpful if you could give me some suggestions how to proceed.
Thank you
Hi there,
tricky one with the sidebar, you can try this PHP snippet that uses the wp_is_mobile() function to detect the site is being viewed on a mobile device and removes the sidebar
add_filter( 'generate_sidebar_layout','db_remove_mobile_sidebar' );
function db_remove_mobile_sidebar( $layout )
{
// If we are viewing on mobile device remove sidebar
if ( wp_is_mobile() )
return 'no-sidebar';
// Or else, set the regular layout
return $layout;
}
Duplicate menus are not something you can avoid when using the mobile header or slideout panels.
Perfect, problem solved.
One more question: Do you have experience with CloudFlare Plus - Faster Mobile Speed? Makes it sense to use it with GPP?
I personally don't use Cloudflare - rarely do i have the need for CDN as most sites i work are served to the local audience. If you have a global audience then its worth considering.
Thank you :)
You're welcome
If I wanted to remove just the right sidebar on mobile, is there a snippet to do that?
And, if I wanted to remove the sidebar on mobile for just posts, would the snippet look like this? Thanks!
add_filter( 'generate_sidebar_layout','db_remove_mobile_sidebar' );
function db_remove_mobile_sidebar( $layout )
{
if ( wp_is_mobile() && is_single('post') )
return 'no-sidebar';
return $layout;
}
Hi there,
for the single post you can just use: is_single()
Other than that yes, that function will do that.
Note: If you have Page Caching on your site, then you need to ensure it has separate caches for Desktop and Mobile.
Otherwise the first cache of the page will displayed no matter what the device.