web site optimization.

The last few days I became obsessed with optimizing jappler.com. It was loading slower and slower with what seemed to be every passing day. Since I had originally designed my web site for an earlier version of WordPress, I figured it was about time for a tune up. I went to the ever-so-helpful codex, to help me figure out what was going on. I went through a number of different steps to troubleshoot the problem and I thought the steps I took might be helpful to others.

  • Is it my host or my site? At first I thought it was a slow host. I had friends from around the country access my web site, and confirm the problem existed for everyone. From all the feedback, I confirmed something was going on. Now it was time to take it to the next step. Was my host slow or was my web site slow? To check this, I grabbed a recent backup and restored it to my desktop to check it out. Once I had everything in place, I hit my web site and it still seemed slow, so I asked Ken to give it a try. He confirmed it was still slow. It was not the host that was slow.
  • Is it my template/XHTML/CSS/graphics that is slow?
    Now it was time to revalidate my XHTML and CSS via W3C. I caught a few errors, but nothing major. I also took a look at my graphics’ sizes…nothing too hideous. I even had a few graphics (Get FireFox, etc) that were being pulled from a remote location…I put an end to that. I then reconfirmed that the site was still slow so I decided to turn to my favorite part about FireFox the Web Developer extension. Under the tools menu, I viewed my site’s speed report via http://www.websiteoptimization.com. I was able to look at everything that was loading from my site, make sure CSS decisions (break up my CSS into a few different files, and then do some minor changes to reduce my HTTP requests from 63 to 36. How? This is where I started getting into some database optimization.
  • MySQL issues? Since everything is page is created dynamically, it was time to shift the focus on the database.
    • Table optimization.
    • I first read about the option to optimize tables, so I logged into phpMyAdmin and optimized all my WordPress tables. I once again did some more performance testing on my site and yet again, no luck…it was still slow. Time for my next hypothesis.

    • Slow queries. I found out that MySQL has the ability to log slow queries by adding log-slow-queries=/var/log/mysql/mysql-slow.log and then defining the slow query variable set-variable = long_query_time=2 in the /etc/my.conf file. (This is not created by default.) Once you have made changes to the my.conf file, you will need to stop/start MySQL. Now to look at the slow queries…simply tail -f your log. (for me: tail -f /var/log/mysql/slow-queries.log) Once again, with some testing (browsing) of my web site, I did not find any queries that stood out.
  • Back to the jappler template: One div at a time. Back to the codex I went searching for tips, examples, etc. What else could be the problem? Time to go through what I know.
    • I have ruled out a slow host.
    • My XHTML and CSS validate (or have only a minor issue with one of my IE tricks, but when I use the default WP theme my pages load fine.
    • I have stripped out the right hand column and the footer to localize the problem to the main part of the page so those parts of the pages are fine.
    • I have disabled and then re-enabled all the WP plugins one at a time (and deleted a number of them)
    • I have optimized my MySQL tables. I have looked at slow queries coming from my theme.

    At this point I did not see too many options other than recreating my templates over one div at a time. Div by div I recreated and tested my web site. (header loads ok…time to add the menu….menu loads ok with header…time to add content. Eventually through enough testing (and some wild plugins) I tracked down the problem…more like problems and started testing multiple templates.

  • What’s left as of today? I still need to work on my index.php to make it load a little quicker. Something is still not happy there. I also need to figure out what is not happy with the news page. Other than that…even though it was a stressful few weeks, I can walk away happy because I learned a lot.
  • Summary.

  • When issues arise, try to pinpoint the problem as much as possible by asking yourself questions.
  • Validate your HTML/XHTML/CSS. Clean code is a good thing.
  • If you are using themes/templates, try a default template.
  • Make use of the Web Developer extension for FireFox.
  • Take a look at your site’s speed report via http://www.websiteoptimization.com.
  • Back up often!! (I just had to slip this in)
  • Be on the lookout for rogue plugins and watch your queries.
  • Don’t give up!

[tags]optimization[/tags]

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>