The Complete Guide to WordPress Performance Optimization

Practical guide to improving the performance of WordPress websites

Key points:

• Select a high-quality host: High-performance host is crucial to website speed. Managed WordPress hosting and VPS solutions provide better control and efficiency.
• Simplified themes and plug-ins: Avoid bloated themes and plug-ins. Unwanted features will slow down the website and affect the user experience.
• Implement caching policies: Page caching and object caching can reduce server load and speed up content delivery.
• Optimize database regularly: Delete redundant data, optimize database operations, and ensure quick query response.
• Using CDN: CDN can provide static files to global users faster and improve the global performance of the website.
• Compress and optimize pictures and static files: Reduce loading time and consider using delayed loading technology.

WordPress accounts for nearly 50% of the CMS market share of the world's top one million websites (data comes from Builtwith.com). In the e-commerce field, WooCommerce also accounts for 33%. Although WordPress is sometimes criticized for being bloated, resource-intensive, and data models have shortcomings, its popularity is unquestionable.

WordPress's ease of use and low threshold make it widely used. It is easy to set up and requires little technical knowledge. You can find a WordPress host for just a few dollars a month, and the basic settings are done in just half an hour of clicks. Free WordPress themes and themes with WYSIWYG page builder abound.

Many people look down on WordPress, but it is undeniable that WordPress has promoted the development of the Internet and PHP, and many Internet professionals have also started their careers due to the ease of WordPress.

However, this ease of use comes at a cost. Many websites under the banner of WordPress are not created by professionals, but are done by cheap developers, and their performance and appearance are often overlooked. Professional appearance and performance should not be remedied afterwards, but should be considered during the website planning stage.

Ling's Cars, a well-known British used car dealer, has tried a unique marketing method, and don't imitate unless you know very well what you are doing.

Everything starts with host selection

Newbie people usually choose low-cost products and come with many beginner-friendly features. This part of the website setup needs to be taken seriously considering the improper business practices of some large industry participants and the client’s need for website migration professionals.

We can divide WordPress hosting vendors into several levels:

• High-end: Providers like Kinsta that specialize in WordPress hosting services have plans starting at $100 per month, and even higher-end hosting services like Automatic's WordPress VIP, although trustworthy, for many The website owner may be overpriced.
• Mid-range: Flywheel, A2 Hosting, SiteGround and Pantheon are considered reliable and performance-oriented suppliers, providing acceptable speed and hosting services for those more price-oriented customers. Users may get less help here, but these services usually strike a good balance between reliable setup, price, and advanced user options. There is also Cloudways, which is between VPS and managed hosting. European users can consider Pilvia because it offers a high-performance server stack and is quite affordable.
• Low-end: For those who are not afraid of the command line, you can choose VPS and dedicated server vendors such as Digital Ocean, Vultr, Linode, Amazon's Lightsail, Europe's Hetzner and OVH. Hetzner is a German supplier known for its quality physical servers, at a slightly higher price than virtual servers, while OVH offers very cost-effective virtual servers. For price-oriented users, Kimsufi, a subsidiary of OVH in Europe and Canada, also offers cheap physical dedicated servers, while Host US provides very affordable virtual servers.

For managed hosts, it is important to note the server stack, CDN integration, and SSD storage. Guaranteed resources like A2 are a great advantage. Next is SSH access. Technology-savvy users may benefit from the availability of WP-CLI.

When choosing VPS, it is important to note that XEN or KVM virtualization is better than OpenVZ because it can reduce overselling of resources and help ensure that the resources you purchase are indeed yours. It also provides better security.

Easy Engine is a software that can turn your entire VPS/WordPress installation into an hour of work.

Regarding the server stack, if you pursue performance, Nginx is better than Apache, PHP 7 is a must. If we really need Apache, using Nginx as a reverse proxy is an advantage, but this setup can be more complicated.

Tests show that PHP 7 has a great advantage over previous versions. According to fasthosts.co.uk:

WordPress 4.1 has increased requests per second on PHP 7 by 95%.

When choosing a host, be aware of the negative experiences of some notorious providers.

Software precautions

What usually slows down WordPress websites is the huge front-end that contains a lot of static resources and database queries. These problems stem from the choice of topics (and their page builders, large sliders, etc.), which not only slows down initial loading due to many requests and overall size, but also due to a lot of JavaScript and content that needs to be rendered. Slow browser speeds, making it unresponsive.

The golden rule here is: don't use it unless there is a good reason.

This may sound like a rule from Homer Simpson's mouth, but if you can skip any bells and whistles, skip it. Be conservative. If you have to add some shiny features or JS visuals, always prioritize those that are tailored and coded as much as possible for your exact needs. If you are a skilled coding person and the project justifies the work, remember to write your own code.

