Over a million developers have joined DZone.
{{announcement.body}}
{{announcement.title}}

20 Ways to Skyrocket the Speed of Your Website

DZone's Guide to

20 Ways to Skyrocket the Speed of Your Website

From making use of Content Delivery Networks to deleting plugins you no longer use, there are tons of way to speed up the performance of your website.

· Performance Zone
Free Resource

In the last article, we looked at some statistics regarding website performance and why having a fast website is important. Today, let's look at some ways that you can speed up your website. 

1. Select a Performance-Driven Website Host

Hosting is a foundation of any website. As Gordon B. Hinckley said: "You can't build a great building on a weak foundation." This quote speaks for itself. In order for your website to perform well, you should be looking for a reliable, performance-driven, and scalable hosting provider that can fulfill your needs. 

There are a number of decent hosting solutions available, but all of them differ in one way or another. An extensive research by Design Bombs should lead you in the right direction. 

Nevertheless, you should be looking for at least the following qualities: 

  • At least 99.9% uptime.
  • Daily backups.
  • Fast performance.
  • High-end technology. 
  • Strong reputation.
  • Real-time support.
  • Traffic scalability.

2. Choose a Well-Coded Theme

Poorly coded themes are one of the major causes of website delays. It could be worthwhile to carry out extensive theme research and to be prepared to spend a few bucks for a robust framework. 

Look for themes that are well-supported, updated frequently, and offer functionalities that can prevent the use of additional plugins (i.e., shortcodes). 

3. Make Use of CDNs (Content Delivery Networks) 

Content Delivery Networks are a breath of fresh air for your hosting provider. CDNs host and serve your files, scripts, and images across multiple servers in different locations. Hence, instead of keeping all of your files on a primary server, CDN will load your data from the nearest server closest to the users. 

Typically, CDNs can dramatically decrease your bandwidth usage, relieve your server, and minimize the number of requests. 

Some decent CDNs include: 

In most cases, CDNs can be easily integrated with popular WordPress caching plugins like W3TC and WP Rocket

4. Compress and Rescale Images

Although quality imagery is an integral part of a visually attractive website design, it's worth taking the time to ensure that all images are properly scaled and optimized. Quality images come with pitfalls, usually in the form of huge file sizes. As a rule of thumb, larger files delay the rendering process, especially for those on a weak internet connection. 

Luckily, there are numerous external and internal tools and plugins available at your disposal. 

  • WP Smush It: A Wordpress plugin that automatically compresses the size of your images without losing quality. 
  • Imagify: A decent alternative to WP Smush It. 
  • Compressor.io: An external tool.
  • Tiny PNG: An external bulk optimization tool .

All of these tools can reduce the size of your images by up to 80% without losing any visual quality. 

Prior to uploading images to WordPress, ensure they match the dimensions of your website. For instance, if you intend to use a 500px by 250px image, avoid uploading an 1000px by 500px image and resizing it within Wordpress. 

5. Make Use of a Caching Plugin 

In most cases, the simple implementation of a caching plugin can drastically improve the speed of your website within a couple of minutes. Instead of loading a page every time a user lands on a website, caching plugin serves a saved version, saving a tremendous amount of time and bandwidth. 

Despite the name, these plugins do far more than just the basic browser and page caching. Several high-end plugins like WP Rocket and W3 Total Cache are capable of solving various challenges, including: 

  • Scripts minification.
  • DNS prefetching.
  • CDN integration.
  • Image LazyLoad. 
  • Database optimisation. 
  • GZIP compression and more. 

6. Implement Image LazyLoad

Before a page becomes visible to the user, a browser has to load all files and images. LazyLoad functionality ensures that images are only rendered when they become visible to the user (i.e., when scrolling down the page). This, in return, allows a page to load without waiting for images, consequently, saving bandwidth, and not frustrating the end user. 

A handy Image Lazy Load Plugin can be of good help. 

7. Avoid Self-Hosted Videos

Although WordPress gives you the ability to upload videos directly to your server, they can cause severe damage to the overall health of your site, drastically slowing down your website. Not only they can cause frustration, but they can also eat up your bandwidth. 

Instead, use third-party video hosting platforms like YouTube or Vimeo. 

8. Minify Your Codes

Minifying CSS, JavaScript, and HTML files can certainly help you achieving your speed optimization goals. It's worth noting that every single character in your code contributes to the overall size of your page, thereby delaying the load time. Hence, by eliminating unnecessary characters, comments and white spaces you can significantly reduce the size of your codes. 

Luckily, the vast majority of caching plugins can handle the work for you automatically. 

9. Combine CSS and JavaScript Into Fewer Files

