WordPress speed tweak

Edwardon

Website load speed greatly impacts your website search rankings, bounce rates, and overall user experience. I will list out several ways to improve it.

List will continuing update

  1. HTTPS
  2. Optimze Image
  3. Gzip
  4. CDN
  5. Cache
  6. Anycast DNS
  7. TTFB（Time To First Byte)

HTTPS

Now is 2019 era, Google and Mozilla push internet community to use HTTPS, HSTS to enhance security and improve SEO ranking. So just grab a free Let’s Encrypt SSL and you are ready to go. Also, remember to donate some money to Let’s encrypt if you think is helpful. ( no affiliate).

Optimize Image

I recommend to use some free wordpress plugin to optimize your thumbnail and add lazy loading.

GZIP

I have 2 solution for common server
To enable gzip compression simply add these lines to your .htaccess file:

#Gzip
<IfModule mod_deflate.c>
  # Compress HTML, CSS, JavaScript, Text, XML and fonts
  AddOutputFilterByType DEFLATE application/javascript
  AddOutputFilterByType DEFLATE application/rss+xml
  AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
  AddOutputFilterByType DEFLATE application/x-font
  AddOutputFilterByType DEFLATE application/x-font-opentype
  AddOutputFilterByType DEFLATE application/x-font-otf
  AddOutputFilterByType DEFLATE application/x-font-truetype
  AddOutputFilterByType DEFLATE application/x-font-ttf
  AddOutputFilterByType DEFLATE application/x-javascript
  AddOutputFilterByType DEFLATE application/xhtml+xml
  AddOutputFilterByType DEFLATE application/xml
  AddOutputFilterByType DEFLATE font/opentype
  AddOutputFilterByType DEFLATE font/otf
  AddOutputFilterByType DEFLATE font/ttf
  AddOutputFilterByType DEFLATE font/woff
  AddOutputFilterByType DEFLATE image/svg+xml
  AddOutputFilterByType DEFLATE image/x-icon
  AddOutputFilterByType DEFLATE text/css
  AddOutputFilterByType DEFLATE text/html
  AddOutputFilterByType DEFLATE text/javascript
  AddOutputFilterByType DEFLATE text/plain
  AddOutputFilterByType DEFLATE text/xml

  # Remove browser bugs (only needed for really old browsers)
  BrowserMatch ^Mozilla/4 gzip-only-text/html
  BrowserMatch ^Mozilla/4\.0[678] no-gzip
  BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
  Header append Vary User-Agent
</IfModule>
# End Gzip

# If mod_deflate doesn’t work on your server you can use mod_gzip
<IfModule mod_gzip.c>
  mod_gzip_on Yes
  mod_gzip_dechunk Yes
  mod_gzip_item_include file .(html?|txt|css|js|php|pl)$
  mod_gzip_item_include handler ^cgi-script$
  mod_gzip_item_include mime ^text/.*
  mod_gzip_item_include mime ^application/x-javascript.*
  mod_gzip_item_exclude mime ^image/.*
  mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</IfModule>
 
#Gzip
<IfModule mod_headers.c>
  Header set Connection keep-alive
</IfModule>
// Nginx.conf
# Enable Gzip compression.
gzip on;

# Disable Gzip on IE6.
gzip_disable "msie6";

# Allow proxies to cache both compressed and regular version of file.
# Avoids clients that don't support Gzip outputting gibberish.
gzip_vary on;

# Compress data, even when the client connects through a proxy.
gzip_proxied any;

# The level of compression to apply to files. A higher compression level increases
# CPU usage. Level 5 is a happy medium resulting in roughly 75% compression.
gzip_comp_level 5;

# The minimum HTTP version of a request to perform compression.
gzip_http_version 1.1;

# Don't compress files smaller than 256 bytes, as size reduction will be negligible.
gzip_min_length 256;

# Compress the following MIME types.
gzip_types
	application/atom+xml
	application/javascript
	application/json
	application/ld+json
	application/manifest+json
	application/rss+xml
	application/vnd.geo+json
	application/vnd.ms-fontobject
	application/x-font-ttf
	application/x-web-app-manifest+json
	application/xhtml+xml
	application/xml
	font/opentype
	image/bmp
	image/svg+xml
	image/x-icon
	text/cache-manifest
	text/css
	text/plain
	text/vcard
	text/vnd.rim.location.xloc
	text/vtt
	text/x-component
	text/x-cross-domain-policy;
  # text/html is always compressed when enabled.

CDN

There are three main types of content delivery networks: 

  1. Content Service Protocols: These are fully managed hosted networks designed to provide users access to the website files. The services we’re discussing in this blog post falls under this type.
  2. Peer-to-peer CDNs: With a very small setup and running cost, peer-to-peer (P2P) setups work between personal computers and therefore are not great for hosting your website’s files. BitTorrent is a popular example of a Peer-to-peer network.
  3. Private CDNs: Alternatively, if you’re not satisfied with available services, you can create your own private service. This means you have to create and manage own global network of servers to serve your static files.
Benefits

But today we will focus on Free CDN services

  1. Jetpack plugin, enable Photon image CDN FREE
  2. Host your domain at Cloudflare.com and active its proxy will slightly speed you up
  3. Coral CDN (p2p)
  4. jsDELIVR If you develop own WordPress theme, consider use jQuery or Bootstrap CDN with it.
  5. cdnjs same as jsdelivr

Cache

  1. WP Super Cache plugin
  2. Breeze plugin

Anycast DNS provider

  1. Cloudflare
  2. Hurricane Electric
  3. Freedns Afraid
  4. NS1
  5. CloudDNS.net
  6. 1984 DNS
  7. DYNU
DNS Speed Comparison Report by www.solvedns.com
DNS Speed Comparison Report by www.solvedns.com

TTFB

“Time spent waiting for the initial response, also known as the Time To First Byte. This time captures the latency of a round trip to the server in addition to the time spent waiting for the server to deliver the response.”

To put it simply, TTFB is the amount of time from the moment you navigate to a web page to the moment it starts rendering.

Google recommends a TTFB under 200ms.
Cloudflare says you should stop worrying about TTFB.
What will affect TTFB

  • Use better server, like VPS
  • Put your server in US or Singapore or Netherland
  • Use cache plugin
  • DNS response time

How to test:
1. http://testmysite.io
2. KeyCDN measure tool
3. PingDOM


References:
1. https://www.angle180.com/insights/how-to-speed-up-your-website-with-google-testmysite
2. https://github.com/A5hleyRich/wordpress-nginx/blob/master/global/gzip.conf
3. https://www.coralcdn.org/
4. https://wp-rocket.me/blog/how-to-reduce-ttfb-wordpress-site/