Haven’t you noticed that just about everyone’s website is always too slow when you are browsing it? It seems like a universal truth. Nevertheless, if you spend some time with Dave Methvin, you can learn a lot about how to speed things up. Methvin is an old friend: we worked together back in the 1980s at PC Week (which is now called eWeek), since then he has built a few technical businesses and now is the president of the jQuery Foundation, the central repository and authoritative source for code for that particular language that is used in many websites. His recent speech about “The Web Doesn’t Have to Be Slow” at PraireCon can be found here on Slideshare.
Part of understanding how to speed up your site is in understanding how the browser and various Web servers work together to present a page to you. “A lot of times when people are doing performance testing, they start at the wrong end of the problem,” he told me in an interview. “They are measuring how fast it takes to do lots of loops, but they aren’t looking for bottlenecks in their code.” This is a common theme in performance testing. “We were doing this 25 years ago at PC Week when we were measuring network latencies, and people still fall into the same traps today,” he said. Think of this as asking the question of whether you want to run or walk to get to your car before you go on a long road trip. “It really doesn’t matter in the long run, because ultimately you are going to be in your car and driving for a lot longer than the amount of time you might save getting to it in front of your house.”
Avoid 3xx requests. These penalize your pages because you introduce another round-trip to the time it takes you to load the referral page. While sometimes this can’t be avoided, you should do what you can to keep these referrals to a minimum. “The round trip times across the Internet can kill you and can degrade your performance,” he says.
Start requests early on your pages. Put requests for external resources such as images at the top of your page whenever possible, so this will be the first bits delivered to your browsers. This will also help with prefetching images for subsequent loads too, which should also be part of your HTML coding.
Maximize browser caching. Make sure your caching defaults are set up properly so that stable content (like your corporate logos or other frequently-used and infrequently-changed items) are specified accurately in your pages. This helps to take maximum advantage of browser caching. The less you have to reload, the faster your pages will appear.
Use domain sharding. If you find yourself loading a bunch of resources from a single domain you can take advantage of this technique. The idea is to spread requests across several domains at once to maximize bandwidth, since you are downloading elements in parallel rather than in series. This is a technique that many of the top trafficked websites use to boost their performance. Another way to do this is to use a content distribution network to help. One example is to use external jQuery libraries that are already pre-cached by your browser. Here is a great discussion of why you should do this, along with code snippets of how to use Google’s content delivery network for free. Because of different versions of jQuery, you can spend a lot of unnecessary browser time in loading these versions from your own site. This is just one or two lines of code and it can have a big impact on your page load times. Along those lines, here is a sample plug-in to help speed up your WordPress site too.
Load non-critical stuff later. You should code your pages to wait near the end to load things that aren’t critical to viewing the page, such as content not initially visible, social media scripting tools, ads, and page analytics.
“This is a big topic, just like fixing cars – the more you do it, the more you understand the depth and dimensions of your problems,” he said. “But at least following some of my suggestions you can be sure that the resources you put into your browsers are in the best order and optimized for the best possible viewing.”