Whether working on projects with a fast change cycle or something that has not been changed recently – it is always a good idea to step back and review your code from time to time. Generally most people put it off for when “things slow down” or do not do it because “if it works don’t fix it” mentality.
When working with something like PHP, CSS, etc – you develop the best you can at the time you develop the code. If you simply leave everything as is – you risk incompatibility/security issues, etc because nothing is constant (browsers, PHP versions, etc). While it might not seem like the best way to spend your time at first – it will definitely help you down the road and at the very least make you realize how much you have learned since you initially wrote the code.
After working with a number of open source projects (WordPress, Drupal, XOOPS, etc) – I realized while that ignoring code cleanup is not an option and am going to from now on delegate September as my code cleanup month in which I will designate 2 days a week to spend exclusively on reviewing code and looking for ways to optimize it, get rid of any depreciated functions/etc. There are projects where code reviews happen more frequently – but for those that do not have reviews built in – this will be the catch all month.
Everyone writes code they are not proud of from time to time – the difference is there are some people who just let it slide vs. others that take the extra step to fix it. Time to review the jappler.com site 😉
Looking to really increase the load time of your site and minimizing the HTTP requests? Check out Minify. This handy app will easily and quickly compress your CSS (and Javascipt) files.
After working on clients’ web sites all day long, I often realize that this web site could benefit from things I learn while working on other projects. In the past few months I have put together some pretty amazing web sites that really bend WordPress so that the users can do just about any update to any text via the WordPress admin. I also have put together some other pretty advanced sites which rely heavily on template logic and really neat CSS. I had a few moments last night to update this site (cleaned up a lot of the templates, changed the home page, re-arranged the page content for the main pages, put in an archives section, and started thinking about how I could improve this web site to make it more useful for others. If you have any ideas – please let me know! For now – enjoy the changes, and optimized code.
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.
- Slow queries. I found out that MySQL has the ability to log slow queries by adding
log-slow-queries=/var/log/mysql/mysql-slow.logand then defining the slow query variable
set-variable = long_query_time=2in 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.
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.
- 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.
- 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!
Well, it has been awhile since I have done any maintenance on jappler.com and over the last few weeks, I have noticed a bit of a slow down when the pages load. I took some time today to look at the php code, style sheets, templates, etc and have at least tracked down the problem…somewhat. My site flies with other WordPress templates, but there is something about mine that WordPress does not like. I had originally designed my template for an earlier version of WordPress and I guess it is time I update it. Please bare with my site slowness for a little while longer. My stylesheets and HTML all validate, now I just need to figure out what in my WP code is slowing everything down.