WordPress Speed Up: WP fine-tuning

WordPress Speed Up can be achieved with a few powerful optimisations. Use these techniques as an inspiration to improve your WP load-time performance.

#1 - Optimize images
Most likely images on your pages are the largest assets from your website that are downloaded by visitors. High-resolution images drastically slow down page speed, wasting server resources and loading time. It is easily achievable to reduce image size without losing its quality. Images containing copyright, or any other author written metadata can be reduced without problems, making them much-much smaller. Optimise all your images from your Media folder, as it can bring a 50%-75% size reduction for nonoptimized images.

#2 - LazyLoad images
You know what goes lovely with your newly optimised images? Exactly some laid-back lazyloading! LazyLoad delays loading of images in long web pages. Images outside of viewport will not be loaded before user scrolls to them. Statistically, images are a whopping 65% of all web content, so page load time on websites can easily become an issue. Even with properly optimized images, size can weigh quite a bit. This has a negative impact on the visitors time, waiting before they can see content on your website.

#3 - Optimize landing pages
Most likely you have several hundred pages in your WordPress. However, only a few a business-critical. These are your landing pages. Optimising these pages should be your primary focus. If you have a big site, with more 1000+ pages, then we recommend a bulk audit, like owl WECRA, to analyze page sizes and loading times easily. Sifting manually with several load test tools in parallel, trough thousands of pages can become a really cumbersome (time consuming and boring) task.

#4 - JS-free Social Sharing
Javascript-free social sharing brings in a significant speed improvement, while the sharing capability feature remains the same. Also, most of them are an all-in-one social media sharing solution, loading their images and JS files from tens of servers, serving the same purpose: maybe somebody will click on them. Reducing the use of JavaScript results in faster loading speeds. It is a good idea to have share buttons at the end of an article. Just make sure, they do the same thing, without extra server calls and slow JS files.

#5 - CSS go up
Any visitors browser has to download the CSS+HTML files, before showing your web page. No matter how big or small your CSS is, your users will have to wait until it downloads to see your page. So....move the CSS into your header. 'Move CSS to header' seeks to reduce the number of times the browser must re-flow the document by ensuring that the CSS styles are all parsed in the head before body elements are introduced. Optimizing the critical render path can take seconds off your page load time. It is really the quickest path to faster web pages. Critical rendering path means a series of events that must take place to render (display) the initial view of a webpage. When you have several external CSS files the browser has to download each one before it can display your page. This causes many roundtrips to get each CSS file which results in your webpage being slow to load. This can be easily changed by combining all the CSS files into a single file.

#6 - Scripts go down
JavaScript is a client based programming language that is executed by your visitor’s browser. The best place to put scripts is at the bottom of your page. So, all your JS files (from your theme, plugins) goes into your footer. Moving the JavaScript files to the footer will allow progressive rendering. Simply stated – the page will appear in front of the visitor’s eyes, even if the files haven’t fully loaded in the background. This will keep the page content from being blocked from rendering… allowing the viewable components in the page to be downloaded as early as possible. If scripts are put at the top of the page (default place), everything in the page that is below the scripts (the entire content of the page), is blocked from downloading, until the scripts are loaded.

#7 - Reduce HTTP Requests
Reducing the external HTTP requests will grant you a significant WordPress Speed Up. HTTP requests are requests that get sent to the server whenever someone visits your website. These requests can contain a variety of information for the server to process and act upon. The most important part of such a request is the URL. Based on this information, the server will try to return a valid response, such as a file. A viable option to speed up your website is by limiting the number of files that load. This is because for every file you try to load, your browser sends a separate HTTP request to the server. Fewer files mean fewer requests and therefore a faster website. Audit your plugins, and decide if they are so important, that they should be present in every page.

#8 - Preload HTTP Requests
Reducing the external HTTP requests sometimes is impossible. You cannot live without fonts or icons or external JS scripts. For these hard times, there is - "Preload HTTP Requests". Preload is a declarative fetch, allowing you to force the browser to make a request for a resource without blocking the page. Preload external resources you have high-confidence will be used on the current page.

#9 - Add Header Expires
Expires headers notify the visitor's browser whether they should request a specific file from the server or just grab it from the browser's cache. When you visit a website your browser is responsible for communicating with the web server to download all the required files. Then it compiles those files to display the web page. As web pages become richer in graphics and content, more and more files are being transferred to your machine from the web server. When you request second time the same page (or very similar) the downloadable content is already on your computer, so the requested page can be displayed much-much faster. This cuts loading time several 2-3 folds, so it is vital to benefit from this WordPress Speed Up technique.