Category Archives: Research and Development

Page Speed Load Time Optimizations

Here are a few important ways to speed up page loading times, together with the improved recorded times for comparison on a typical WordPress web site. While WordPress is hardly an optimized web application, it does benefit from the same speedup methods as most web applications.

I used Google Chrome Developer Tools to time network transfers and page load times. There are various web-based tools available as well:

Initial speed – 1.412 sec (TTFB 0.12 sec)

This was the speed on a fresh install of a WordPress web site on a small VPS running Nginx and PHP-FPM.

Enabling GZip compression – 1.326 sec (TTFB 0.13 sec)

Using compression on network transfers can greatly reduce file sizes, especially for text-based files such as HTML, CSS and JavaScript. The CPU overhead on modern servers is negligible, and can be cached if required.

PHP Opcode cache – 1.299 sec (TTFB 0.124 sec)

PHP scripts are typically compiled to bytecode on demand. By caching this complication with OPcache or APC, page load times and server load can be significantly reduced. APC did include a fast key/value cache, which has now been replaced by APCu.

WordPress Cache – 0.733 sec (TTFB 0.122 sec)

There are many WordPress cache plugins available, which reduce the amount of PHP code that has to be run on every request. Some caches can generate flat files, which are significantly faster, and can be used with Nginx.

Nginx FastCGI Cache – 0.731 sec (TTFB 0.119 sec)

Nginx is able to use a fast memory/disk cache to cache requests to PHP-FPM, further reducing page load times and server loads. This can be very beneficial on web sites with high load.

There are many other ways to speed up page load times, including dependency concatenation and minification and image optimization. It is also important to optimize client-side JavaScript to allow the user’s web browser to display content quickly.

AnyCast DNS

An initial visit to a web site requires a DNS lookup. Traditionally DNS has no way to send requests to the geographically closest server, but this is possible with AnyCast DNS. This feature is available on many providers including Amazon’s Route 53, Google’s Cloud Platform and Microsoft Azure. It functions by allowing multiple servers distributed throughout the world to have the same IP address.

By using AnyCast DNS, I was able to reduce an initial DNS request from 93 milliseconds to 18 milliseconds. Combined with having an optimized web server geographically close, even an initial visit to a web page can be displayed instantaneously.

Before AnycastDNS
After AnycastDNS


Subtracting the round trip time to the server of 0.116 seconds, these optimizations reduced the effective Time To First Byte to 3 milliseconds. On a busy server, these optimizations will make a significant difference to the capacity of the server.


SSL/HTTPS Mixed Content Warnings – How to Automatically Report Errors

The general push to use SSL/HTTPS for every web site is improving security and privacy on the Internet. However, every request a web site makes will need to be secure, or browsers can remove the ‘Secure’ indicator, show a warning symbol, and sometimes pop up errors.

You can add a simple header that will tell browsers to report back to your server if any insecure requests are made. I combined this with a simple PHP script that logs to the server’s error log.  This alerts me to sites I host and develop that have insecure content, so I can fix them.

Step 1 – Add the Content Security Policy reporting header

add_header Content-Security-Policy-Report-Only "report-uri /csp-report-endpoint.php";

Step 2 – Add PHP Script

Add this simple PHP script as csp-report-endpoint.php:


Now, when a site attempts to load an insecure resource, you will get a message in your error log, and you can use this information to fix your site.

Improving SSL/HTTPS Security to an A+

These simple steps can improve your Qualys SSL Report to an A+:

Step 1: Getting my initial report (B):

You can get a Qualys SSL Report on any site. My rating started as a B with a reasonably good setup:

Step 2: Improving Ciphers List

SSL v2 is insecure, so it needed to be disabled, and SSLv3 also needed to be disabled as TLS 1.0 suffers a downgrade attack, allowing an attacker to force SSLv3 disabling forward secrecy. I updated my nginx config to use:

ssl_protocols TLSv1 TLSv1.1 TLSv1.2;

I opted to configure this in the main nginx.conf file, rather than each domain, as I saw now reason I would make individual changes on a domain basis.

I also enabled ssl_prefer_server_ciphers and ssl_session_cache:

ssl_prefer_server_ciphers on;
ssl_session_cache shared:SSL:10m;

And used this cipher suite which maintains maximum backwards compatibility. Although I’m using SNI which isn’t supported by IE6, I prefer my sites to be as backwards compatible as possible.


I also added these lines:

ssl_prefer_server_ciphers on;
 ssl_session_cache shared:SSL:10m;

I retested the site, and improved to an A rating:

Step 3: Deffie Hellman Ephemeral Parameters

Diffie-Hellman ensures that pre-master keys cannot be intercepted by Man In The Middle attacks, and it is easy to enable in Nginx.

