With version 4 we have entirely put into action “load on demand” technology. We have Build-In cache module and static resource optimizations that can help load optimize the site even without any separate cache plugin.
The other change we have made on loading speed point was long time ago. Since version 2 of Easy Social Share Buttons we provide divided desktop and mobile display methods, which is really big step about speed optimization.[/vc_column_text][/vc_column][/vc_row][vc_row][vc_column][vc_column_text]
Why separate desktop and mobile display methods are better than responsive design?
[/vc_column_text][vc_column_text]The conventional responsive design includes into page size all the functions necessary to visualize the buttons on the desktop and mobile device. The control over the visibility is based on the width of the screen. No matter of the device used, with each load the code for desktop and mobile is generated, but only one of them is visualized.With the mobile displays we have applied at Easy Social Share Buttons the check for the type of the device is on server level. That way ESSB loads only the code that respond the device type used. The advantages of that technique are three:
- Avoid loading unnecessary data – As you probably can guess less code means faster load. Is there need to explain more? 🙂
- Additional mobile speed optimization can be done
- Control over everything – On mobile you can set absolutely different outlook of the buttons, that fit best on your mobile website design and functionality. On out thought that is something really important! There are really great desktop displays, but they are not appropriate for mobiles, because of the small width of the screen. That is why we offer our customers the freedom to make choice.
Separate desktop/mobile displays and cache plugins
[/vc_column_text][vc_column_text]The users that care about the loading speed usually combine server detected mobile display with cache plugin. What is really important in that setting configuration is the type of the cache plugin used. Most of the cache plugins do not support separate cache for desktop and mobiles and for that reason the methods set for each device type do not display correctly. In that case desktop and mobile displays are transposed and which of them will display depends on what devise each URL is opened for first time. That issue is easy to be explained – with the first open of the URL cache plugin store the data for the page. And when there is no mobile cache, whit mobile load for the same URL content displayed is the same as desktop – including buttons display.[/vc_column_text][vc_column_text css=”.vc_custom_1476265625211{padding-top: 10px !important;padding-right: 10px !important;padding-bottom: 10px !important;padding-left: 15px !important;background-color: #f46665 !important;border-radius: 1px !important;}”]The most popular cache plugins that do not support separate desktop and mobile cache are WP Super Cache and W3 Total Cache.
Popular cache plugin that does separate desktop and mobile cache is WP Rocket.
[/vc_column_text][vc_column_text]Here are some setting tips how to combine server based mobile display with cache plugin depend on the type of cache.[/vc_column_text][/vc_column][/vc_row][vc_row][vc_column][vc_text_separator title=”WP Super Cache” title_align=”separator_align_left” align=”align_left”][vc_column_text]That is free cache plugin that works well and for that reason it is very popular. But as we said it does not support mobile cache. So here are the settings need to be done to have different displays for desktop and mobile:- Go to WP Super Cache Settings -> Advanced and activate the option Mobile device support. Then press Update Status button.
[/vc_column_text][vc_column_text]4. Scroll down at the same tab and activate Client Side Mobile Detection and turn on all the options that will be shown after the activation:
[/vc_column_text][vc_column_text]5. Update your settings and clear the cache.[/vc_column_text][/vc_column][/vc_row][vc_row][vc_column][vc_text_separator title=”W3 Total Cache” title_align=”separator_align_left” align=”align_left”][vc_column_text]
- Go to Browser Cache settings under Performance tab and:
- enable Browser Cache option
- disable Set expires header
[/vc_column_text][vc_column_text]2. Go to Page Cache, find Rejected User Agents section and paste there the list with the user agents shown above. Then save your settings.
[/vc_column_text][vc_column_text]2. Scroll down to find Rejected User Agents section and paste there the list with the user agents shown above. Then save your settings.
3. The settings at Easy Social Share Buttons need to be done are the same as described above. Please find steps 3., 4., 5. under WP Super Cache setting tips and follow them.[/vc_column_text][vc_text_separator title=”WP Rocket” title_align=”separator_align_left” align=”align_left”][vc_column_text]
- Go to WP Rocket settings, find the Mobile cache section and activate the mobile cache at it is shown below:
