17 Ways to Increase Website Performance

Share

Alex Corral

Aug 5, 2019

Type:

MVP
category folder

Category:

Website

If we want our SEO and marketing efforts to shine, we need the right infrastructure, so the customers stick instead of bouncing. After all, 79% of customers can't stand sites with poor performance

For most businesses, the main thing we have to do is increase website performance. 

In this article, we'll demonstrate 17 ways to do just that.

Let's dive in!

#1 Way to Increase Website Performance: Go Mobile-First

Most people are searching from their mobile devices nowadays, so it's no surprise that Google's going to be using mobile-first indexing from now on. 

The first thing we have to do to increase website performance for mobile is run it through Google's Mobile-Friendly Test and fix any mistakes that occur. This is, so both Google's bots and our customers are pleased with our website performance.

#2: Keep the Design Simple

There's nothing like a website chock full of features to increase our page load time. And since the average amount of time customers are ready to wait is 4 seconds, too many features can make that 10, 15, or even as much as 30 seconds.

The leading cause is a website with too many things going on.

Additionally, intricate web design can make it hard for users to find what they need, increasing our bounce rates.

The solution: keep it simple. Remove all the unnecessary widgets and features, and make sure that the site is easy to navigate. Make user experience (UX) a priority.

#3: Compress Images and Files

High-resolution images are beautiful to look at, but they're often more substantial than 5 MBs, meaning that pages take too long to load. This is why we need optimization for images. 

Some platforms, like WordPress, have automatic image compression. If we're using different platforms, we can use a tool like Squoosh that reduces the size of each image file while retaining quality. 

As for PDF and .doc files, we can use tools like WeCompress to keep our file sizes in check and make sure our websites aren't bloated.

#4: Minimize HTTP Requests

Whenever a browser accesses our website, it has to download the separate elements (files, images, etc.). Each one is downloaded separately through an HTTP request, and this takes too much time if we have multiple parts.

Now, we can't strip our sites bare, but we can reduce the number of HTTP requests a browser has to make.

The first thing to do is (if we use Google Chrome) to check the number of requests. From Google Developer Tools, we right-click on the web page we want to inspect and select the "Network" tab. You might need to reload the page once you have the Network Tab open.

The next step is combining multiple files into one.

On platforms like WordPress, there are plugins like WP Rocket, which do that for us. 

After, we can choose asynchronous loading for our JavaScript and CSS files. Again, all of this is possible from WP Rocket. 

Additionally, we can combine the images we often use into one sprite sheet.

CSS Sprites allow browsers to retrieve the images we can use multiple times instead of calling up many different images at the same time. Everything's neatly compressed and stored in labeled boxes for later retrieval.

#5: Enable Browser Caching

If people are visiting our site more than once, we should have caching enabled. If we have caching enabled, their browsers don't have to download all the information again. 

Instead, if caching is enabled, the information they've downloaded during their first visit is stored and displayed much faster when they revisit our site.

This also minimizes the amount of HTTP requests browsers send, so we're killing two birds with one stone.

#6: Minify HTML and CSS Scripts

Different HTML, JavaScript, and CSS elements on our pages might make them look nice. They don't, however, help browsers load our pages.

Too many different elements and characters like line breaks and spaces can impair page loading. 

Without getting too much into code, we can use a tool such as JavaScript Minifier to minimize the different files and improve our page speed. 

#7: Use Content Delivery Networks

Every web server we use to host our site is located somewhere. It could be in the US, in the UK, and so on. This means that our website resides where it's closest to the people we're trying to reach. 

However, some hosting providers let us choose, while others don't. This means that it might take longer for people in different countries. The browsers of people outside of the countries where our servers are hosted could take significantly longer.  

This can be a speed killer. What we can do is use content delivery networks such as Cloudflare to host additional copies of our site all over the world to increase website performance.  

#8: Improve Time to First Byte

Time to first byte (also called TTFB) defines how long the browser has to wait before it gets its first byte of data from our sites. 

Now, in this case, we can't compress images, since this is primarily a thing based on the servers we have. 

