How to improve website performance?

One of the most important considerations of building websites is to make sure they load quickly. Before you begin to optimize your site(s), it´s important to see how well they are functioning. If you wish to reduce the load times on your server, decrease the number of HTTP requests, and go that extra bit for your visitors, there are a few techniques that you can use. So, let’s look them -

Use HTTP/2

HTTP/2 is the latest version of the HTTP protocol and provides some great enhancements that will not only help improve your JavaScript performance but will also help speed up your site in general. HTTP/2 uses multiplexing, therefore allowing multiple requests and responses to be sent at the same time. If you haven’t moved to HTTPS yet, be sure to do so as soon as possible to take advantage of the performance improvements that HTTP/2 has to offer.

Optimize images

The most important site optimization is to reduce the size of your images. Images can be displayed at any size, but it firstly loaded, then resized. This wastes computing capacity because images are only reduced after loading. The solution is to ensure your images in the desired dimensions as 1920x1280 pixels, the optimal file size under 350 kb, and compress your images. This single step can do more for website speed optimization than anything else you do.

CSS amalgamation with PHP

Web developers often split up CSS between several separate files to keep a logical separation and to make modifications easier. However, this increases the number of requests to the server, resulting in a slower page load. Using some PHP you can have the best of both worlds - keeping multiple files on your end, and using one request to retrieve all of them.

Stripping whitespace from your HTML and CSS

Many people use large amounts of whitespace when writing code. The good news is that whitespace in PHP doesn't actually get sent to the browser. However, it does in HTML. Browsers tend to only display one space no matter how many tabs you use in your code. This means that there is some wasted bandwidth. However, with some simple PHP, you can remove this bandwidth leeching whitespace.

Caching in your PHP Scripts

In this part, you will know how to 'retrofit' caching into your scripts. The aim is to speed things up by not having to regenerate the data every time someone requests a file. Generating the content every request is just a waste, especially on static data such as our CSS. To add caching you need to add three things to your script. Firstly, you have to collect the data input to the script and generate a filename unique to that set of inputs. Secondly, you have to look for a cache file and see if it is sufficiently recent. Lastly, you have to either use the cached copy or generate new content and cache it for next time.

Minify HTML, CSS and JavaScript

To minify HTML, check out HTML Compress. For JavaScript, use YUI Compressor, and for CSS, test out CSS Compressor. A fourth option is to make use of the PageSpeed Insights Chrome Extension to create an optimized version of your HTML code. The PageSpeed Insights page also lists other programs you can use.

Make CSS and JavaScript External

Using external files will generally make the pages load faster because JavaScript and CSS files are cached by the browser. Alternatively, if you use CSS in a web page, place the CSS in the HEAD element. This makes the page appear to load faster and it can do so progressively. With JavaScript, move the scripts to the bottom of the page.

Eliminate Duplicate Scripts in a Web Page

This issue might seem strange but it is actually quite common. Duplicate JavaScript and CSS files degrade performance by creating unnecessary HTTP requests and wasted JavaScript execution. It's also important to check and see if scripts have been duplicated in external files, as well. To avoid this problem is to use a script management module with your templates.

Spread your static content with CDNs

Because the location of the user impacts page load speed, spreading your content across servers will speed up this process. You can use a content delivery network (CDN) to make this happen. It’s just a collection of servers that exist at different places in the world. CDNs do two things - Cached files are sent from locations that are closer to the specified user and CDNs deliver content that is without cookies. No bloated files. The CDN allows your site’s visitors to load data from their nearest server. If you use a CDN, your site’s files will automatically be compressed for rapid delivery across the globe.

YSlow

This Yahoo tool grades a web page based on rules for high-performance pages gives you a summary of a page’s components shows you stats on a page, offers performance analysis tools like Smush.it and JSLint, and then gives you a summary of what you need to do to improve your page performance.

Page Speed Insights

Page Speed Insights allow you to test the page speed of any website. This is Google’s slick tool for web developers to help improve your website performance. With a simple drop of a URL into the text box and a click of a button, you’ll get your report. Suggestions for performance are broken down into high, medium, low and experimental priority.

Assess loops carefully

Loops are habitually used. They are powerful programming tools, but they can frequently cause bottlenecks. One slow operation executed once is one problem, but if this sentence is inside a loop, the problem is magnified. So, you need to assess your loops carefully, especially nested loops, to avoid possible problems.

Reducing Your redirects

While 301 (permanent) redirects are preferable to 404 errors (broken links), they’re still not ideal as they slow down the time it takes for the browser to reach the correct version of a page. If you’re using a PC, you can also use Xenu Link Sleuth, which is a great tool for crawling data from websites.

Beware of Database Access

This is probably the main source of performance problems. The problem with the performance of a site is due to the database access, without inspecting the code. Database connections are expensive operations, especially with languages such as PHP, mainly because of the lack of connection pooling. The most important practice here is to check your database indexes. SQL queries using wrong indexes can significantly slow down an application's performance. Checking on database indexes cannot be done only once. You must take into account that as your data grows, indexing may change. And use prepared statements.

Fix the broken links

Every time you try to send someone to a page that no longer exists on your site, it causes your server to deliver a 404 page. Essentially this means that it looks for the page, gets a not found message, and they must retrieve a custom error. Each one of these server calls can slow you down.

 

There are many things you can do to improve the performance of your web pages. Some solutions might be simple, while others can be time-intensive. Like each time you are getting ready to implement a new plug-in, code or rich media to get your website richer and cooler. Sacrificing site speed to have the newest tool is probably not worth the money you may lose because of latency issues. So, until a tool proves itself as a money maker, it’s probably best to hold off. Still, implementing them is important. Hope these tips with your best practice will help you to make your website richer, cooler, and faster. Thank you!