Decoupled Drupal | 32% boost in speed by 2 lines code in Node.js

This headless Drupal website was launched a few months ago. When I checked Google's Page Speed I was shocked: a score of 57 out of 100, not good! Speed is one of the most important parts of a website, when a website is slow:

• Visitors will quickly leave;
• Google will give your website a bad rating resulting in bad SEO results;
• You will get a bad Ad rank within Adwords; this will cost you a great deal of money.

Since we are now running our frontend on Node.js / Express JS I thought: that Page Speed will hit the ceiling. But the opposite was true, check the rating after going live in the below figure: a very disappointing red rating. Caused by not using 'gzip compression'.

GZIP compression? Uhm…. what? Why?

Read here about gzip compression.

A visual explanation:

Source

Compression in a standard Drupal installation

When using a standard Drupal installation (not headless/decoupled), then it is easy to enable this compression.

1. Go to /admin/config/development/performance
2. Check ‘Cache pages for anonymous users’
3. Check ‘Compress cached pages.’

Note: If you are using this Drupal compression, do not enable it on web server level (Apache mod_gzip).

Logged in or logged out?

This is sufficient if you have a Drupal website with mostly not logged in (anonymous) visitors. Caching is a different story (and a specialty) when you are dealing with a drupal website where many people are logging in, as with any Drupal social intranet, webshop or online community. More info on caching in Drupal 8. Also refer to A Beginner's Guide to Caching Data in Drupal 7.

Compression in headless Drupal with Node.js frontend

As indicated, we are using Drupal headless (decoupled). Therefore the standard compression of Drupal is not working. So we searched for a way of gzip compression for Node.js. We found it here.
Installation

1. Install this popular NPM module with the following command in your terminal: npm install compression
2. Add the following code in your ‘main app file’:

That’s all :-). Quickly add, commit, push and then pull to the live server et voila:

Still not 100% optimal, but we are getting there!

You can also do an additional test on gziptest.com:

Wrap up

Alrighty, that’s all folks. Questions or feedback, let me know!