5 Ways to Improve Your Website Load Time & Performance in 2019
In this day, seconds make the difference. You can no longer allow your website to be bogged down by unoptimized images and files. Your users expect your web pages to load fast, and they won’t stick around if they don’t.
With that in mind, let’s take a look at ways to optimize your website for the best possible performance.
Minimize HTTP Requests
HTTP (Hypertext Transfer Protocol) Requests are counted whenever a browser fetches a file, page, or picture from a web server.
According to Yahoo, these requests tend to take up about 80% of a Webpage’s load time. The browser also limits requests between 4-8 simultaneous connections per domain which means loading 30+ assets at once is not an option.
This means that the more HTTP requests you need to load, the longer it takes for the page to go and retrieve them all, increasing your web page’s load time.
How to Decrease HTTP Requests
While it seems to limit your pages designs by keeping them simple, there are several tactics you can use to decrease HTTP requests to relieve your browser.
- Use queries to only load what's needed - If you find that you only need to load certain images on desktop or need to run a specific script on mobile only, using conditional statements to load them can be a great way to increase speed. This way, you aren’t forcing the browser to load a variety of scripts or images that won’t be useful for certain devices or viewports.
- Reduce the number of images you use - If you find some of your pages are fairly image-heavy, try removing some, especially if their file sizes are big. This may not only help reduce image HTTP requests but may improve your UX by removing distracting images that don’t correspond to your written content.
2. Utilize CDNs & Remove Unused Scripts/Files
More than likely, many of your users will not be in close proximity to your web server.
Reducing this distance by spreading your content across a variety of geographically dispersed servers just isn’t a viable option, and will a bit too complicated to implement.
Servers are selected based upon the user's measure of network proximity. For example, the server with the quickest response time and/or fewest network hops is chosen.
Larger companies tend to own their own CDN, while medium-sized businesses will use a CDN provider such as EdgeCast.
Smaller companies may find a CDN unnecessary or outside of their budget, so using utilizing websites such as CNDjs which has a library of JS and CSS files and frameworks can help you prevent hosting certain files on your own servers while increasing their load time.
If you find your company’s website could benefit from using CDNs, take this time to also evaluate your site to recognize if there are unused scripts or CSS files across your site. [b]
3. Browser Caching
Browser caching allows assets on your website to be downloaded to your hard drive once into a cache, or a temporary storage space. Those files are now stored locally on your system, which allows subsequent page loads to increase in speed.
Static assets have a cached lifetime of at least a week, while third party items such as widgets or ads only last a day.
CSS, JS, and images, and media files should have expirations of one week, but ideally, one year, as any longer will violet RFC guidelines.
You can learn more about enabling caching here.
4. Compress Images & Optimize Files
Images currently take up 60% of the average bytes loaded per page, around 1504KB. When compared to other pages assets such as scripts (399KB), CSS (45KB), and video (294KB), images take up quite a large amount of HTTP requests sent.
As I have mentioned early, remove any images of assets you believe you don’t need. This includes libraries of icons you only use two of, those extra three fonts you thought you might use but didn’t, and images that maybe could be replicated with CSS (such as colored backgrounds or gradients).
After you clear out those assets, take a look at the images you have across your site and check out their sizes. More often than not, many people tend to download images from stock photo sites and upload them to their server and use them without ever bothering to optimize them for the web.
If you find yourself using large images, especially for hero images, run them through an optimization software like Compressor.io or Image Optimizer. Keep all your images below 150KB, nothing above 1920px in width, at an average/medium/72dpi quality level. Any larger and you’ll notice the images loading very late after the page renders as well as the slow response times to user behavior.
When it comes to what file extensions you should use for what, use this as a basic formula:
- SVG is suitable for vector images you want to receive a high amount of detail in.
- Certain icons can utilize font libraries such as FontAwesome to render certain graphics rather than saving out individual images.
- PNG should be used for images you need transparent background behind, such as a circular image of a person or Facebook’s ‘F’ logo.
- JPG is best for photographs or anything where fine detail is less important.
While images will still take up the majority of your HTTP requests, optimizing them and your other assets will ultimately keep the sizes of them down and increase your website's overall performance.
5.Using Apache alternative
Using apache alternative also make your site faster.There was so many alternative but i will suggest you Litespeed because it is the best alternative of apache.It will make your site 10 times more faster.