Page Loading Improvement Case Study - PHP

After analyzing the performance of the test website, http://www.php-developer.org , the following are the results: 

The red exclamation marks are serious problems. For the purpose of illustration, we will only tackle the most pressing problems/actions, which are enabling Gzip compression, and some JavaScript optimization tips like optimizing the order of styles and scripts.  

Enabling Gzip Compression. This works by compressing the output to the browser instead of sending the uncompressed file, which is heavy. See the illustration below:

If it is compressed, it will be retrieved very easily by the browser -- in short, the page loading time should improve. 

There are different ways to implement GZIP compression. It can be done either in .htaccess or PHP. For simplicity, we will implement GZIP compression using PHP to make the process easy to understand. 

There are basically three types of files that you need to compress for efficiency. These are HTML-related files, JavaScript files and CSS files. For illustration purposes, we will be using WordPress, since it accounts for the majority of the CMSs used; however, the principle discussed can be applied to any platform. To compress HTML, follow the steps below.  

Step 1: Log in to your WordPress FTP root directory and download index.php file (located at the WordPress root directory). 

Step 2: Using your favorite PHP editor, open the file and copy à paste the code below to the top most part of the script:

if (substr_count($_SERVER['HTTP_ACCEPT_ENCODING'], 'gzip')) {

ob_start("ob_gzhandler");

}

else {

ob_start();

}

So that the new index.php will now be:

<?php

if (substr_count($_SERVER['HTTP_ACCEPT_ENCODING'], 'gzip')) {

ob_start("ob_gzhandler");

}

else {

ob_start();

}

/**

 * Front to the WordPress application. This file doesn't do anything, but loads

 * wp-blog-header.php which does and tells WordPress to load the theme.

 *

 * @package WordPress

 */

/**

 * Tells WordPress to load the WordPress theme and output it.

 *

 * @var bool

 */

define('WP_USE_THEMES', true);

/** Loads the WordPress Environment and Template */

require('./wp-blog-header.php');

?>

This code loads the call back function ob_start to facilitate sending gz-encoded data using PHP and compresses the content before sending it to the browser, which accepts gzip-encoded data. Save and upload it to the WordPress root directory. You can use this tool to make sure your compression is working.