Throughout 2016, a lot of the focus has been on responsive design and making sure the website you’re operating or have in development is “mobile ready” or “mobile responsive”. Whilst this is obviously important given the increasing market share of mobile/tablet users in comparison to typical desktop devices – it is not the be all and end all and you should not sacrifice the speed of your website, on any device in order to generate compatibility and pixel perfect rendering across the board.
Load What You Need
Fortunately, if you’re a WordPress user there are lots of plugins on the market to assist with this. Some will cache files as they’re loaded for the first time and some will make sure the code to call the required files is only output on the required pages. If you’re not an experienced developer looking for caching plugins might be the way forward. If you are an adept developer then you should not look to include all calls in your header/footer but you should be calling specific files for specific pages. Or look to caching the whole thing using something server side such as Varnish.
Limit Called Files
Given the benefits of Minifying I’m surprised to see it used so very little. Perhaps people don’t take their site loading time so importantly or perhaps people are unsure of the benefits. Regardless, it’s something you should most definitely be looking at doing if you’re serious about having your website perform.
For those not in the know, minifying is where you remove all of the unnecessary whitespace from your JS or CSS files. New lines, spaces, tabs – anything taking up disk space that isn’t required for the script to function. Doing this can decrease your filesize by 50% in some cases and a 50% smaller file means it loads twice as quick in theory so it’s definitely something worth doing.
Consider CDNs (content delivery networks)
A feature that is becoming more and more common is the use of CDN’s or content delivery networks. These services basically take the load of your own web server and put it on theirs. As a basic example, imagine serving a page on your website that contains 10 images. Those 10 images could be sent off to load from a CDN so when a visitor accesses your site, the only thing you web server serves them is the page itself. All the images then load in the background from a high powered, fast server thus making your whole page load massively quicker and limiting the bandwidth used by your own server.
Lots of web hosting companies partner with content delivery networks from the outset. Web hosting firms such as HostPresto.com have provisions in place that allow them to create high powered bespoke hosting solution that utilise content delivery networks out of the box. That doesn’t mean you need to switch hosts in order to use a CDN, most will work by simply uploading your files to them and changing the paths in your source code but if you want to go beyond basic remote resource loading it’s probably best to host with someone who has the capabilities in place to do so.
If you’re an experienced designer or developer a lot of the above is probably second nature to you. I don’t want to tell you how to do your job or reinvent the wheel by going over old ground. As I say, this article is aimed at those who don’t know the real ins and outs as to how things function and who couldn’t easily spot where a potential issue might arise from. Of course you don’t need to take my word for it either. There are enough tools out there such as GTMetrix who will analyse your site on the fly and tell you exactly where you’re going wrong and how to resolve it.