5.2.1 Storing counters in Redis

In order to update counters, we’ll need to store the actual counter information. For each counter and precision, like site hits and 5 seconds, we’ll keep a HASH that stores information about the number of site hits that have occurred in each 5-second time slice. The keys in the hash will be the start of the time slice, and the value will be the number of hits. Figure 5.1 shows a selection of data from a hit counter with 5-second time slices.

As we start to use counters, we need to record what counters have been written to so
that we can clear out old data. For this, we need an ordered sequence that lets us iterate
one by one over its entries, and that also doesn’t allow duplicates. We could use a LIST
combined with a SET, but that would take extra code and round trips to Redis. Instead,
we’ll use a ZSET, where the members are the combinations of precisions and names that
have been written to, and the scores are all 0. By setting all scores to 0 in a ZSET, Redis
will try to sort by score, and finding them all equal, will then sort by member name. This gives us a fixed order for a given set of members, which will make it easy to sequentially
scan them. An example ZSET of known counters can be seen in figure 5.2.

Figure 5.1A HASH that shows the number of web page hits over 5-second time slices around 7:40 a.m. on May 7, 2012
Figure 5.2A ZSET that shows some known counters

WordPress: Redis Object Cache

A persistent object cache backend powered by Redis. Supports PredisPhpRedis (PECL), HHVM, replication, clustering and WP-CLI.

To adjust the connection parameters, prefix cache keys or configure replication/clustering, please see Other Notes.

Forked from Eric Mann’s and Erick Hitter’s Redis Object Cache.

REDIS CACHE PRO

business class Redis object cache backend. Truly reliable, highly optimized, fully customizable and with a dedicated engineer when you most need it.

  • Rewritten for raw performance
  • WordPress object cache API compliant
  • Easy debugging & logging
  • Fully unit tested (100% code coverage)
  • Secure connections with TLS
  • Seamless WP CLI & Debug Bar integration
  • Optimized for WooCommerce, Jetpack & Yoast SEO

WordPress Performance – Breaking It Down by HTTP Requests

1. Disable Emojis with Code#

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

<span class="token comment">/**
 * Disable the emoji's
 */</span>
