Having a site that performs like a digital superhero is a business imperative, especially when you’re making a first impression with a potential customer researching your organization.
The following website performance statistics should strike fear in the heart of every site developer and engineer, not to mention your brand marketing team:
- One in two users will abandon a site if it takes longer than four seconds to load. Source: BBC.
- A one-second delay results in a 16% drop in user satisfaction. Source: LoadStorm.
- Fifty-three percent of mobile site visits are abandoned if pages take longer than three seconds to load. Source: Google.
Perhaps you’ve noticed poor site performance when you check Google’s Core Web Vitals performance metrics, but aren’t sure how to remedy that?
When your business is on the line, you can’t afford to send new business elsewhere and tarnish your brand by having your content management system (CMS) deliver a poor digital experience.
Below we diagnose five common slowdown culprits and how to improve website performance using an agile CMS like WordPress VIP.
First, what actually happens when you load a web application?
It’s a big ask for any browser, which immediately has to kick into high gear, performing a whole host of actions in milliseconds. Here’s the skinny courtesy Mozilla:
- The browser goes to the DNS server, and finds the real address of the server that the website lives on.
- The browser sends an HTTP request message to the server, asking it to send a copy of the website to the client. This message, and all other data sent between the client and the server, is sent across your internet connection using TCP/IP.
- If the server approves the client’s request, the server sends the client a “200 OK” message, which means, “Of course you can look at that website! Here it is.” It then starts sending the website’s files to the browser as a series of small chunks called data packets.
- The browser assembles the small chunks into a complete web page and displays it to you.
Note: Of course, it’s not as easy as all this. There are a multitude of smaller steps between each of these. For now, let’s dive into five key reasons “slowness” happens and how our WordPress VIP CMS mitigates them.
So, what causes a slow browsing experience?
Culprit 1. Lack of PoPs and CDN
More than likely, your business is global. That increases the logistical challenge of ensuring fast, consistent, stable connections for users on a variety of connection types on a variety of devices.
So what does this mean for your application?
When a network request is initiated from Step 2 above, the request goes through multiple network hops. A hop is a computer networking term that refers to the number of routers a packet passes through, from its source to its destination.
As a consequence of these hops from a user’s geographical location to your server, there can be added time experienced by your users during loading. This can be mitigated by serving the content closer to your visitor, via a content delivery network (CDN) and points of presence (PoPs).
The WordPress VIP answer:
WordPress VIP’s CDN is a global network of edge and origin PoPs that serve your site to global customers, as quickly, efficiently, and reliably as possible. This localized availability happens automatically as soon as our edge servers are notified of new content from your application. This means there is no additional configuration to be handled by your team, relieving them to focus on other tasks.
Culprit 2. Unoptimized media
Those high-quality images everyone is shooting today with the latest mobile devices are quite beautiful! That is, until they’re used as thumbnails on your homepage.
Adding a 4K image and limiting it to a 100×100 pixel container means your users have to load the whole 4K image. A single image isn’t much to fret about, but for businesses publishing content at scale, page load can easily explode exponentially the more articles populate an index page.
The WordPress VIP answer:
Applications on WordPress VIP automatically receive all the benefits of edge cached images, and automatic image resizing on uploaded images. Additionally, images can be resized on the fly.
Culprit 3. Unoptimised Javascript and CSS
When loading large files, every bit and every request counts. If you have already optimized the number of network hops taken to download a file, the largest amount of time a file takes to arrive is for the opening and closing of requests.
To address this, modern Javascript and CSS development often uses minification and concatenation.
Minification refers to the removal of all unnecessary characters in a file, normally all unnecessary whitespace. The aim here is to reduce the total number of bits being transferred.
Concatenation is the act of gluing multiple files together to produce one larger file. The aim here is to reduce the number of network requests.
The WordPress VIP answer:
WordPress VIP automatically concatenates JavaScript and CSS files to reduce the number of requests that occur on a single page load. CSS files are minified as well as concatenated. Credit goes to our open-source plugin of choice.
Minified and concatenated files are then cached for 15 days, or until a change is detected.
Culprit 4. Poor cache utilization
Caches are special temporary storage to speed things up. What they speed up depends on the type of cache.
If you are not utilizing a form of caching, you might be seriously impacting your page response speed when your application is under load.
- Object cache—used for storing application level data. This helps retrieve the data quickly and efficiently without hitting your database. In short, object cache prevents extensive computations and/or queries from taking up valuable connection time.
- Query cache—lightweight memory caching of database queries. In WordPress, any post query that utilizes the WP_Query API greatly benefits from this form of caching.
- Page cache—storage for a fully drawn page, stored in each edge PoP location. This is the first level of cache that most users visiting your application encounter. Page cache enables our CDN to serve localized content without your application ever running a line of code.
All of these work in harmony to decrease request response times.
Problem 5. Database connection saturation
When your application’s content and user base grow, those older database queries that were originally performing fine can now degrade performance.
When queries take time to execute, this occupies a seat at the database until the query finishes. Sometimes these seats fill very quickly, subsequently preventing more queries from being executed. This commonly manifests as degraded application performance until the database serves 500 responses.
Connection saturation can occur rapidly and randomly, making the root cause hard to diagnose.