Check all the plugins that are indispensable to your website – and remove other plugins.

The most important thing is: Back up your website before you start trimming!

Data Model

If you are using a topic where you use many custom posts or fields, please note that many of these will slow down your database query. Keep your data model as simple as possible, and if not, consider that WordPress’s original purpose was a blog engine. If you need more features, you may want to consider some existing MVC web frameworks that will give you more control over your data model and database choices.

In WordPress, we can build rich custom data models by using custom post types, custom taxonomy, and custom fields, but pay attention to the cost of performance and complexity.

If you understand the code, please check your topic for unnecessary database queries. Each individual database access will spend precious milliseconds in your TTFB, as well as megabytes of memory on your server. Remember, secondary loops can be expensive – so be careful when using parts and widgets that show extra posts, such as sliders or part areas. If you have to use them, consider getting all posts in one query, otherwise it may slow down your site. For those who don't want to code from scratch, there is a GitHub repository.

Metal query can be expensive

Using custom fields to get posts based on certain conditions can be a powerful tool for developing complex WordPress features. Here is an example of a meta query where you can find some detailed instructions on its cost. Summary: Post metadata is not constructed for filtering, taxonomy is.

get_post_meta is a function that is usually used to get custom fields, it can be called with just the post ID as a parameter, in which case it will get the metadata field of all posts in an array, or it can Takes the name of the custom field as the second parameter, in which case it returns only the specified field.

If you use get_post_meta() on a post multiple times (for multiple custom fields) on a page or request, be aware that this does not incur additional costs because this is called for the first time When functioning, all post metadata will be cached.

Database maintenance

Installing and removing various plugins and changing different themes throughout the life cycle of a website will often fill your database with a lot of unwanted data. It's entirely possible to discover—when checking why WordPress websites are running slow or failing to load due to server memory exhaustion—the database has grown to hundreds of megabytes or even more than gigabytes, and nothing can explain it. wp-options are where many orphaned data are often left behind. This includes but is not limited to various transient data (this article warns of best practices about deleting transient data in plug-ins). Transient data is a form of cache, but like any other cache, it can do more harm than good if used incorrectly. If your server environment provides it, wp-cli has a set of commands specifically for transient data management, including deletion. If not, there are some plugins in the WordPress plugin library that can remove expired transient data, but they provide less control.

If deleting transient data still makes our database bloat without any practical reasons, WP-Sweep is an excellent free tool that can do the job of cleaning up the database. Another thing to consider is WP Optimize.

Before performing any type of database cleaning, it is highly recommended that you back up your database!

A very convenient plugin for analyzing the entire WordPress request lifecycle is Debug Objects. It provides inspections of all transient data, shortcodes, classes, styles and scripts, loaded templates, database queries and hooks.

Ensure a reasonable, performance-oriented setup—thinking our server stack in advance, eliminating the possible bloat from topic selection and plug-in and widget overloads—we should try to identify bottlenecks.

If we test our website in a tool like Pingdom Speed ​​Test, we will get a waterfall diagram of all resources loaded in the request:

This gives us detailed information about the request-response lifecycle that we can analyze to find bottlenecks. For example:

• If the pink DNS above is too long, it may mean we should consider cacheing our DNS records longer. This is done by adding TTL settings in our Domain Management/Register Dashboard.
• If the SSL part takes too long, we may want to consider enabling HTTP/2 to benefit from ALPN, adjusting our cache-control header, and finally switching to the CDN service. "Web performance in short: HTTP/2, CDN, and browser caching" is an exhaustive article on this topic, as is KeyCDN's "Analyzing HTTPS Performance Overhead".
• Connect, send and receive parts are usually dependent on network latency, so these parts can be improved by being close to the hosts of the target audience, ensuring the hosts have fast uplinks, and using CDNs. For these projects, you may also want to consider a ping tool (not to be confused with the Pingdom tool mentioned above) to ensure your server is responsive.
• The waiting section – the yellow part in the waterfall chart – is the time it takes for your server infrastructure to generate or return the requested website. If this part takes too long, you may need to go back to our previous topics about optimizing servers, WordPress installations, and database stacks. Or you can consider various levels of cache.

To get more extensive testing and guidance to improve the website, there is a small command line utility called webcoach. In an environment with NodeJS and npm installed (such as Homestead Improved), it is easy to install:

<code>npm install webcoach -g</code>

After installing, we can get detailed insights and suggestions on how to improve all aspects of the website, including performance:

Cache

Cache can play an important role when managing WordPress websites. There are several levels and possible ways to cache.

