Performance optimization is not easy. There are many possibilities, and you must test each before deciding which is the best. For example, when working on one of the two sites discussed in this article, you try to use redis as an object cache. Usually this is a good option, but it slows down some pages, causes problems with other pages, and runs out of memory. In this article, I want to discuss WordPress performance optimization mainly from the perspective of CDN based on recent experience. This is not the final guide to optimization or how to set up certain plug-ins. The
Not all solutions work in all locations, but it is important to examine all possible content. Let’s start with the benefits of using CDN. Why CDN? As we all know, CDN is very important because it can improve site performance by providing assets on servers close to end users. However, CDN has two potential advantages. In the first case, the browser only sets 6 to 11 concurrent http \/ s requests for the same browser. This caused interesting problems with the caldera forms site. Because it consists of the redefinition of the parent topic, the sub topic CSS is queued at a very high priority. The
Subtopics, because multiple other JavaScript and CSS files provided by the site are loaded. Loading CSS takes longer. As a result, the layout was adjusted after startup errors on some pages. In this article, we will show you how to use CDN to reduce the number of requests from the same domain. Another potential advantage is that moving assets outside the primary server reduces the load. This is the main advantage of the site optimization project I have worked on recently. Usually, this doesn’t bring much benefit, but we’ve been looking for cheap wins until the site starts other problems that lead to 6-8 seconds of load time. Moving the image to the CDN reduces the server load. With very few operations, the page load time is reduced by 1 to 1.5 seconds. The
It’s great to start CDN for free, but it’s not cheap. You will pay for bandwidth and storage. The free CDN supports JavaScript and some CSS files required by WordPress sites. Using a free CDN in a public library can help reduce costs and increase the likelihood that the files required by the browser have been cached. Caldera forms site redesign uses bootstrap in themes. CSS and JavaScript for bootstrap are provided using jsdelivr. For this file, we used wp\enqueue\u script\/style and CDN URL. The
For libraries loaded from the core, we mixed CDN. My main concern is to ensure that the wrong version of the library is not loaded. To replace the core jQuery with the CDN version, we put it in the Mu plugins directory. Add_action (\
If (! Is\u admin()){
If (is_ssl()){
$protocol = \
}Another{
$protocol = \
}The
\/**@var wp\u scripts $wp\u scripts*\/
Global $wp\u scripts;
\/**@var \u wp\u dependency $core*\/
$core=$wp_scripts-> registered [\
$core_version = $core->ver;
$core->src = \
If (wp_debug){
\/**@var \u wp\u dependency $migrate*\/
$migrate=$wp_scripts-> registered [\
$migrate_version = $migrate->ver;
$migrate->src = \
}Another{
\/**@var \u wp\u dependency $jquery*\/
$jquery=$wp_scripts-> registered [\
$jquery->deps = [‘jquery core’];
}The
}The
}, 11); This will provide jQuery for Google CDN, but you must perform two important tasks instead of logging out of core JavaScript. Do not unregister first, just change the URL. You must use the second jQuery version number loaded from the core. This future proves my script. The
One of the dangerous things I did was remove the jQuery migration. The library will re add functionality that was removed from jQuery. Please delete carefully. Some plug-ins or themes may break. On the caldera forms website of CSS and JavaScript diffusion on multiple CDNs, I began to use keycdn to load JavaScript and CSS in CDNs using Ethernet plug-ins. This is a good plug-in, but only supports one region. As mentioned earlier, one of my goals is to ensure that CSS loading for my subtopics is not delayed. So I want to make sure whether the resources come from less than 6 domains. The plug-in has been stopped because keycdn requires multiple zones. The
My theme and sub themes load most resources in the public CDN, or in the cloudfront CDN built for sharing CSS and images on other caldera sites, there are only five files between CSS and JavaScript in the theme directory, not all. Used to load all pages. Therefore, two areas are set in the keycdn. Two areas are set on the \
Male keycdn will automatically import all files. In addition, the price is reasonable and the setting is very easy. This is great compared to rolling your own CDN using AWS S3 and cloudfront. The only drawback is that the default value is unreasonable. By default, HTTPS support is disabled and automatically redirected to HTTPS. This looks like a mixed content warning that is required to occur. After deploying two CDNs, use the script\u loader\u SRC and style\u loader\u SRC filters to change the URLs of the files in the plug-in and topic directories so that the CDN URL is used when loading. The
First, let’s look at the callbacks used by the two filters. <? PHP
\/**The
*Change cs\/fs URL of CDN
*The
*@Param string $url
*The
*@Return string
*\/The
Function caldera\u moo\u cdn\u filter ($url){
$theme\u dir = untrailingslashit (wp\u content\u URL). '\/ theme
If (0 = = = strpos ($url, $theme\u DIR)){
Return str\u replace ($theme\u dir, ' https:\/\/cfdotcomthemes-6081.kxcdn.com ', $url);
}The
$plugin_dir = untrailings