Every plugin comes with plenty of CSS and Javascript files, meaning that a browser has to call out for every individual script when a page is being loaded. This can have an adverse impact on your load time. Thus, combining these scripts into fewer files benefits the overall performance. 

Similarly to minification, most plugins can manage this for you. 

10. Clean Up Post Revisions and Optimize Your Database

Post revisions, unapproved comments, deactivated plugins, trackbacks, deleted items, and spam comments can easily pollute your database, especially if you have been using Wordpress for a while. All of this can be easily eliminated with the use of the WP-Optimize plugin. 

11. Avoid Heavy and Conflicting Plugins 

Poorly coded plugins that conflict with each other can severely damage the health of your website, making it a vulnerable target for hackers. Not only they can cause security concerns, but they can also break the functionality of your primary plugins and theme. 

Ensure to keep all of your plugins updated and delete the ones that are causing technical difficulties. To identify which plugins are damaging your website's performance, use a P3 plugin

12. Delete Plugins You No Longer Use 

One of the quickest and easiest ways to improve the speed of your website is to conduct a plugin audit. Far too often, webmasters tend to forget about deactivating and deleting the plugins they no longer need. By eliminating unnecessary plugins, you are saving space, making your website faster. 

13. Avoid and Fix Broken Links

Fixing broken links that lead to 404 pages should definitely be a part of your regular website audit. Not only they can leave users frustrated & unsatisfied with your website, but can also drain your bandwidth & cause bad requests. This, therefore, would delay the load speed. 

A handy Check My Links extension for Chrome scans the entire page for broken links, making the job a whole lot easier for you. 

14. Reduce Redirects 

Although 301 and 302 redirects is a normal practice for web owners to direct people from one page (perhaps a 404 error page) to another, they create additional HTTP requests that slow down your website. 

Unless it's completely necessary to implement a redirect, try to keep them to a minimum. 

15. Avoid Image Hotlinking

Image hotlinking is when someone displays your images on their websites by linking to the full image URL on your server instead of uploading them directly to their own servers. Hence, whenever that page is loaded, the site steals your bandwidth. 

RewriteEngine on 
RewriteCond %{HTTP_REFERER} !^$ 
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?yourwebsite.com [NC] 
RewriteRule \.(jpg|jpeg|png|gif)$ – [NC,F,L] 

In the code above, replace yourwebsite.com with the real website address. 

16. Consider AMP (Accelerated Mobile Pages) 

Just over a year ago, Google introduced AMP to the world, with the main intent to provide mobile users with a lightning-fast web experience. AMP page is simply a stripped HTML version of a standard page. 

So, in order to get featured in Google's news carousel and provide users with the ultimate web experience, high-traffic publications had no choice but to integrate AMP. 

Hence, if your site/blog is producing a regular stream of content and has a steady influx of traffic, consider implementing AMP on your website. 

17. Prefetch DNS Requests

If your website is using external resources (i.e., Google Fonts and Google Analytics), a browser has to make several DNS calls in order to load these scripts. Although this may only take a few milliseconds, your website speed is dependant on how fast these domains respond. 

18. Optimize Social Sharing Buttons

Although it's always nice to provide your visitors with a seamless way to share your content across their social media, the vast majority of social sharing plugins can easily damage the load speed of your site. 

Instead, try to self-host these sharing buttons or use a light-weight plugin. 

19. Reduce HTTP Requests 

Generally, every web page is made up of multiple assets, including scripts, stylesheets, images, third-party plugins, widgets, analytics codes, etc. Every time a user is trying to load a page, the browser has to make these individual HTTP requests, which can significantly reduce the speed of your website. 

Although it's necessary to use several resources (i.e., analytics scripts), it's recommended to keep these to a minimum. 

To reduce the number of HTTP requests, consider the following: 

  • Combine stylesheets into fewer files.
  • Reduce the number of scripts.
  • Use CSS Sprites.
  • Avoid external requests. 
  • Minimize the use of plugins.

20. Enable GZIP Compression 

Gzipping is a process of compressing pages, scripts, and files. GZIP compression reduces page weight, thus saves bandwidth and decreases response time. 

In most cases, compression can reduce the download time by up to 70%.  

A number of high-end caching plugins like WP Rocket and W3TC have GZIP feature built-in. 

Conclusion

Hopefully, by the time you're reading this line, it's crystal clear as to why website performance is imperative to your business. 

While some aspects of this process can get quite technical and overwhelming, to say the least, it's important to start small and move your way up to the more advanced techniques. 

First and foremost, ensure to evaluate your hosting options carefully, choose your theme wisely, and implement a robust caching plugin. This on its own will save you a tremendous amount of time and help you avoid the headaches of having to deal with every issue on a case-by-case basis. 

Topics:
performance ,speed ,ux

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}