WordPress speed optimization is key to web performance and which from the client point of view is measured as the page load time. This is the lapsed time between the moment a user requests a new page and the moment the page is fully rendered by the browser. Fast web pages render progressively. That is, they display their content incrementally, as it is loaded by the browser. A web page that renders progressively gives the user visual feedback that the page is loading, and gives the user the information they requested as soon as it is available. Google® and Yahoo® both suggest best practices to make web pages render progressively, such as putting style sheets in the document head.
Site load times can also carry a heavy neurological burden on the user.Quick access to site content is critical to drive a positive user experience.Studies show that heart rate increases 38 percent with mobile content delays. And during video re-buffering, stress levels rise from 19 percent to 34 percent.
With ecommerce, the peak of frustration is most prevalent during the browsing and checkout phases. In fact, users can experience frustration peaks of up to 26 percent at critical points in a transaction.
Slow sites also affect our ability to concentrate — studies have found that we have to concentrate 50 percent harder when using slow websites.To avoid making the user feel stressed, anxious, or unable to concentrate, which can all ultimately damage your brand’s reputation and bottom line, let’s now look at the key aspects of word press speed optimization.
Structure of a web page
Here,s the reality.
No matter how efficient our XHTML optimization and HTTP compression, the greatest improvement in web page performance that we can expect from XHTML optimization will be less than 50%. For a 300K home page, on average, we’ll still need to download at least 150K of EOs, even after optimizing and compressing our textual data. We can see why it is important to optimize our entire web page, including multimedia, in order to make significant performance gains.
A lean site without all the unnecessary clutter is key to optimization.Here are some simple things to you can do to optimize your site to make it run faster.
The Website Speed Test
First thing’s first, you’ll want to test the speed of your site to get an accurate diagnosis of its current performance. To test the page speed and performance of your site try Page speed insights by google. Page speed tests your website and gives you a detailed analysis of how your site performs. From there, the application provides actionable recommendations you can use to make a significant and measurable impact on your website‘s speed and your business.
You can test any page of your site with Page speed insights and it’ll give you key metrics and actionable data to help maximize your site’s performance.
Here are just a few other things you can do to speed up your site.
1. Reduce the file size of html documents
A clear way to improve the load time of your site is to decrease the file size of your HTML documents. There are several ways to do this, from rigid compression to acupuncture-like ID and class name changes. HTML – as opposed to XHTML, even when delivered with the MIME type text/html – allows authors to omit certain tags. According to the HTML 4 DTD, you can omit the following.
For example, if you have a list of items marked up as List item , you could instead just write List item. Or instead of a paragraph that you’d usually close with , you could just use My paragraph. This even works with html, head, and body, which are not required in HTML. Omitting optional tags keeps your HTML formally valid, while decreasing your file size and making your code look much leaner. In a typical document, this can mean 5-20 % savings.
2. Properly include style sheets and scripts
Typical web pages spend 80-90% of their load time waiting for the network. A powerful technique to reduce the amount time spent blocked on the network is to get rid of patterns that cause some browsers to serialize resource downloads.
Downloading an external script file is somewhat unique because it causes popular browsers to block subsequent downloads until the script has completed. This is in stark contrast to downloading images which may occur in parallel (up to a limit).
Inline script tags, even though they don’t download anything, will prevent subsequent resources from downloading in parallel with a CSS file. So, if you have an external CSS file be sure not to insert inline script tags between your CSS file and the next downloadable resource.
7. Remove Unused CSS
CSS files contain rules that apply style attributes to elements in a web page. If a rule does not apply to any element in a page, removing it will result in fewer bytes being sent to the client, with no change in the appearance of the web page. However, because external style sheets may be included by more than one page, you must be careful to only remove rules that no page uses.
8. Leverage HTTP Caching
When you set the correct HTTP caching headers, you get a double win because revisits to your web pages load faster and there is less load on your web server. The cache, which is local copies of resources, works because many resources change infrequently. When a browser can reuse a local copy, it saves the time to set up a connection as well as the time to download.
The key to making the cache work effectively is HTTP caching headers, which are sent by the web server to specify how long a resource is valid and when it last changed. The HTTP protocol gives two ways to define how long a resource is valid: the Expires header and the Cache-Control: max-age header. The Expires header specifies a date after which a resource is invalid. At that point, the browser will ask for the resource again. max-age works much the same way but it specifies how long a resource is after it is downloaded instead of giving a specific date. That is nice because you can configure your web server with a constant value.
9. Minimize Browser Re flow
Reflow is the name of the web browser process for re-calculating the positions and geometries of elements in the document, for the purpose of re-rendering part or all of the document. Because reflow is a user-blocking operation in the browser, it is useful for developers to understand how to improve reflow time and also to understand the effects of various document properties (DOM depth, CSS rule efficiency, different types of style changes) on reflow time.
Sometimes reflowing a single element in the document may require reflowing its parent elements and also any elements which follow it. The best practices cover many of the steps involved in page load time, including resolving DNS names, setting up TCP connections, transmitting HTTP requests, downloading resources, fetching resources from cache, parsing and executing scripts, and rendering objects on the page.
Essentially Page Speed evaluates how well your pages either eliminate these steps altogether, parallelize them, and shorten the time they take to complete.
10. Compress Images
Back in 1995 the average page was 14.1 KB in size. Today the average page size is more than a whopping 2 MB. Images comprise more than 60 percent of a page’s size.
image files are often created with extra information embedded in the file. For example, JPEG files written by many image programs include the name of the program that wrote them. PNG images can often be made smaller by changing the way the image is encoded. These transformations are lossless. That is, the compressed image looks identical to the uncompressed image, but uses fewer bytes.
Large images can be a culprit to slow site performance. To reduce the page size of your site, it’s important that you compress your images before uploading them to your site.
The difference between a 2 MB page and a 1 MB page can mean several precious seconds added to a page’s load time.
Try using a plugin like WP Smush to reduce the file size of jpegs and pngs, which will help remove any extraneous metadata that might be taking up unneeded space.
11. Turbocharge Performance with CDN
The geographic location of a site visitor can impact how fast your site’s content reaches them. A content delivery network (CDN) is a proven way to get lightning fast loading results by reducing bandwidth usage. CDNs provide a shorter connection distance from the server to the source, resulting in faster page load time. With cloudfare, you get a blazingly fast CDN that stores your site’s content globally for faster load times and for free!
12. Identify Plugins that are slowing you down
A hefty amount of installed plugins could be detrimental to your site’s performance. Determine which plugins (if any) are slowing down your site by running a test on how they impact page loading time. Tools like P3 can assist with this task..
13. Reduce Post Revisions
In WordPress, post revisions allow you to undo changes and restore posts to an older draft. Over time the revisions build up and can affect the overall performance of your site.
To limit the number of post revisions, add this statement to your WordPress wp-config.php file: define(‘WP_POST_REVISIONS’, false); “False” will turn off all revisions.
You can replace this with the maximum number of revisions you’d like per post: define(‘WP_POST_REVISIONS’, 5);
14. Choose a Hosting Platform that meets your needs
The hosting provider you choose will have a major impact on website speed.Here at Viralify, we rely on Google cloud platform for lightning fast results.
Summing it up:
The best practices of website optimization are grouped into six categories that cover different aspects of page load optimization:
i. Optimizing caching — keeping your application’s data and logic off the network altogether
ii. Minimizing round-trip times — reducing the number of serial request-response cycles
iii. Minimizing request overhead — reducing upload size
iv. Minimizing payload size — reducing the size of responses, downloads, and cached pages
v. Optimizing browser rendering — improving the browser’s layout of a page vi. Optimizing for mobile — tuning a site for the characteristics of mobile networks and mobile devices
Good luck with your optimization!
Get your website Optimized for Free with any of Viralify,s Growth Hacking Plans.
- Agency Plan – Brand growth hacking Plan for Expanding business with Link Building,SEO & Social management$1,999.00 / month
- Manager Plan – Advanced Growth hacking Plan with Link Building,SEO & Social management$1,499.00 / month
- Assistant Plan – Brand Growth Hacking Plan with Link Building,SEO & Social management$999.00 / month