12 Best Speed Optimization tips to speed up Elementor Websites (2020)
Elementor is one of the best page builders for WordPress written under strict code standards. The Elementor website builder allows WordPress users to create and edit websites by using the drag and drop technique, with a built-in responsive mode.
But, some of the websites built with Elementor page builder can be plagued with configuration issues that might lead to slow page loading.
In this article, we’re providing a few useful tips and best practices to deal with your slow loading Elementor website. All these tips are applicable to any type of WordPress website as well.
PS: Before you begin optimizing, make sure that you backup your entire website.
Let’s get into it!
1. Choose a good Host
Firstly, you must identify the right performance-oriented host for your website. Many hosts are still running older versions of PHP like PHP 5. A host driven for performance should definitely offer PHP 7+ as they provide massive performance improvements.
Cloudways and SiteGround are both great hosting options for your WordPress website.
2. Use Lightweight Theme
You may have used page builders to create most of the website content but still, you must focus on themes. They are important in speeding up the loading time of your entire website. By switching to a lightweight theme you can improve your page load times by over 25%.
You must make sure that the theme is lightweight in terms of file size. Also, make sure to choose a modular theme that allows you to select and pick only the features you want.
3. Upgrade to PHP 7.4
You can check your current PHP Version under Elementor > System Info.
Upgrading PHP versions is one of the easiest ways to speed up your Elementor site. Elementor also recommends the higher PHP versions and to increase the memory limit to 256MB. So, that’ll be our next step.
4. Increase the memory limit to 256MB
You can check your memory limit under Elementor > System Info.
Elementor, WordPress, and WooCommerce all recommend a memory limit of 256MB. You can usually change memory limits in your hosting account.
Otherwise, add this code to functions.php:
define( ‘WP_MEMORY_LIMIT’, ‘256M’ );
5. Avoid slow loading Plugins
High CPU plugins slow down Elementor sites. Such plugins usually are related to statistics, backups, social sharing, portfolios, live chat, contact forms, sliders, JetPack, etc. Any plugin that is constantly required to run on your website should be suspect as a high CPU plugin.
If you’re running bulky and slow plugins, I’ll recommend replacing them with lightweight alternatives. It’ll show you a noticeable improvement in your WordPress site speed.
6. Use a CDN
CDN stores a copy of your website across different locations around the world and helps deliver it to visitors quickly. This helps visitors to download your website from their nearest location. As the traffic is split across different locations, you can improve the page loading time along with lower latency.
If you’re using Cloudflare CDN for your Elementor site, you can enable the following speed optimizations:
- Speed: enable Brotli and Rocket Loader
- Scrape Shield: enable hotlink protection
- Page Rules: set up page rules for WordPress
- Firewall: block bad bots from Wordfence’s live traffic report
7. Disable Unused Elementor Addons
Many Elementor plugins have widgets, add-ons, and scripts that are turned on by default. But, you might not be using most of such widgets, add-ons, and scripts. Go through the settings of all such plugins and deactivate the addons not currently being used on the site.
You can use the Asset Cleanup plugin to deactivate Elementor scripts not being used on individual pages of your site.
8. Utilize Caching
You can cache a page by creating a static HTML version of it. This can stop forcing the server to generate a page again and again from the database and PHP files for every single visit.
If you have a fully managed WordPress hosting, the page caching implementation can be done at the server level. So, you don’t need to worry about caching if you have a fully managed WordPress hosting. If not, you can implement it via a plugin like WP Super Cache.
9. Enable Gzip Compression
Gzip helps compress the files that are sent to the visitor’s browser from your server. Your file can be shrunk by over 70% using GZIP. The implementation part of GZIP is very simple and it helps in increasing the loading speed of the website. Some hosting providers allow you to implement GZIP via Cpanel.
10. Optimize Images
Visual elements are a major reason behind slow page load speeds. Large size images and videos can slow down your website a lot. Serving unscaled and full-size images increase your total page size and thus directly reduces your page load speed.
We recommend serving images that are the right dimensions as well as compressing images to deliver lightweight images. This will significantly reduce your page size and improve its delivery time and page speed.
11. Minify and Concatenate CSS and JS files
Minification of resources involves removing unnecessary characters from your website’s HTML, JavaScript, and CSS code. Such unnecessary characters are not required to load, and these include white space characters, new-line characters, comments, block delimiters, etc. This improves your page speed as it reduces the amount of code that has to be requested from the server.
Concatenation is the process of combining your multiple JavaScript and CSS files into one file each. This is done with the object of reducing the HTTP requests. In some cases, this might increase the download time of your file, but it is usually better than having additional requests.
12. Disable Hotlinking
Doing this may not directly impact your website’s speed, but it’ll take some pressure off your server. Hotlinking occurs when an image is served on a different website from your server, instead of uploading it on that website’s server. In other words, I just link the image to your server instead of saving the image and then uploading it to my server.
This effectively means that I am stealing your bandwidth and you don’t get any traffic to show for it. You can add the following code to your .htaccess file to block hotlinking of images from your Elementor site.
RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?yourdomain.com [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?google.com [NC]
RewriteRule \.(jpg|jpeg|png|gif)$ — [NC,F,L]
Note: Change “yourdomain.com” in the code above to the URL of your website.
Final Words
We hope that the tips provided above were helpful in speeding up your slow Elementor website. Elementor is a fairly new WordPress page builder that has gained a lot of popularity quickly. Understandably so, Elementor makes it easier than ever to create beautiful, dynamic, and responsive pages for your WordPress website.
Are you still having trouble speeding up your Elementor website? We can help speed things up for you with some advanced performance optimization! Get in touch with us today for professional support.