<span class="token keyword">function</span> <span class="token function">disable_emojis</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
    <span class="token function">remove_action</span><span class="token punctuation">(</span> <span class="token single-quoted-string string">'wp_head'</span><span class="token punctuation">,</span> <span class="token single-quoted-string string">'print_emoji_detection_script'</span><span class="token punctuation">,</span> <span class="token number">7</span> <span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token function">remove_action</span><span class="token punctuation">(</span> <span class="token single-quoted-string string">'admin_print_scripts'</span><span class="token punctuation">,</span> <span class="token single-quoted-string string">'print_emoji_detection_script'</span> <span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token function">remove_action</span><span class="token punctuation">(</span> <span class="token single-quoted-string string">'wp_print_styles'</span><span class="token punctuation">,</span> <span class="token single-quoted-string string">'print_emoji_styles'</span> <span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token function">remove_action</span><span class="token punctuation">(</span> <span class="token single-quoted-string string">'admin_print_styles'</span><span class="token punctuation">,</span> <span class="token single-quoted-string string">'print_emoji_styles'</span> <span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token function">remove_filter</span><span class="token punctuation">(</span> <span class="token single-quoted-string string">'the_content_feed'</span><span class="token punctuation">,</span> <span class="token single-quoted-string string">'wp_staticize_emoji'</span> <span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token function">remove_filter</span><span class="token punctuation">(</span> <span class="token single-quoted-string string">'comment_text_rss'</span><span class="token punctuation">,</span> <span class="token single-quoted-string string">'wp_staticize_emoji'</span> <span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token function">remove_filter</span><span class="token punctuation">(</span> <span class="token single-quoted-string string">'wp_mail'</span><span class="token punctuation">,</span> <span class="token single-quoted-string string">'wp_staticize_emoji_for_email'</span> <span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token function">add_filter</span><span class="token punctuation">(</span> <span class="token single-quoted-string string">'tiny_mce_plugins'</span><span class="token punctuation">,</span> <span class="token single-quoted-string string">'disable_emojis_tinymce'</span> <span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>

<span class="token function">add_action</span><span class="token punctuation">(</span> <span class="token single-quoted-string string">'init'</span><span class="token punctuation">,</span> <span class="token single-quoted-string string">'disable_emojis'</span> <span class="token punctuation">)</span><span class="token punctuation">;</span>

<span class="token comment">/**
 * Filter function used to remove the tinymce emoji plugin.
 *
 * @param    array  $plugins
 * @return   array             Difference betwen the two arrays
 */</span>
<span class="token keyword">function</span> <span class="token function">disable_emojis_tinymce</span><span class="token punctuation">(</span> <span class="token variable">$plugins</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span>
    <span class="token keyword">if</span> <span class="token punctuation">(</span> <span class="token function">is_array</span><span class="token punctuation">(</span> <span class="token variable">$plugins</span> <span class="token punctuation">)</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span>
        <span class="token keyword">return</span> <span class="token function">array_diff</span><span class="token punctuation">(</span> <span class="token variable">$plugins</span><span class="token punctuation">,</span> <span class="token keyword">array</span><span class="token punctuation">(</span> <span class="token single-quoted-string string">'wpemoji'</span> <span class="token punctuation">)</span> <span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span>
        <span class="token keyword">return</span> <span class="token keyword">array</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token punctuation">}</span>
<span class="token punctuation">}


</span>

Step 6. Host Google Fonts#

Next, if we look closer we can see there are 4 requests being generated to fonts.gstatic.com. And this is to load Google fonts, which is included in the default WordPress theme. In our example, it is loading different font weights for Merriweather and Montserrat.

https://fonts.googleapis.com/css?family=Merriweather%3A400%2C700%2C900%2C400italic%2C700italic%2C900italic%7CMontserrat%3A400%2C700%7C&subset=latin%2Clatin-ext

https://fonts.gstatic.com/s/montserrat/v7/IQHow_FEYlDC4Gzy_m8fcoWiMMZ7xLd792ULpGE4W_Y.woff2

https://fonts.gstatic.com/s/merriweather/v13/RFda8w1V0eDZheqfcyQ4EOgdm0LZdjqr5-oayXSOefg.woff2

https://fonts.gstatic.com/s/montserrat/v7/zhcz-_WihjSQC0oHJ9TCYPk_vArhqVIZ0nv9q090hN8.woff2

It always better to reduce the number of external DNS lookups and also focus on having a single HTTP/2 connection if possible. Every external lookup introduces its own set of latency issues, content download times, TLS negotiations, etc. So what we are going to do is move the Google fonts to our CDN. This way they load from the same place as the rest of our assets.

You can check out our in-depth tutorial on how to migrate Google Fonts to your CDN. This can also be used to simply host them directly on your web server as well, if you aren’t using a CDN. We quickly download the following Google fonts from https://google-webfonts-helper.herokuapp.com and host them on our server in a folder called “fonts.”

<span class="token punctuation"> </span>

Step 7. Disable Gravatars#

As you can see we are almost down to a single HTTP/2 connection with no external DNS lookups. The only thing left is that call to gravatar.com. Thankfully they are using HTTP/2 now, but unless you really want avatars, you can disable them.

gravatar http request

This can easily be remove by un-checking the “show avatars” in the discussion setting of your WordPress dashboard.

<span class="token punctuation">

</span>

By removing the call to gravatar.com we are now down to 11 HTTP requests and are using a single HTTP/2 connection for external assets on our CDN.

18 Tips on How to Speed Up WordPress

Prefetch Google Fonts:#
<span class="token tag"><span class="token punctuation"><</span>link <span class="token attr-name">rel</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>dns-prefetch<span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>//fonts.googleapis.com<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
Prefetch Google Code (jQuery)#
<span class="token tag"><span class="token punctuation"><</span>link <span class="token attr-name">rel</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>dns-prefetch<span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>//ajax.googleapis.com<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
Prefetch Google Analytics#
<span class="token tag"><span class="token punctuation"><</span>link <span class="token attr-name">rel</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>dns-prefetch<span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>//www.google-analytics.com<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>