未加星标

WordPress Performance Breaking It Down by HTTP Requests

字体大小 | |
[开发(php) 所属分类 开发(php) | 发布者 店小二05 | 时间 2016 | 作者 红领巾 ] 0人收藏点击收藏

WordPress can be a tricky beast as they say when it comes to web performance. Especially if you are comparingitagainst others running static sites. Because WordPress is based onphp and most of the content is dynamically generated, it meansyou need to find other ways to optimize. In today’s post, we are going to dive into a fresh WordPress install and take it apart piece by piece, or rather by HTTP requests, to hopefully help you gain a better understanding of WordPress performance. WordPress can load a lot faster than what some people might lead you to believe!

Breaking Down WordPressPerformance

In this post, we are going to first tear down a fresh install and then afterwards make some improvements to it. Make sure to also check out our speed up WordPress guide for additional tips on improving WordPress performance.In this case study, we are running on NGINX, over HTTPS and HTTP/2. If you are starting a new website, we encourage you to take advantage of HTTP/2 right off the bat. Or check out our HTTP to HTTPS migration guide .

Understanding the basics when it comes to web performance makes it easier to apply advanced methods later.

Contents

Breaking Down WordPressPerformance Step 1. Disable Emojis Step 2. Disable Embeds Step 3. ImplementCaching Step 5. Remove Query Strings Step 6. Host Google Fonts Step 7. Disable Gravatars WordPress Performance In Summary

Our fresh WordPress site isusing the default Twenty Sixteen theme .

Let’s first take a look at each HTTP request that is generated out of the box, as there are a couple you can probably get rid of. So by default, we have a site with 15 HTTP requests at a page size of 135 KB. And a decent load time. Remember, as you add media and content to your site your load time will only increase, so it is better to optimize your site as much as possible first, and then add content. Also, if you are starting with a different base theme, you can apply almost everything we do below as well, although it might vary slightly.


WordPress Performance   Breaking It Down by HTTP Requests
Step 1. Disable Emojis

The first one is the wp-emoji-release.min.js file. This file is used for showing emoji characters in WordPress, since version 4.2 . Unless you absolutely can’t live without emojis, we recommend this is the first thing to get rid of on a fresh install. To disable emojis you have the following to options:

1. Disable Emojis with Code

The first way to disable emojis is you can put the following code into your functions.php file.

/**
* Disable the emoji's
*/
function 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_action( 'init', 'disable_emojis' );
/**
* Filter function used to remove the tinymce emoji plugin.
*
* @param array $plugins
* @return array Difference betwen the two arrays
*/
function disable_emojis_tinymce( $plugins ) {
if ( is_array( $plugins ) ) {
return array_diff( $plugins, array( 'wpemoji' ) );
} else {
return array();
}
} 2. Disable Emojis with Plugin

If you prefer to use a free lightweight plugin, Ryan Hellyer has created a great“ Disable Emojis ” plugin for WordPress. The total size of the plugin is only 9 KB .


WordPress Performance   Breaking It Down by HTTP Requests

Remember, with plugins it isn’t always bad to have a lot of them running. It is more about quality of the plugin vs quantity . If a plugin is lightweight, it won’t slow your site down. Essentially all this plugin is doing is running the code we shared above. After doing this we are now left with 14 HTTP requests at a total size of 129 KB.


WordPress Performance   Breaking It Down by HTTP Requests
Step 2. Disable Embeds

Next, we will look at the wp-embed.min.js script. This has been included in WordPress since version 4.4.This is a script that auto formats pasted content in the visual editor, such as videos, tweets, etc. However, this is not really needed. A big issue with this script is that it loads on every single page, whether it is being used or not. You can still use the default embed code from YouTube and Twitter to included content, even when this script is disabled. Again we have two options:

1. Disable Embeds with Code

The first way to disable embedsis you can put the following code into your functions.php file.

// Remove WP embed script
function speed_stop_loading_wp_embed() {
if (!is_admin()) {
wp_deregister_script('wp-embed');
}
}
add_action('init', 'speed_stop_loading_wp_embed'); 2. Disable Embeds with Plugin

If you prefer to use a free lightweight plugin, Pascal Birchler has created a great“ Disable Embeds ” plugin for WordPress. The total size of the plugin is only 3KB and features the following:

Prevents others from embedding your site. Prevents you from embedding other non-whitelisted sites. Disables all javascript related to the feature.
WordPress Performance   Breaking It Down by HTTP Requests

After doing this we are now left with 13 HTTP requests at a total size of 128 KB. You can also see that our DOMContentLoaded and total Load time keeps decreasing as we make these WordPress performance tweaks. We are using Chrome DevTools and have caching disabled.


WordPress Performance   Breaking It Down by HTTP Requests
Step 3. ImplementCaching

Notice above in all of our speed tests that thefirst HTML initial DOC load is quite high. Even when we enable caching in Chrome DevTools it still hovers around 180 ms. So to fix the initial HTML DOC load time, you need to implement a caching mechanism. In this case, we are going to use the free WordPress Cache Enabler plugin from KeyCDN.


WordPress Performance   Breaking It Down by HTTP Requests

Cache Enabler is alightweight caching plugin for WordPress that makes your website faster by generating static HTML files to disk. This is a very fast method of caching. The plugin also focuses on HTTP/2, meaning you won’t find options for concatenation, as this can hurt HTTP/2 performance.The total size of the plugin is only 15.4 KB .


WordPress Performance   Breaking It Down by HTTP Requests
In the Cache Enabler plugin set

本文开发(php)相关术语:php代码审计工具 php开发工程师 移动开发者大会 移动互联网开发 web开发工程师 软件开发流程 软件开发工程师

主题: HTMLWordChromeJavaScriptPHPCDNJavaTwitter
分页:12
转载请注明
本文标题:WordPress Performance Breaking It Down by HTTP Requests
本站链接:http://www.codesec.net/view/484869.html
分享请点击:


1.凡CodeSecTeam转载的文章,均出自其它媒体或其他官网介绍,目的在于传递更多的信息,并不代表本站赞同其观点和其真实性负责;
2.转载的文章仅代表原创作者观点,与本站无关。其原创性以及文中陈述文字和内容未经本站证实,本站对该文以及其中全部或者部分内容、文字的真实性、完整性、及时性,不作出任何保证或承若;
3.如本站转载稿涉及版权等问题,请作者及时联系本站,我们会及时处理。
登录后可拥有收藏文章、关注作者等权限...
技术大类 技术大类 | 开发(php) | 评论(0) | 阅读(17)