Page Cache

Page cache is a cache of the entire HTML output of a web application.

If you can, we should first try testing server-level solutions, such as NGINX cache or Varnish, or caching systems provided by hosting providers such as Kinsta, SiteGround.

If this doesn't help as we hoped, we might want to consider using plugins like WP Super Cache, WP Fastest Cache or the improved W3 Total Cache on GitHub. All of this can improve performance, but usually requires some experimentation. An improperly configured caching solution can actually hurt the performance of the website. For example, W3TC – at least before improvements – is considered as the best free cache solution that works wonders…when it works. When it doesn't work, it may take your website offline.

WP Rocket is considered to be the most highly praised advanced caching solution.

Page caching can greatly improve performance and deliver the entire website from RAM, but be aware that if you have a dynamic website with a shopping cart or rely on cookies or personalized front ends, it can cause complications. It can provide one user with the UI part of another user, so it usually needs to be tested before going to production. This is especially suitable for solutions on unmanaged servers, such as Varnish or Cloudflare page caching.

Fragment Cache

Fragment caching is a solution to be considered when dynamic, cookie-dependent websites are difficult to cache using the full page method, or when we cache Ajax requests. Here is a good introduction.

Object Cache

Object cache means compiling and storing all database queries and PHP objects in memory. Some cache plugins try to manage object cache backends for us. The use of backends is usually APCu, Memcached, and Redis. They need to be installed on the server.

To test the performance of our PHP code and object cache more deeply, a valuable tool (requires shell access and installing wp-cli) is the profile command. We can install it using the following command:

<code>npm install webcoach -g</code>

or

<code>wp package install git@github.com:wp-cli/profile-command.git</code>

(Depending on the installation situation, you may need to add the --allow-root flag.)

We can then analyze the entire load cycle, or go deep into specific hooks, files and classes, their loading time and cache ratios.

Browser Cache

Browser cache means force the visitor's browser to save their static files in their cache, so they do not need to get these files from our server when they are repeatedly accessed. Use the cache-control and expires headers here. Caching plugins usually manage browser caches and set headers. Technumero has made a more in-depth guide.

Static File

Static files are images, style sheets, JS codes, fonts, media files, etc. We should make sure we compress them and we are using HTTP/2 to serve these files if possible. If our managed host does not support HTTP/2, or migrating our unmanaged VPS to HTTP/2 is beyond our reach, the easiest way is to integrate the CDN into our stack. CDN provides our static files from data centers closest to our audience. This reduces latency, often meaning leveraging their highly tuned infrastructure.

Autooptimize is a plugin that can help manipulate our static assets and reduce the number of requests. It can connect JS and stylesheet files to narrow them down, thus reducing page output.

Regarding media files, we should consider compressing/encoding our videos to reduce their size and providing them through providers such as YouTube to reduce the stress on our servers. A cloud storage provider like Amazon S3 is another good choice. Video hosting is outside the scope of this article, but WPMUDEV has produced a practical guide on this topic.

Regarding images, these images are usually too large for the web. Sometimes the only solution that can get our servers to work properly (which can take a long time) is batch compression via shell. Imagemagick on Linux has a useful convert tool that allows us to batch compress our images. This example recursively does this for all JPGs in the folder, reducing JPEG quality to 80%, along with some other small enhancements, and resizes the image (it should be self-interpreted):

<code>npm install webcoach -g</code>

WP Bullet has two excellent guides for batch compression of JPG and PNG files.

In addition, there are Imagify services and corresponding WordPress plug-ins to reduce image size, EWWW image optimizer, etc...

Other random prompts

• Memory: Make sure that your installation has enough memory.
• XML-RPC and login pages: XML-RPC and login pages are often subject to automatic, scripted brute-force attacks—even if it is not a big target. Even if they don't break in, they waste CPU cycles. We should try to block them at the server level before our WordPress installation loads. If we don't need to access xmlrpc.php, we can put this code in the virtual host block on nginx:

<code>wp package install git@github.com:wp-cli/profile-command.git</code>

In Apache:

<code>wp package install wp-cli/profile-command</code>

Plugins like iThemes Security, WPS Hide login, etc. can help solve this problem and change our login page URL.

If you are under brute force attack and are not protected by a CDN or managed host like Cloudflare, consider using a firewall like fail2ban (you should install a firewall whether you are under attack or not).

