How to Optimize Your Website’s Speed [Updated for 2022]

Regardless of industry or platform, every company needs its website to deliver an excellent user experience by loading fast, preferably under 2 seconds. A website that pleases new or returning customers will probably perform better than one that doesn’t. As user behavior online continues to evolve, you can’t afford to ignore the importance of website speed.

The page speed is much more important than you could think. It will heavily affect the user experience, productivity, conversion rates, and, eventually, your sales revenue.

Today’s Buyers Are Impatient

When you visit a website that takes forever to load, what are your feelings about it? If you’re like most people, you almost unquestionably experience an emotion associated with anger or frustration.

And when you’re on an internet site that would make you angry and frustrated, does one usually stay on that website? Probably not.

Instead, you’d go to another website, right?

The people who are researching your products and services online right now are no different. They don’t have the patience to take a seat around expecting a slow website to keep loading and loading. They need everything immediately. The longer you make them wait, the more interest they lose in you.

In a 2012 study by Google, most smartphone users were willing to attend up to five seconds for an internet site to load before moving on to a different website. Do you think people are more or less patient today than they were back in 2012?

Website Load Speed Affects Your SEO

Google started using site speed as a ranking signal in their algorithm way back in 2010, and it continues to function as one among the various factors that determine where your website shows up in the search results.

Site speed reflects how quickly an internet site responds to web requests.

Speeding up websites is vital — not just to website owners but also to all Internet users. Faster sites create happy users, and we’ve seen in our internal studies that when a site responds slowly, visitors spend less time there.

Google knows that sending people to slow loading websites can wreak havoc on the user experience, so it comes as no surprise that the search giant still places value on site speed.

A fast loading website can help improve your SEO.

How to make the website faster?

There are a lot of factors that affect page speed. At first, we will list those out and then provide practical steps on how to improve.

• Minimize HTTP requests
  • To identify the number of HTTP requests, we can use the google chrome dev tools.
• Minify and combine files
  • The best place to get started is with your HTML, CSS, and JavaScript files. These are critical files, as they determine your site’s appearance. They also add to the number of requests your site makes every time a user visits it. You can reduce this number by “minifying” and combining your files or decreasing each file’s size and the total number of files.
• Use asynchronous loading for CSS and JavaScript files.
  • If your scripts load synchronously, they load one at a time, in the order, they appear on the page. If your scripts load asynchronously, on the other hand, some of them will load simultaneously. Loading files asynchronously can speed up your pages because when a browser loads a page, it moves from top to bottom. If it gets to a CSS or JavaScript file that is not asynchronous, it will stop loading until it has fully loaded that particular file. If that same file were asynchronous, the browser could continue loading other elements on the page simultaneously.
• Minimize time to first byte
  • Unlike many of the frontend performance factors most site owners focus on, this is a server-side concern. Network issues, dynamic content creation, web server configuration, and traffic are the essential factors that cause Slow TTFB. You can reduce the time that this takes by enabling caching.
• Enable compression
  • The smaller your files, the faster your pages will load. Compressing files is one of the easiest ways to reduce load times, and today, enabling compression with Gzip is considered standard practice.
• Reduce image sizes
  • Images can play a significant role in your site speed. They’re often huge files, which can slow down page load times. But removing them altogether is not an option.

Above, we listed the theoretical steps we need to take to make the page faster. But the challenge here is how to get there. There are many steps we need to take to improve page speed.

To start with, you need to analyze the website and identify the most significant problems you have. For this, you need to use the best tools on the web:

• GT Metrics
• Google Page Insights
• Web Page Test

These three websites do great work on scanning the page, listing the issues, and, most importantly, order those by their impact. The more significant effect has, the higher it will be listed. This way, we will target the most prominent issues one by one. For example:

Secondly, list all your custom features and integrations on the website. After that, disable all of them and make a speed test of the page. Then, enable the features and integrations one by one, and run a speed test for each. This way, you will better understand how much each affects the page speed. After these two steps, it’s time to “get into the business.”

Custom Modules

Next comes the most challenging decision. You are getting rid of inefficient code or integrations. What you need to do here is to analyze what you would gain in speed(and sales) and what you lose by removing the module/integration.

Moreover, think of possible replacements or changes in how the code was implemented. Having tried many approaches before, we would strongly suggest here to get rid of all the custom modules/extensions and start building everything from scratch. Even though this may sound hard and time-consuming, it has proven to be the best approach. 

Doing this has many advantages:

• You have full control over what you are building.
• The new module/extension will be developed and maintained according to the latest coding standards. We often see modules/extensions built poorly and harmful for the page speed. Instead of improving these modules, we suggest making everything on your own so that you can be independent.
• It is more upgradeable. If something changes in the future, having built it yourself, you know what/where to change.

Moreover, during the development, do tests to ensure your code is well optimized.

Images

One of the essential elements in today’s websites is images. However, at the same time, if not added correctly, those can be one of the most harmful components for page speed. For example, as we can see on this screenshot: https://share.getcloudapp.com/Wnur90Gr, this page’s most significant issue is the images.

There are two main issues with images:

• Image resize
• Image size

For the image resize, the easiest solution is to control the image sizes in the code. For example, in WordPress, you can use the thumbnail size and add the dimensions that you need the images to show on the frontend. 

About the image size(in KB or MB), there are two actions we can do. 

The first thing is to use a compressing tool, such as Image Optim or Image Compress. The other thing is to use a CDN and to optimize the images through the CDN.

JavaScript/CSS merge and minification.

Javascript and CSS merge and minification are essential features you must ensure you have enabled on the production website. These are a MUST to have because the files would get smaller, and most importantly, by merging those, we will have a much smaller number of network requests. 

In WordPress, we can use many plugins for this, but the one we recommend is WP Rocket, whereas, on Magento, we can run a command like this: here.

CDN

A CDN is essential as many optimized servers worldwide deliver web content to users based on their geographic location. It indicates significant performance improvements for site users. Take into consideration this scenario:

You have a person accessing the website from Argentina. If you host your website in Germany, it will take a lot of time to complete Argentina’s request to Germany. However, if you use CDN, instead of requesting Germany’s website, it will go on a nearby server to get the website. Therefore, the website will load faster.

In CDN, you can save CSS/JS files, images, videos, etc.

Two of the most popular CDN we tend to use are:

1. Cloudflare
2. Amazon CloudFront

More Technical Improvements

• All of the frameworks or CMSs have their default modules and functionalities. Review these carefully and remove the not needed ones. For example, on WordPress, remove all not-used themes or plugins.
• Fix broken links and site errors. Broken links usually happen when permalinks are changed or when content migrates to a different domain. You’ll be able to fix this by including a 301 redirect to the link’s new destination. It’s smart to make a crawl test of the website before publishing your website. We can do this through the Google Webmasters tool or another third-party site. It will be a comparatively easy fix and makes a world of difference for your SEO.
• Use lazy loading. Make sure to use it not just for images but for iframes as well. 

Following the above suggestions led us to significant speed improvements in one of our clients. 

Before:

After:

To sum up, page speed importance is revolutionizing the whole web development industry. Previously, we would do the project development, and in the end, we would try to make possible performance improvements. Today, you need to plan each web development project with performance in mind.