10 Steps for Optimizing WordPress Site Performance

Improving WordPress website performance: a step-by-step optimization guide

(This article series on WordPress website performance optimization was created in collaboration with SiteGround. Thank you for your support for the partners who made SitePoint possible.)

Slow websites are frustrating. Potential visitors may leave before the page loads, and search engine rankings will also decline, resulting in reduced traffic.

The ideal web page loading time should be within two seconds. How to achieve it? Take it step by step.

This article will introduce a range of strategies that can be used to optimize the speed of WordPress websites.

Key Points

• Select a high-quality virtual host to ensure that the website does not slow down due to server problems. Excellent virtual hosts should prioritize speed and provide features such as SSD hardware, caching tools and CDN services.
• Optimize WordPress themes and plugins. A wide range of options may slow down the website, so choose a lightweight, well-coded theme. Minimize the number of plugins to use and make sure they are optimized for the current version of WordPress.
• Optimize images by specifying maximum size, using lossless compression techniques, using delayed loading, and choosing the most appropriate image format. Images account for more than 65% of web page content, so optimizing images can significantly improve site performance.
• Use cache to speed up high traffic websites. The cache stores HTML files for future visitors, saving a lot of loading time. Regularly optimize the database to delete unnecessary information and improve performance.
• Perform WordPress maintenance regularly and use performance plugins. Keeping your website updated, removing old revisions and spam comments, and using plugins for handling optimization tasks can all help keep your website running smoothly.

How slow is the website?

You may not feel that the website is slow. Your browser has a very likely cached page, so your experience is different from new visitors.

The following are some services that can tell you the page loading time and the total file size of the page:

• GTmetrix
• YSlow
• Google PageSpeed ​​Insights
• Pingdom

Check website speed before and after adjusting website performance. If your page loading time is within two seconds, it's done well.

Record the differences brought by each step. Which step is the most effective?

1. Select the right virtual host

Host a website on a slow server, speed improvement is impossible. Choosing the right virtual host is the first step to having a quick loading website.

How to choose a company that prioritizes speed? Check out the performance list in the Ultimate Guide to Selecting a Virtual Host.

SitePoint recently partnered with SiteGround to make it our official recommended web host. SiteGround has servers across multiple continents and uses the latest SSD hardware, internal caching tools and free CDN services to invest heavily in speed improvements. Its flexible server supports PHP7 and HTTP/2, and continues to perform software and hardware updates.

2. Optimize topic

First, use a quick theme. A multitude of options can simplify your work, but at the cost of increasing the burden on your web server and browser. Some WordPress themes are megabytes in size, increasing page loading time.

Every feature you don't use will slow down the website for no reason. If you are good at tweaking your code, select topics with fewer options to speed up your website.

• The default WordPress theme is easy to adjust, lightweight and has good code. Consider using a topic and adjusting your code yourself or hiring a developer.
• Thesis and Schema are two other themes that prioritize performance.

Further reading:

• What is the best WordPress theme?
• 9 Most Popular Free WordPress Themes
• How to design a complete WordPress website with basic themes and Elementor

Secondly, use responsive design. Responsive designs are designed to load less resources in mobile devices or specify high-resolution images for desktop displays. Mobile users do not need to download large images, and desktop users do not need to squint their eyes to look at small images.

Google also prefers responsive websites, so it is expected that SEO will improve after switching.

3. Monitoring plug-in

First, minimize the number of plugins used. Before installing any plugins, ask if you really need them. Installing a large number of plug-ins will not have a huge impact on website speed, but will increase the risk of installing bad behavior plug-ins.

Secondly, make sure your plugin is optimized for the current version of WordPress. Do some research before installing the plugin, especially if the rating is Samsung or lower. It may be poorly developed, or use inappropriate hooks. This can slow down the website and can also have a negative impact on WordPress and other plugins. It is also important to keep plugins updated to ensure you have the latest performance improvements, security patches, and features.

4. Optimization gadget

Your Widget should be as lightweight and easy to load as possible. Some widgets load external JavaScript or CSS when rendering. This is common for Facebook, Twitter and Google's social network Widget.

