Install Google mod_pagespeed for Apache HTTP

Website network performance is usually a very complicated process. Over the years, I’ve outlined many development techniques that can be used toward this goal. I’d heard about mod_pagespeed for some time, but never had the opportunity to experiment with it until recently. My first impression is that it is a VERY EASY means to gain performance improvements without reworking your existing website to implement techniques for establishing far-future expires, cache-busting, minification and static file merging.

Out of the box, most common techniques are automatically applied to your assets and a local server cache is created to utilize them.

Default installation is trivial:

  1. Download the latest version for your server architecture:

    wget https://dl-ssl.google.com/dl/linux/direct/mod-pagespeed-stable_current_amd64.deb

    OR

    wget https://dl-ssl.google.com/dl/linux/direct/mod-pagespeed-stable_current_i386.deb

  2. sudo dpkg -i mod-pagespeed-*.deb

  3. sudo apt-get -f install
    (if required)

  4. sudo service apache2 restart

NOTE: Using tools like Firebug will enable you to see an HTTP Header indicating the version being used for your requests.

If you need to modify configuration from the default:

sudo vi /etc/apache2/mods-available/pagespeed.conf

For VirtualDomains, you can selectively enable and disable PageSpeed and many of it’s settings in your appropriate configuration files with:

<IfModule pagespeed_module>
ModPagespeed on
</IfModule>

NOTE: Appending ?ModPagespeed=off to your URL will disable functions for that request.

REFERENCES:

HTML4 script defer

This HTML4 attribute was intended to defer/delay execution of specific javascript code until after the page is rendered. In theory, this makes the website “appear” faster as the functions relevant to the User-Interface can be executed before other “background” processes that would otherwise block the screen from displaying.


<script defer="defer" src="example.js"></script>

NOTE: Do not use defer for external scripts that might depend on each other if you need to support MSIE9 and earlier.

REFERENCES:

Load Testing web application with Selenium and TestNG

I’ve used Selenium for while to do verification tests of web applications, recently I discovered a very simple way to use it with TestNG and Maven to do some performance testing. TestNG allows for the use of annotations to allow multi-threading and iterations.

pom.xml:

<dependencies>
<dependency>
<groupId>org.testng</groupId>
<artifactId>testng</artifactId>
<version>6.8.7</version>
<scope>test</scope>
</dependency>
<dependency>
<groupId>org.seleniumhq.selenium</groupId>
<artifactId>selenium-java</artifactId>
<version>2.44.0</version>
<scope>test</scope>
</dependency>
<dependencies>

And as for a simple test to get started with… scripting of steps is available online or could be in a future blog post.

/*
* COPYRIGHT. none
*/
package com.example.selenium;

import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebDriverException;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.testng.Assert;
import org.testng.annotations.BeforeClass;
import org.testng.annotations.Test;
/**
* Simple test example for Selenium
*/
public class SeleniumTest {

private static final Logger LOGGER = LoggerFactory.getLogger(SeleniumTest.class);
/**
* TODO Un-comment or change if needed to set your local path!
*/
@BeforeClass
public void oneTimeSetUp() {
System.out.println(“————————————– init —————————————-“);
//System.setProperty(“webdriver.firefox.bin”,”C:\\path\\to\\firefox.exe”);
}
/**
* NOTE: uses TestNG – behaves differently than JUnit
*/
@Test(invocationCount = 1, threadPoolSize = 5)
public void testLoadApp() {

final String fn = “testLoadApp”;
final String baseUrl = “http://www.giantgeek.com/index.php”;
LOGGER.debug(“[START] Thread Id: {} is started!”, Thread.currentThread().getId());

WebDriver driver = null;
final long start = System.currentTimeMillis();
try{
driver = (WebDriver)new FirefoxDriver();
driver.get(baseUrl);

final String actual = driver.getTitle();
LOGGER.debug(“Page Title is {}”, actual);
final String expected = “GIANTGEEK.COM”;
Assert.assertEquals(actual,expected);
//perform whatever actions, like login, submit form or navigation


}catch(final WebDriverException ex){
LOGGER.warn(fn+":WebDriverException:{}",ex);
}catch(final Exception ex){
LOGGER.warn(fn+":Exception:{}",ex);
}
finally {
final long elapsed = System.currentTimeMillis() - start;
LOGGER.debug("[END] Thread Id: {}, elapsed={}", Thread.currentThread().getId(),elapsed);
if(driver != null){
driver.quit();
}
}
}
}

WARNING: Selenium Tests MAY fail if the browser used for testing is updated in the Operating System. Updating the pom.xml to a newer release usually helps!

REFERENCES:

Remove Landscape on Ubuntu

The Canonical/Ubuntu Landscape service has been around for as long as I can remember using Ubuntu. A free trial period is enabled (re-enabled?) when a new installation occurs, that allows for a server administrator to see performance metrics and uptime information for any hardware that is running the client. After the trial ends, it is still a quick means of visually observing some key statistics in the terminal MOTD at login. I’d also noticed that it was still doing DNS lookups to “landscape.canonical.com” on a regular basis, and while I did not look for it, I assume that some information was still being collected and reported upon.

