The Apple Touch Icon Files and Joomla Performance

If you want to see something interesting, then do the following:

  • ssh to the server hosting your Joomla website.

  • Change to the domlogs folder.

  • Run the following grep on the main log file of your domain:

    grep 'MobileSafari' yourjoomlawebsitelogfile.txt > mobilesafari-log.txt

After doing the last step, you should have a mobilesafari-log.txt file in your current directory. Open it for editing and you will see something like the following:

[user-ip] - - [31/Apr/2018:10:16:46 -0400] "GET /apple-touch-icon-120x120-precomposed.png HTTP/1.1" 404 20 "-" "MobileSafari/602.1 CFNetwork/808.3 Darwin/16.3.0"
[user-ip] - - [31/Apr/2018:10:16:46 -0400] "GET /apple-touch-icon-120x120.png HTTP/1.1" 404 20 "-" "MobileSafari/602.1 CFNetwork/808.3 Darwin/16.3.0"
[user-ip] - - [31/Apr/2018:10:16:46 -0400] "GET /apple-touch-icon.png HTTP/1.1" 200 4581 "-" "MobileSafari/602.1 CFNetwork/808.3 Darwin/16.3.0"

Of course, the first question that would probably hit your mind is “what is that?” Well, that is what happens when a mobile Apple device accesses your website. It first sends a request with a weird user agent (MobileSafari) to check for “touch icons” – these “touch icons” are later used by the browser to create a shortcut of your website (users can then touch the shortcut to load your website). As you may have guessed, the image of the shortcut is the apple-touch-icon*.png image (the Apple device will choose one of the 3 images and will display it as a shortcut button). This is all fine and dandy, but there is one problem: your website doesn’t have any of these apple-touch-icon* buttons, so, this Apple “feature” ends up slowing down your Joomla website because of the resulting 404s – this is especially the case on high traffic Joomla sites. To give you an example, a high traffic Joomla website that we manage gets about 60K 404s/month just because of the Apple touch icons.

So, what can be done about this?

There are 4 things that you can do to address this issue:

  1. Redirect, at the global .htaccess level, any traffic with MobileSafari as its user agent to a png file of your choice (or to a simple HTML page). Note that the option to redirect to a specific png file is a bit tricky, since some Apple devices require different image sizes (e.g. 152×152 instead of 120×120). Also note that it is important that you don’t block the request (or the user agent), as blocking access to those images through an .htaccess rule may result in having the device’s IP automatically blocked!

  2. Create a condition in your defines.php to handle this situation. You can just display a simple 404 message (such as die(“Not Found”);) when MobileSafari is the user agent in order to prevent Joomla from continuing to process the request.

  3. Create the PNG images that Apple mobile devices want. In short, you will need to create the following images and place them in the root directory of your Joomla website (quick rant: it is just rude of Apple to expect those proprietary images to exist at the root level of the website by default):

    apple-touch-icon-120×120-precomposed.png
    apple-touch-icon-120×120.png
    apple-touch-icon-152×152-precomposed.png
    apple-touch-icon-152×152.png
    apple-touch-icon.png

  4. Do nothing. Yes – do nothing. This should be the case when your website has little traffic and you have an abundance of free resources on your server.

We hope that you found this short post useful and informative. Keep in mind that at itoctopus, we don’t offer design services (so we can’t create those Apple buttons for you), but what we can do is help you redirect traffic from the MobileSafari user agent in order to reduce pressure on your server. If you want us to do that for you, then just contact us. Please note that our super affordable fees apply.

No comments yet.

Leave a comment