If the Widget is unlikely to be updated frequently, upload it directly to the server. By not relying on external servers, you can reduce the loading time of your website.

5. Optimize static content

First, use gzip to compress static content. The compressed file is smaller, so it loads obviously faster.

1. If you are using a shared server, the best option is to enable gzip compression directly from cPanel (if your host provides that feature).
2. You can enable gzip compression using a plugin like W3 Total Cache. We will cover the plugin in the next post.

Secondly, use CDN to reduce the load on the web server. Your static resources (such as images, scripts, and CSS files) will be served from optimized content delivery network servers all over the world — often the server closest to visitors. Your web server will be released to serve the rest of the website, thereby improving performance.

Ideally, look for virtual hosts that offer CDNs in their hosting plans, such as SiteGround. There are many CDN networks:

• Amazon S3
• MaxCDN
• Media Temple CDN
• Cloudflare
• Free CDN

These are used in conjunction with the cache plugins we will introduce next time.

The following is more reading about CloudFront:

• Motion image delivery using CloudFront

6. Optimized image

Images are one of the heavier elements of a website: they account for more than 65% of the content of the web page. There are several ways you can optimize uploaded images.

First, specify the maximum image size for thumbnails, medium and large images. You can find these options in Settings/Media. If you upload an image of 1024 pixels and your content area is only 604 pixels wide, the image will be reduced using CSS. The generated pre-scaling 604 pixel wide image download size will be significantly reduced.

Secondly, compress it! This technique can reduce image file size losslessly without resizing image size or reducing image quality. Although Yahoo canceled the Smush.it service a few years ago, there are alternatives like reSmush.it, and some plugins we will cover in the next post.

Third, use lazy loading. This technique is very effective for image-intensive websites. Images are loaded only when visible, not when the page is initially loaded. This can significantly speed up page loading times, although displaying delays when the image scrolls into the field of view.

Further reading:

• Five techniques to delay loading images to improve website performance

Fourth, choose the best image format for your website. Some image formats are easier to use, while others are smaller. For example, a scalable SVG has a smaller file size, especially if you optimize it for the web and compress it with gzip.

Learn the advantages and disadvantages of various image formats here:

• What is the correct image format for your website?
• Is using SVG images good for the performance of your website?

Fifth, use CSS wizard. Improve performance by combining many small topics and miscellaneous images into as few images as possible. Learn more here:

• CSS Elf
• How to use SVG image wizard

Lastly, check out this comprehensive overview of image optimization:

• Optimize WordPress Images

7. Optimize database

WordPress page is loaded from the MySQL database. Over time, the database may contain a lot of information that you no longer need. Optimizing the database deletes this information and improves performance.

You can optimize the database directly from phpMyAdmin. You can also use plugins to optimize it. We will cover these in the next article.

8. Use cache to speed up high traffic websites

Cache is very effective in optimizing high-traffic websites. Each time a WordPress page is loaded, information is retrieved from the database and CSS files, combined into an HTML file, and then loaded into the guest's browser. It takes time.

Cache makes these HTML files available to future visitors, saving a lot of time. We will cover the cache plugin in the next article.

9. Perform routine WordPress maintenance

Keep your WordPress website in its best shape with regular maintenance. Some maintenance routines can significantly increase speed, especially:

• Keep WordPress and plugins updated.
• Delete old post revisions.
• Delete spam comments.

Learn how to do these and more here:

• Your regular WordPress maintenance list

10. Using performance plug-ins

For many optimization tasks, there are some WordPress plugins that can do the heavy lifting for you. We've covered eight of the best plugins that cover all aspects. We also list nearly twenty alternatives so you can explore which ones are best for your needs. Get in-depth and see which ones have the greatest impact on your website.

If you are following our WordPress maintenance checklist, you may already be using some of these plugins. Keep working hard! This garbage will accumulate continuously.

### W3 Total Cache

• Cost: Free
• Active installation: 1 million

This plugin uses cache to provide simple web performance optimization (WPO) - cache posts and pages to memory or disk, cache feeds, search results pages, database objects, and compressed CSS and Javascript files. To make the most of it, take some time to configure it carefully.