First generate a stronger DHE parameter… be prepared to wait around 15 minutes for OpenSSL to generate this certificate:

cd /etc/ssl/certs
openssl dhparam -out dhparam.pem 4096

Then configure Nginx to use it:

ssl_dhparam /etc/ssl/certs/dhparam.pem;

On retesting, I achieved the A+ grade!

Step 4: Add a DNS CAA record

The Certification Authority Authorization (CAA) DNS record allows you to use your DNS records as a mechanism to whitelist certificate authorities that are allowed to issue certificates for their hostnames.

To implement this, I had to change from Amazon AWS Route 53, to Google Cloud DNS, as AWS shamefully doesn’t provide CAA report.

I use Let’s Encrypt, and added this DNS record:

0 issue ""

Currently this is optional, but it will be mandatory from September 2017.

Step 5: Add HTTP Strict Transport Security (HSTS) Header

A header can be sent from your server which will inform browsers to only make HTTPS requests. Browsers will no longer make HTTP requests until the header expires. This has two main benefits: a spoofed site without your SSL certificate will not be effective, and subsequent visits to your site will go straight to your HTTPS version without a redirect, making page loading faster.

Be sure to use a low expiry time while developing your site, as once a browser caches the header, it is not possible to clear it. Once you’ve sent this header, expect your site to be HTTPS in the long term, with no going back.

add_header Strict-Transport-Security "max-age=31536000; preload" always;

For development, use this shorter time:

add_header Strict-Transport-Security "max-age=360;" always;

There is a push to have browsers have a preloaded list of HTTPS/HSTS enabled sites, but the strict requirements for submission require several sub-domain redirects, which in my opinion would reduce overall performance. I don’t see the harm in still sending the ‘preload’ parameter.


Further reading:

Spatial Audio for VR with a Ricoh Theta S Camera and Zoom H2n Audio Recorder

I had a try adding spatial audio to a VR video. In theory this should add realism to a 360 VR video by adding audio that can be processed to play back differently depending on the direction of the viewer.

I updated the Zoom H2n to firmware version 2.00 as described here, and set it to record to uncompressed WAV at 48KHz, 16-bit.

I attached the audio recorder to my Ricoh Theta S camera. I orientated the camera so that the record button was facing toward me, and the Zoom H2n’s LCD display was facing away from me. I pressed record on the sound recorder and then the video camera. I then needed a sound and visual indicator to be able to synchronize the two together in post production, and clicking my fingers worked perfectly.

I installed the I created a new project in Adobe Premiere, and a new sequence with Audio Master set to Multichannel, and 4 adaptive channels. Next I imported the audio and video tracks, and cut them to synchronize to when I clicked my fingers together.

Exporting was slightly more involved. I exported two files, one for video and one for audio.

For the video export, I used the following settings:

  • Format: H264
  • Width: 2048 Height: 1024
  • Frame Rate: 30
  • Field Order: Progressive
  • Aspect; Square Pixels (1.0)
  • Profile: Main
  • Bitrate: CBR 40Mbps
  • Audio track disabled

For the audio export, I used the following settings:

  • Format: Waveform Audio
  • Audio codec: Uncompressed
  • Sample rate: 48000 Hz
  • Channels: 4 channel
  • Sample Size: 16 bit

I then used FFmpeg to combine the two files with the following command:

ffmpeg -i ambisonic_video.mp4 -i ambisonic_audio.wav -channel_layout 4.0 -c:v copy -c:a copy

And finally injected 360 metadata using the 360 Video Metadata app, making sure to tick both ‘My video is spherical (360)’ and ‘My video has spatial audio (ambiX ACN/SN3D format).

And finally uploaded it to YouTube. It took an extra five hours of waiting for the spatial audio track to be processed by YouTube. Both the web player and native Android and iOS apps appear to support spatial audio.

If you have your sound recorder orientated incorrectly, you can correct it using the plugins. In my case, I used the Z-axis rotation to effectively turn the recorder around.

There are a lot of fascinating optimizations and explanations of ambisonic and spatial audio processing available to read at Wikipedia:

The original in-camera audio (Ricoh Theta S records in mono) to compare can be viewed here:

Sony Noise Cancelling Headphones as Binaural Microphones

My Sony smartphone has an unusual TRRRS (Tip-Ring-Ring-Ring-Seal) connector, allowing it to use very reasonably priced noise cancelling headphones that have an extra microphone in each earphone.

I found that the Sony app Sound Recorder allows selecting recording directly from these two microphones, and are great for binaural recording, and I gave it a go walking along a few busy streets. You can listen on YouTube and Soundcloud: