While the essence of performance monitoring may be catching issues as they happen and fixing them before your users are impacted, preempting those issues altogether is the ultimate goal of any sound performance strategy. Optimizing the objects that are on your site is a tried-and-true method of maintaining exceptional performance and providing great user experiences.

We’ve talked about object optimization in the past, yet after witnessing all of 2015’s holiday shopping carnage, it feels like an appropriate time for a quick refresher course.

Images

Sure, everyone loves to punch in a URL and be greeted by a homepage adorned with beautiful high-resolution images; but the truth is, that while these images are aesthetically appealing, they carry a lot of weight. An average of 64% of a webpage’s data can be attributed to images, which can create significant performance issues.

Though you’ll probably have to compromise quality for user experience, there are ways to combat these issues. For example using CSS sprites, applying lossy and lossless optimization, removing unnecessary metadata from images, choosing optimal image formats, lowering the quality of images where possible, using individual image compression tools, and scaling images to fit the size of the screen where they are displayed can all help to prevent problems that would interrupt your users’ experiences.

HTTP Requests

The major elements of a webpage require additional HTTP requests to be sent the web server, which can cause latency. Requests for images, scripts, and CSS files are unnecessary when you’re able to combine several files into a single request. Combining many scripts into just one script, reducing multiple stylesheets down to one stylesheet, etc. are all easy ways to optimize your HTTP requests and increase pagespeed.

Asynchronous Loading

This is really a best practice for overall web performance. Deferring the loading and execution of JavaScript can reduce the initial download size and rev up the rendering time of your page. Asynchronous loading can also prevent the element from being a Single Point of Failure.

Text-based Content Compression

Use GZip compression on all text-based content (HTML, XML, JavaScript, CSS etc.). But be sure to not GZip files that are binary or already compressed, like images.

Minification

Minify JavaScript and CSS and only serve JavaScript and CSS that is relevant to the requesting platform. Serving up CSS, Images, and JavaScript that are designed for desktop to mobile users will greatly increase the load time.

To learn more about how to optimize your objects, sign up for our upcoming OpsCast Classroom: Website Testing & Optimization Course starting on February 10.

OpsCast Classroom