W3 Total Cache can also be used with your CDN such as Cloudflare or MaxCDN to further reduce loading time.

W3 Total Cache improves website SEO and user experience by improving website performance and reducing download time through features such as Content Delivery Network (CDN) integration.

Alternative caching plugins include WP Super Cache, Hyper Cache, WP Fastest Cache, and Cache Enabler.

If you want to avoid plugins, a good option is to find a virtual host that caches for you. Our partner SiteGround has an excellent in-house developed caching tool that can help you greatly speed up your website.

### WP-Optimize

• Cost: Free
• Active installation: 600,000

This free plugin can optimize your WordPress database in just one click, or automatically optimize with its built-in scheduler. Redundant information (such as spam, post revisions, and other spam projects) will be scrubbed from your mySQL database, speeding up website loading.

WP-Optimize is an effective tool for automatically cleaning WordPress databases to run at maximum efficiency.

Alternative database optimization plug-ins include Optimize Database after Deleting Revisions, WP Cleanup, WPOptimize, WP Database Cleaner, and WP-DBManager.

### Autoptimize

• Cost: Free
• Activity installation: 300,000

Poor structured CSS and HTML can lead to slow website speed and loss of traffic. This plugin scans and tweaks your website, "compresses" and removes redundant code.

To prevent compatibility conflicts, Autoptimize can ignore your other plugins. It can also force your plugins to run in a specific order. By trying this, you may be able to significantly reduce loading time.

Autoptimize makes it very easy to optimize your website. It connects all scripts and styles, compresses and compresses them, adds expired headers, caches them, and moves the styles to the page header and moves the script to the footer.

Alternative plugins for compression include WP Super Minify and Better WordPress Minify.

### P3 (Plugin Performance Profiler)

• Cost: Free
• Active installation: 100,000

Bad plugins can adversely affect the performance of the website. P3 will evaluate your plugin. It will identify the plugin that has the greatest impact on website loading time and display it in the pie chart so you can easily see which tweaks have the greatest impact.

This plugin creates a website plugin performance profile by measuring the impact of the plugin on the website load time. Typically, WordPress websites load slowly because of improper plug-ins or excessive number of plug-ins. By using the P3 plugin, you can narrow down any factors that cause your website to be slow.

Alternative plugins related plugins include Plugin Organizer.

### WP Smush

• Cost: Free and Premium (starting from $19 per month)
• Activity installation: 700,000

This plugin compresses the image by removing metadata from JPEG files, optimizing JPEG compression, converting certain GIFs to indexed PNGs, and removing unused colors from indexed images. You can set it to automatically compress new images when uploaded to the website.

WP Smush is fast and has good performance. The files are compressed using a dedicated server and are recommended by the website performance tool GTmetrix.com.

Resize, optimize and compress all images with a powerful and completely free WordPress image compressor, courtesy of the super team at WPMU DEV!

Alternative image compression plug-ins include EWWW Image Optimizer, Imagify, Kraken Image Optimizer, ShortPixel Image Optimizer, and CW Image Optimizer.

Lazy Load

• Cost: Free
• Activity installation: 90,000

This plugin ensures that the image is loaded only if it is visible above the viewport. It works out of the box without configuration.

Delay loading of images to improve page loading time. Use jQuery.sonar to load images only if they are visible in the viewport.

Alternative lazy loading plugins include jQuery Image Lazy Load WP, ​​BJ Lazy Load, Rocket Lazy Load, Unveil Lazy Load, and Lazy Load for Videos.

### Imsanity

• Cost: Free
• Active installation: 100,000

This free plugin does not provide lossless compression, but will automatically adjust the image to a more "reasonable" resolution. It is able to set the maximum width, height, and quality of the image and can convert the BMP file to JPG.

Imsanity will automatically resize huge image uploads to a more reasonable size in the browser, but still large enough for typical website use. The plug-in can be configured using maximum width, height and mass.

WP HTTP Compression

• Cost: Free
• Active installation: 5000

This plugin compresses your page in gzip format (if the browser supports compressed pages). HTTP compression can reduce page size by 60-80%, increasing page loading speed by three to four times.

