There are two main reasons to speed up your site:
- Site loading speed impacts search engines ranking. The faster your site, the higher it might be ranked
- Slow websites lead to visitors lost, one second delay can lose 7% of your sales
We highlight the general sources, which slow down your site:
- Hosting
- Theme
- Plugins
- Content
Below we’ll describe each in more detail.
Hosting
Choosing the “right” hosting to avoid page loading speed issues is pretty simple. Just make sure it meets WordPress minimum requirements.
Impreza Theme
Impreza is highly optimized right out of the box, and we’re constantly working on improvements. You can access performance settings at Impreza > Theme Options > Advances > Website Performance.
To maximize your site’s performance with Impreza, stick to the settings described in this article.
Plugins
Three Types of Plugins
Plugins might affect your site loading speed in many different ways, based on multiple factors, from the plugin’s initial purpose to the code quality.
Conventionally, we divide plugins into three approximate groups:
- plugins optimizing the loading speed
- plugins slowing down the loading speed
- neutral, without significant effect on the loading speed
How to Know if the Plugin Slows Down Your Site
There are plenty of tools allowing you to measure site load speed, some of them are built-in into your browser.
With Chrome, for example, you can open the site you want to check and press the Ctrl + Shift + I.
It will open browser developers tools. Start with switching to its “Audits” tab
Here, you’ll be able to choose setting for the audit and run it. To check loading speed choose the “Performance” audit, for “Desktop”, and with “No Throttling”. “Clear storage” checkbox allows emulate the first visit to the site (to check loading speed without the cache, explained in the section below).
After running the audit, find the “JavaScript execution time” and check scripts added by the plugin you want to check.
Analyzing the script loading time (Total CPU Time), especially if JavaScript execution time didn’t pass the audit, you can identify the plugin that works slowly.
These metrics along with the “Speed Index” allows you to evaluate the plugin’s effect on the loading speed, by running tests with and without this plugin activated.
Alternatively, you may run similar tests / audits using the external services designed for this purpose, such as:
Plugins Tips With Impreza
Below, you’ll find a list of recommendations on using plugins to improve the site loading speed:
- Use the minimum number of plugins. Deactivate and delete all unnecessary plugins, some of them add extra script and style files, which can slow down your site. Even deactivated plugin can affect your site performance so it’s better to delete it.
- Use plugin optimizing the images load. Allows resizing, optimizing, lazy loading, and compressing all of your images.
- Use caching plugin. Designed to optimize loading speed by creating static versions of your page content and showing those to the visitor instead of running the content-generating process every time.
- Use JavaScript and CSS optimization plugin. Designed to optimize loading speed by aggregating, minifying, and caching JavaScript and CSS, and putting the aggregated and modified files to the footer.
- Don’t perform plugins tests on live sites. Some plugins create database records, which might not remove when you remove the plugin.
Content
Images
Images are one of the core parts of your content. But also they are the most common reason for site load speed issues.
Optimize Images Loading
You can improve the site loading speed by:
- compressing images for a faster load.
- resizing and regenerating the thumbnails for your images.
The easiest way to implement those, is to use image optimization plugin. The one we recommend and use ourselves is Smush
Optimize Images Size & Format
Avoid using photos or stock images in their original formats and sizes. Those could have huge file sizes.
Let’s say, on your page, you need a small 300×300 px image. So you find and download a nice image from the stock, with 4200×2600 px dimensions and 3.3 MB file size.
Possible Optimization Options
| Optimization options | Image Size | File Size |
| Original image | 4200 x 2600 px | 3.3 MB |
| Web-optimized, same image size | 4200 x 2600 px | 2.5 MB |
| Original, resized | 300 x 300 px | 175 KB |
| Web-optimized, resized | 300 x 300 px | 60.5 KB |
Being pasted inside the 300×300 px frame on your site, those images will look very similar, almost the same. But for site loading speed, reducing the file size down for ~50 times is huge.
Choosing the format
When we use images for the web, the choice is commonly simple: JPEG or PNG. Check this Google Developers article regarding this matter.
How to optimize images for web
You can use image editing software (Photoshop and similar editors). Such software got options to “save for web” or “optimize” the image, which generates the preview with quality controls, allowing you to find the best combination of quality and file size for your image.
Alternatively, you may use online image optimization tools, like https://tinypng.com/ and analogs.
Avoid Overusing Images
Avoid using unnecessary images, which you can replace with the text or remove without hurting the readability. Even being correctly optimized, images might slow down your site if you’re using too many.
Videos
The main recommendation here is: DON’T store your videos on your site. This will increase the page loading speed and server load significantly.
Instead, we recommend using embeds from the popular video storing services, like Youtube and Vimeo. With Impreza Theme, you got a special element “Video Player” designed for easy embedding, resizing and styling videos.
Load More Pagination
Often, the page content consists of multiple similar blocks distributed over the single- or multiple-column grid. Whether it’s a blog posts page, image gallery, testimonials, archive or search result page, loading all of its items automatically might slow down your page.
Instead, you can only load items that are currently in the viewport of your browser, uploading the rest on-scroll, or by clicking the “Load more” button.
You can use this feature with Impreza “Grid” element, in its “General” section of settings:
Content Caching
Every time you open a WordPress page, it builds dynamically. It runs processes to find the required information, combine it into the layout of your page/blog and display the final version to the visitor.
This process runs every time and might slow down your site performance significantly.
To resolve this, you can use a caching plugin. Caching plugins create static versions of your page content and show those to the visitor instead of running the content-generating process every time.
The caching plugin we recommend and use ourselves for our demos is WP Super Cache. We’ll show the settings we use for it to optimize our sites, but note that you might need to contact your admin, in case if you’ll want to adjust it deeper or differently.
WP Super Cache Setup
Easy
Once you download and activate the plugin, open the “Easy” settings tab and turn the caching on.
Once it’s turned on, you’ll be able to test if caching works using the relevant button in the same tab:
This test opens your site twice, and if loading time (timestamps) match, this means caching is working as intended:
Advanced
Moving on to the “Advanced” tab, start with applying the “Enable Caching” checkbox:
Next, pick the “Simple” option for “Cache Delivery Method”:
For “Miscellaneous” section, stick to the checkboxes marked as “Recommended”
Lastly, specify the “Cache Timeout”
Content Delivery Network (CDN)
Content Delivery Network (CDN) is the network of servers spread all around the world, that can be used to deliver cached versions of your site pages. It significantly increases the loading time when your site got a lot of traffic, especially if the targeted audience located in countries far away from your original hosting. CDN serves data using the server closest to the visitor’s location.
CDN core benefits:
- Improves loading speed for visitors
- Reduces the server load and saves the bandwidth
- Helps handling the high traffic
You can start using CDN for your site by choosing the relevant service providers. The one we recommend and use ourselves is CloudFlare.