Performance Optimization & Page Speed Analysis In my first post I introduced our LoadStorm team’s website optimization project. We discussed the planning, initial testing, and benchmarking stages, as well as some of the potential modifications that are commonly recommended for optimization of websites and WordPress sites in particular. This post will discuss the modifications our team decided to perform on our site, look at the post-optimization tests and how they compare to our benchmarks, and explain the project results. Lastly I would like to highlight the gains in performance the site has achieved and offer suggestions for your own website […]
LoadStorm Website Performance Optimization Project Part 1: Planning, Benchmarking, & Brainstorming I had just started working at LoadStorm when I was contacted by Jessica, an associate from Yottaa.com, which is a company that specializes in web optimization products and services. She asked what I did here and mentioned that our website pricing page was loading slowly, wondering if she could be put in contact with our webmaster. Embarrassed, I explained how I had only just started working as a performance engineering intern here at LoadStorm, thanked her for letting me know about the problem, and then promptly began investigating what […]
We’ve talked before about JPEGs and how well their compression algorithm works on photographs. Today though, I learned something rather interesting: I learned about a technique for using zero quality JPEGs. When saving a JPEG image, you’re usually given the option to set the “quality” of the compression. The higher the quality, the better the image looks. The lower the quality, the more pixelated the image looks, but the higher the compression. (As an example, when saving a large image on my drive, the “Maximum – 12” quality setting made a 1.83MB file, while the 0 quality file was 132KB. […]
In Part 1 and Part 2 of this series on image optimization, we discussed ways to optimize raster graphics to get image sizes as small as possible. In this part, we’ll discuss the ways HTML can render its own vector graphics and composite images client-side, making websites load and run faster. There are two ways of going about this: SVG and HTML5’s Canvas element. For most common uses SVG is the faster of the two, but just as with raster image formats these two approaches have their strengths and weaknesses when it comes to performance. Why use vector images? “Raster” […]
In our previous post about image optimization, we talked about the pros and cons of the three major image formats found on the web and when each format should be used to give you the smallest file size with the most acceptable quality. The goal is to improve the performance of our web pages, so optimizing the quality/size ratio will result in better speed by reducing throughput. Today, we’ll be going over some more general tips about things you can do to make your images smaller and easier to download while still retaining an appropriate amount of quality. Dimensions This […]
Almost all websites today have images. Photographs, logos, icons, backgrounds, web pages are now saturated with graphical content. And while this can allow for some incredibly beautiful (and also some downright ugly) websites, the more images a page has to load, the more server calls an HTML script needs to make. Meaning slower load times and frustrated users. This series will focus on things you can do to tweak your images and make them load faster, and that starts with choosing the right file format. JPEG, GIF, and PNG are the three most commonly used formats on the web. Each […]
While we’ve touched upon client side caching in our series on Web performance, we haven’t discussed how client caching has grown more rich and useful over the years. In the initial days of the Web and the HTTP/1.0 protocol, caching was mostly limited to a handful of headers, including Expires, If-Modified-Since, and Pragma: no-cache. Since then, client caching has evolved to embrace greater granularity. Some new technologies even permit the deployment of offline-aware, browser-based applications. Browser Request Caching The most common and oldest type of client-side caching on the client is browser request caching. Built into the HTTP protocol […]
In our past installments on Web performance optimization, we’ve seen how caching, server configuration, and the use of Content Delivery Networks (CDNs) can increase a Web site’s responsiveness and improve Web performance metrics. Most of the techniques we’ve reviewed have focused on configuring the Web server or optimizing server applications. Unfortunately, a Web page that downloads quickly but is slow to parse or execute on the client will appear just as slow to a user as if the Web server were on its last megabyte of memory. In this article, we’ll discuss some ways that Web page content can be […]
So far in our series on Web Performance Optimization, we’ve focused on how to reduce the number of requests between client and server through caching, and how to make requests more efficient by managing server resources. Another strategy in Web optimization is intelligent distribution of resources across the Internet, which can greatly reduce request latency by locating redundant copies of Web content on multiple servers spread across the Internet. In this installment of our series, we focus on content delivery networks (CDN), a technology that increases throughput by bringing content closer to the people requesting it. What is a […]
In recent years, the good folks at WordPress have made it easier to use their free software not just as a blog, but as the hub of a rich content management system (CMS), complete with static content and custom data types. Given that, it’s no surprise that Webmasters and businesses around the world are increasingly basing entire sites around the platform. (And did we mention the “free” thing?) While WordPress runs decently out of the box, site operators who employ a few tweaks and follow a few rules of thumb will achieve much better performance in the long run. In […]