• WordPress Heartbeat: Polling the server when the WordPress dashboard is open may slow down your server and make your dashboard unresponsive. Especially if it is in multiple browser tabs or opened by multiple users. HeartBeat plugin can help solve this problem.
• MAX_INPUT_VARS: When saving posts with large amounts of metafields or variable products with WooCommerce, we may reach the limit of maximum number of requested variables allowed (sented by complex WooCommerce products There may be thousands of variables). This may crash your server. Here's how to fix it.
• If you are using a WordPress installation with a large database — especially a WooCommerce installation — and you are starting to experience speed issues that you can't solve, consider using ElasticPress. Some people are very satisfied with this.
• If you use WordFence, make sure to turn off the Live View feature. It can even stop the VPS with a few GB of memory.
• If you are logging access to your website – especially in debug.log in your wp-content directory – be aware of its size. It can grow to the gigabyte level and crash your server.
• If you have a system crash on the server/host, the core dump will fill your storage space. Please analyze the causes of these crashes and then delete the files. You will recognize them by patterns that look like core.XXXXXX.

All of all, you need to be warned again: before you make any changes to the website, please back it up!

Conclusion

I hope this compilation of WordPress optimization tips can come in handy. As the size of the website grows, these techniques are becoming increasingly difficult to apply retroactively. This is why it’s best to start early and strive to get the most out of the way: apply as many of these technologies as possible before starting , and you will not only have a smooth start, but also a high from day one Performance apps – This is definitely an excellent experience for all new users.

Make sure you check out SitePoint's PWA guide as well. Make your WP website PWA as much as possible from day one, which will help users install it on the home screen of their device, ready for repeated access.

FAQs on WordPress Performance Optimization

What plugins are best for optimizing WordPress performance?

There are several plugins that can significantly improve the performance of WordPress websites. Some of the best include WP Rocket, W3 Total Cache, and WP Super Cache. These plugins provide features such as page caching, object caching, and GZIP compression to help speed up the website. Additionally, plugins like Imagify can optimize your images, reducing their size without affecting quality, which can also improve loading time.

How does CDN improve WordPress performance?

Content Delivery Network (CDN) can significantly improve the performance of WordPress websites by storing copies of website content around the world. When users visit your website, CDN delivers content from the server closest to them, reducing the time it takes to load content. This can significantly increase the speed of the website, especially for users who are away from your primary server.

How to optimize my WordPress database?

Optimizing WordPress database can significantly improve website performance. This can be achieved by regularly cleaning the database, deleting unnecessary data, and optimizing database tables. Plug-ins like WP-Optimize can automate this process, making it easier to maintain a clean and efficient database.

How to improve WordPress performance in image optimization?

Image optimization can significantly improve the performance of WordPress websites by reducing the size of the image without affecting its quality. This can be achieved by compressing the image, using the correct image format, and adjusting the image to the right size. Plugins like Imagify can automate this process, making it easier to optimize images.

How to reduce server response time in WordPress?

Reducing server response time can significantly improve the performance of WordPress websites. This can be achieved by optimizing server configuration, using high-quality host providers, and implementing caching solutions. In addition, reducing the number of requests a website makes to the server can also increase the server response time.

How to reduce CSS and JavaScript to improve WordPress performance?

Shrinking CSS and JavaScript files can significantly improve the performance of WordPress websites by reducing the size of these files. This process involves removing unnecessary characters, such as spaces and comments from the code without changing its functionality. Plugins like Autoptimize can automate this process, making it easier to shrink files.

How to optimize my WordPress website to fit mobile devices?

Optimizing WordPress websites to suit mobile devices can significantly improve the performance of your website on these devices. This can be achieved by implementing responsive design, optimizing images to fit mobile devices and using mobile-friendly themes. Additionally, plugins like WPtouch can help you create mobile-friendly versions of your website.

How to improve WordPress performance when lazily loaded?

Lazy loading can significantly improve the performance of WordPress websites by loading images and other content only when visible on the user's screen. This can reduce the initial loading time of the page and improve the speed of the website. Plugins like Lazy Load by WP Rocket can automate this process and make it easier to implement lazy loading on your website.

How to use GZIP compression to improve WordPress performance?

GZIP compression can significantly improve the performance of WordPress websites by reducing the size of files. This process involves compressing the file before it is sent to the user's browser, thereby reducing the amount of data that needs to be transferred. This can significantly improve the loading time of the website. Plugins like Check and Enable GZIP compression can automate this process and make it easier to implement GZIP compression on your website.

How to monitor the performance of my WordPress website?

Monitoring the performance of WordPress websites can help you identify any issues that may slow down your website. This can be done using tools such as Google PageSpeed ​​Insights, GTmetrix, and Pingdom. These tools can provide you with detailed information about website performance, including loading time, page size, and number of requests.

The above is the detailed content of The Complete Guide to WordPress Performance Optimization. For more information, please follow other related articles on the PHP Chinese website!