Again, we can check TTFB for page loading in Chrome Developer Tools (section: Network -> column: Waterfall). Just hover over the asset in the column to see TTFB.

The best TTFB is 200ms or under, but if it's longer for us, we can increase website performance by:

  • Converting dynamic content files to static, so they don't have to be retrieved separately (caching helps with this one)
  • Checking the DNS lookup speed (you can also find this by hovering over the asset in the waterfall column) and if it's too slow, switching to a different DNS provider

#9: Choosing a Better Hosting Option

Typically, there are three hosting options we have at our disposal with most hosting providers:

  • Shared hosting
  • Dedicated server
  • VPS hosting

Shared hosting is the cheapest because we're sharing our server space (including RAM and CPU) with other clients. 

VPS gives us separate portions of the server to use, which makes it a better option. 

Of course, the best option is getting a dedicated server as it ultimately belongs to our site, so we're not "fighting for space."

In turn, this significantly improves our page loading speed and allows us to increase website performance. 

#10: Don't Use Frameworks and Libraries Too Often

There's no need to reach for sophisticated tools like jQuery for simple web development. 

If our websites aren't complex like those of large social networks, then we can keep it simple and code the elements we need ourselves.

Otherwise, we're bloating our websites. Thus increasing our loading time by using the development elements (like the ones we get from frameworks and libraries) that are better suited for some other sites.

#11: Fix Your Broken Links

Broken links reduce website speed.

Our first step should be checking which links on our sites are broken. This can be done with tools such as Google Search Console in the "Coverage" section, or SEMRush. I prefer to use Screaming Frog, but either of these tools will work.

And when we know which links are problematic, we can remove and fix them. It's best to rerun the scan, just so we're sure there are no more broken links. I like to run a weekly check and update it as necessary.

#12: Throw Out Everything You Don't Need (Wordpress)

Some plugins and widgets seem handy to have if you are on Wordpress. The same goes for JavaScript elements and images.

However, if they're not being used, they don't have to be on our sites because they can – and will ruin the way our website loads. 

The checklist to go through to increase website performance is:

  1. Deactivate and remove all the plugins we're not using
  2. Remove unnecessary elements
  3. Turn off pingbacks and trackbacks in WordPress
  4. Clean up our database with WP-Optimize for WordPress

#13: Use Google PageSpeed

The Google PageSpeed module is a great one to use because it automatically optimizes the number of resources that are used and how they're used.

And since it knows the recent updates on page speed best practices, it automatically applies them to our websites and elements like CSS, JavaScript, and images. 

The best part? We don't have to do anything but add the module to our server. 

#14: Compress Your Site

In addition to compressing our images and files, we can also reduce everything else with Gzip

This tool will reduce the size of elements like CSS, HTML, and JavaScript if they're bigger than 150bytes. 

#15: The Difference between Above-the-Fold and Below-the-Fold Content

Some files and components are just more important than others. 

The styles that should be the first to load should be placed inside the "head" section of our site's HTML document. 

Conversely, the data that shouldn't be downloaded first can be placed in the closing "body" tag. Typically, this is where we place JavaScript files that take a long time to load. 

Otherwise, if we prioritize the JS files, the complete website won't be displayed until they're loaded. 

If they take a long time, this means our visitors are waiting a lot of time to see the most critical elements. This happens because the JS files weren't done downloading.

#16: Host Large Files on Third-Party Platforms

Uploading huge files like videos directly to our sites don't just ruin page loading time. It can also be against the rules of hosting usage. 

The solution is uploading our videos to other platforms (YouTube, Vimeo) first, and then embedding them into pages.

This both saves space and reduces loading time. 

#17: Be Lazy about Loading

Which is to say: use Lazy Load.

Don't let visitors wait for a long time until every image and file is loaded for the page to be displayed! Get the Lazy Load plugin (or enable the option, if available on the platforms you use.

This means that images won't be loaded until the visitor has reached the part where they're indispensable for their user experience.

This is especially useful with long-form content like blog posts and brochures that contain multiple images. Loading all of them at once before displaying the page in the first place takes a long time.

And with Lazy Load, nothing's loaded until the viewer needs to see it.

Ready to Grow Your Business?