As there are MANY other ways to get server performance information, I decided that it was time to be rid of landscape itself.

Removal is easy, as only one line is required… I chose to “purge” all references, though you can “remove” if you feel inclined to leave any configuration for possible later re-installation.


sudo apt-get purge landscape-client landscape-client-ui landscape-client-ui-install landscape-common

REFERENCES:

Install MySQL database on Ubuntu and add new user.

Installing MySQL on Ubuntu requires only a few simple steps.

  1. sudo apt-get install mysql-server
  2. sudo netstat -tap | grep mysql
  3. sudo vi /etc/mysql/my.cnf
  4. sudo service mysql restart

To look for some simple performance and security suggestions:

  1. sudo apt-get install mysqltuner
  2. mysqltuner

Adding a new user is equally easy…

  1. mysql --user=root --password=mypassword mysql
  2. CREATE USER 'myusername'@'%' IDENTIFIED BY 'mypassword';
    GRANT ALL PRIVILEGES ON *.* TO 'mydatabase'@'%' WITH GRANT OPTION;
    FLUSH PRIVILEGES;

NOTE: This allows access to the user from ALL hosts, it can be limited by replacing the '%' with a specific hostname (such as ‘localhost’ if desired) for security.

REFERENCES:

Improve Apache Tomcat logging performance

Logging is often an overlooked performance drain on systems requiring high throughput. Here’s a simple change to the default Tomcat logging configuration to implement. It works on all operating systems.

In the file:
$TOMCAT_HOME/conf/logging.properties

Change:
.handlers = 1catalina.org.apache.juli.FileHandler, java.util.logging.ConsoleHandler

to
.handlers = 1catalina.org.apache.juli.FileHandler

REFERENCES:

JavaScript “use strict”

ECMAScript 5 added Strict Mode to JavaScript. Many of you may have first seen mention of this if you’ve used JSLint. It helps to remember that JavaScript still behaves much like an interpreted vs. compiled language as each browser/parser makes assumptions to execute code faster in different manners.

There are four primary features/goals of strict mode:

  • Throws errors for some common coding issues, that are sometimes obscure but previously didn’t throw an error.
  • Prevents or throws errors for potentially “unsafe” actions (such as gaining access to the global object).
  • Disables functions that are confusing or poorly thought out
  • Potentially code in strict mode could run faster by eliminating mistakes that would make it difficult for JavaScript engines to perform optimizations

Initial support added in FireFox 4 and MSIE10:

WARNING: if you chose to do this at a ‘file’ level, be sure to never concatenate several files together that are not ALL strict.

JS File Example:
"use strict";
function testFunction(){
var testvar = 1;
return testvar;
}

// This causes a syntax error.
testvar = 2;

JS Function Example:
function testFunction(){
"use strict";
// This causes a syntax error.
testvar = 1;
return testvar;
}
testvar = 2;

REFERENCES:

Free website uptime monitoring

Regardless if you host your own websites, or pay to have them hosted elsewhere, up-time, availability and network performance metrics are important to your visiting guests.

Here are two free services that I’ve found useful for monitoring, notification and reporting.

BTW, you can even use these to watch competitors or sites that you frequent.

Browser performance impact of charset/codepage assignment

Most developers (myself included) are often unaware of the performance impact of the Content-Type / charset of a web page. Ideally you should set this as an HTTP Header vs. using META http-equiv. It’s often though that this only helps with the transport and display of data, however, the browser also makes use of it when parsing CSS & JS assets. Tags related to those provide an optional ‘charset‘ attribute should they ever need to vary from your content.

General guidance is to set this at the very top of the <head> before <title>; and within the first 1024 bytes, though there are reports that Firefox will look at the first 2048 bytes of the page for this META information.

Not doing so may cause the browser to do a codepage restart to re-parse assets that were interpreted in the potentially incorrect codepage.

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

REFERENCES:

Conditional Comments cause CSS to block

Here’s an odd one…. I’ve found that if you use the common method of using Conditional Comments to separate MSIE specific CSS, you’ve likely added a performance problem without knowing it… that is, in addition to the network connection and time required for the different CSS files.

It turns out that the standard use of this approach blocks the other downloads until the main CSS is loaded.

The solution is both simple and painless to implement…. a quick solution to this is to add an empty conditional comment early on, that is, before the main content (CSS) is loaded.. This works for all approaches, such as those where comments surround the <body> or various <link>, <style> or <script> tags.

UPDATE:
Personally, I like to do this immediately after the DOCTYPE and before the <html> tag. Additionally, since IE10 dropped support for this technique, I’ll just target IE 9 and below for any developer that comes after me.


<!DOCTYPE html>
<!--[if lte IE 9]><![endif]-->
<html lang="en">
...

REFERENCES: