WordPress snippets to reduce page load

One of the best ways to improve the sustainability of a website is to speed it up. Reduce the load and therefore reduce the amount of carbon used. Here are some of our favourite snippets for WordPress in order to reduce the bloat and load that page quicker!

Remove Gutenberg from the front-end

// Remove Gutenberg Block Library CSS from loading on the frontend

function susdev_remove_wp_block_library_css(){
 wp_dequeue_style( 'wp-block-library' );
 wp_dequeue_style( 'wp-block-library-theme' );
 wp_dequeue_style( 'wc-block-style' );
add_action( 'wp_enqueue_scripts', 'susdev_remove_wp_block_library_css', 100 );

Remove Emoji’s from WordPress

// Disable the emojis

function susdev_disable_emojis() {
 remove_action( 'wp_head', 'print_emoji_detection_script', 7 );
 remove_action( 'admin_print_scripts', 'print_emoji_detection_script' );
 remove_action( 'wp_print_styles', 'print_emoji_styles' );
 remove_action( 'admin_print_styles', 'print_emoji_styles' ); 
 remove_filter( 'the_content_feed', 'wp_staticize_emoji' );
 remove_filter( 'comment_text_rss', 'wp_staticize_emoji' ); 
 remove_filter( 'wp_mail', 'wp_staticize_emoji_for_email' );
 add_filter( 'tiny_mce_plugins', 'disable_emojis_tinymce' );
 add_filter( 'wp_resource_hints', 'disable_emojis_remove_dns_prefetch', 10, 2 );
add_action( 'init', 'susdev_disable_emojis' );

Coming to WordPress 5.5 – native lazy loading for images

In WordPress 5.5, images will be lazy-loaded by default, (hoorah!) using the native HTML loading attribute which became a web standard earlier in 2020. This will drastically save bandwidth on both servers as well as user agents across sites where images further down the page used to be loaded right away, even in the case the user might never scroll towards them.

While there aren’t any specific snippets for this function, as it will be added by default to images with width and height attributes, there are further filters coming to help facilitate it’s implementation. Such as the wp_filter_content_tags() filter. You can find out more about the WordPress native lazy loading feature by heading over to the Make WordPress Core website.

We hope you found these useful, check back soon for more snippets and info to help speed up WordPress!

Find this resource useful?

I want everyone to be able to benefit from articles like this.

That's why I need your help in spreading awareness. Please consider telling your fellow developers about the sustainable.dev by sharing a Tweet.

Tweet about the sustainable.dev