10 Tips For Developers To Speed Up Websites

10 Tips For Developers To Speed Up Websites

The easiest way is to reduce HTTP requests, which can be done through front-end development.    Thursday, October 30, 2014:  Web developers are often asked to optimise performance and loading speed of a website and if the developer is not acquainted to some basic tricks and tips, then this job may become slightly difficult. The easiest way is to reduce HTTP requests which can be done through front-end development. There are some other steps too like web hosting, installing the right web server, HTTP caching and so on. Let's discuss all the tricks in detail here. 1. Good Web Hosting: Choose a dedicated server or shared hosting environment for the website. If you use shared hosting it means you will share the computing resources with other websites and don't have full control on the server. But if you use a dedicated server then it may cost you more but you can gain full control o the server. Web hosting impacts speed of website a lot so choose the right web hosting to speed up your website. 2. Caching: If a dynamic content management system is used in your site then the site must be built from PHP code and database queries. It can slow your site down. If you allow caching, then it stores a copy of the pages on the server's hard drive so that they cannot be recreated time and again. Developers can use W3 Total Cache like caching plug-ins for CMSes. 3. Use Correct Web Server: While the most common server side language used for websites is PHP and the most used web server online is Apache. But you can opt for alternatives like Nginx. Apache is a process based server but the alternative is an event based web server. It serves static files in faster way and also consumes less memory. So to speed up your website you should consider using the best web server all the time. 4. Minification: Web servers contain lot of content in JavaScript and CSS scripts which are not necessary. You can use minification to remove all the unnecessary code from scripts and reduce their sizes too. There are several tools which allow minification. 5. GZIP Compression: Modern browsers are usually capable of decompressing Gzipped files. Compression can reduce the size of HTML files and if your website is built on Wordpress then you can use W3 Total Cache for the setup of compression. The most commonly used compression options are deflate and gzip. These tools reduce around 70 per cent of the response size. 6. Minimize HTTP Requests: This is the best way to ensure that a webpage loads in the fastest way possible. Reduce HTTP requests by combined files. When you build a website there are some JavaScript plug-ins and CSS files which can be combined into a single JS file. Developers can also get help from CSS Sprites to reduce requests for images by combining images into a single one. Another emerging technique is Inline images which uses data to embed image into actual page. It increases HTML document or CSS file size and of course reduces HTTP requests. The last technique is supported by modern browsers only. 7. Image Optimisation: Images often cause biggest bandwidth use for a website. Developers can get help from several techniques to reduce their size and improve download efficiency. The tools include Smush.it which is a Yahoo generated tool and it optimises image sizes by removing unnecessary bytes. Developers should also resize images correctly before putting them on the server to ensure that no unnecessary bandwidth is used. Developers can also use image sprites which combine a page's images into a single file and use CSS to select the area where the image can be downloaded. It doesn't reduce image size but reduce HTTP requests. 8. Stylesheet at the Top, Scripts at the Bottom: It's believed that stylesheet should be moved to the top of a page to load it faster, but it's actually a myth. It just gives an impression of the same as if put at the bottom, then a blank screen appears. But if put at the top, then it may allow progressive rendering in several browsers. Scripts can also be moved to the bottom of a HTML document. 9. Content Distribution Networks: Developers should use content distribution network to distribute a site's static content around the world. If CDN is used, then the content can be loaded from nearby locations and it also reduces the load on the home server. It prevents bottlenecks and reduces bandwidth usage. A number of CDN services are available among which CloudFlare is well recommended which is free and easy to configure. 10. Correct Placement Of JavaScript and CSS: Last but not the least, place CSS at the top of a page in the HEAD section and JavaScript at the bottom, in order to maximise the efficiency of page loading.