This plugin allows your WordPress blog to output pages compressed in gzip format (if the browser supports compression).

You can also enable gzip compression from the settings of the W3 Total Cache or virtual host control panel mentioned above.

11. Other tips

• Empty the trash bin. There may be a lot of junk in the database that will degrade the performance of the website. By default, WordPress automatically deletes junk after thirty days. You can manually clear the trash from the dashboard and we'll share some useful plugins in the next post.
• Compress JavaScript and CSS files by deleting all unnecessary data. CSS Miniifier lists some tools that can help you do this.
• Close Trackback and Pingback. Every time someone mentions your website, these use server and database resources. Turning off settings (from WordPress's "Discussion" settings) does not break backlinks, only breaks the generated work.

Get the action!

How slow is your website? Use one of the tools listed above to find out. Then try one or more strategies and test your speed again. Then repeat the process.

Our preferred virtual hosting provider SiteGround allows you to use powerful performance optimization techniques in just a few clicks. Their guide on improving WordPress performance includes a complete tutorial on many topics we cover in this article, including caching, gzip compression, using CDN, optimizing images, and optimizing WordPress databases.

Which optimization strategy has the greatest impact on your website? Please let us know in the comments.

Frequently Asked Questions about Optimizing WordPress Website Performance

What plugins are best for optimizing WordPress website performance?

There are several plugins that can significantly improve the performance of WordPress websites. Some of the best plugins include WP Rocket, an advanced plugin that provides a range of optimization features such as caching, database optimization, and lazy loading. W3 Total Cache is another popular choice, which provides features such as page caching, database caching, object caching, and browser caching. Other notable plugins include WP Super Cache, Autoptimize, and WP Smush for image optimization.

How does CDN improve WordPress website performance?

Content Delivery Network (CDN) can significantly improve the performance of WordPress websites by storing cached versions of websites on multiple servers around the world. When users visit your website, CDN delivers the website from the server closest to them, reducing data transfer time and thus speeding up the website.

How to optimize WordPress database to improve performance?

Optimizing WordPress database can significantly improve website performance. This can be achieved by regularly cleaning the database, deleting unnecessary data, and optimizing database tables. Plugins like WP-Optimize and WP-Sweep can help automate this process.

How does image optimization improve WordPress website performance?

Large, unoptimized images can significantly slow down WordPress websites. By optimizing images, you can reduce file size without losing quality, thus reducing page loading time. This can be done using plugins such as WP Smush or EWWW Image Optimizer.

How to use caching to improve WordPress website performance?

Cache can significantly improve the performance of WordPress websites by storing static versions of the website, thereby reducing the number of requests to the server, thus speeding up the website. This can be done using plugins such as W3 Total Cache or WP Super Cache.

How to compress CSS and JavaScript to improve WordPress website performance?

Compressing CSS and JavaScript files can improve the performance of WordPress websites by reducing file size and the amount of data users need to download when accessing the website. This can be done using plugins such as Autoptimize or WP Rocket.

How to optimize your WordPress website to suit your mobile devices?

Optimizing WordPress websites to suit mobile devices is critical to performance and SEO. This can be achieved by using responsive themes, optimizing images, enabling AMP (accelerating mobile pages), and using mobile-friendly plugins.

How can a good web hosting provider improve WordPress website performance?

Good web hosting providers can significantly improve the performance of WordPress websites by providing fast server speeds, reliable uptime, and excellent customer support. Some popular WordPress-friendly web hosting providers include SiteGround, Bluehost, and WP Engine.

How to monitor the performance of WordPress websites?

Monitoring the performance of a WordPress website is critical to identifying any issues and making necessary improvements. This can be done using tools such as Google PageSpeed ​​Insights, GTmetrix, and Pingdom.

How to improve WordPress website performance during regular updates?

Regular updates to WordPress websites, including themes, plugins, and core WordPress software, can improve the performance of your website by ensuring you have the latest features, bug fixes, and security updates. It is also important to test any updates on the staging site to avoid any potential issues before applying the update to your live site.

The above is the detailed content of 10 Steps for Optimizing WordPress Site Performance. For more information, please follow other related articles on the PHP Chinese website!