How to improve your website’s speed?
Abu Thahir
Software Development Engineer skilled at building Intutive User Interfaces and Improving Website performance.
Ever wondered how could Google, Facebook and many more firms be so successful. Well, there may be many reasons for their enormous success like their business plan, benchmarking, innovation, solving pain points, user experience etc. I hope there won’t be any contradictions in including “To be successful, you need to be customer-friendly” in your list of business laws or mantras.
Customers friendliness has a whopping area of scope. You can achieve customer friendliness by improvising minute things and concentrating in many aspects like being so flexible, spontaneous, interactive and much more. But in this Digital Era, Enhancing your site's user experience should be the first and foremost thing on your checklist.
How important is your website’s load time? Increasing your site speed plays a vital role in increasing your site's SEO score as it enhances the user’s experience and improves your site’s conversion rate.
A study conducted by MOZ says if website loading time is more than 5s, 75% of other websites will be faster than your’s and most of the user won't wait and they will just shut you down. Say if google loads more than 10s, we won’t be so patient and we would have preferred some other search engine. If you find my perceptions aren’t convincing, I would be glad if you could refer the below links to explore more.
References :
https://moz.com/blog/site-speed-are-you-fast-does-it-matter
https://moz.com/blog/how-website-speed-actually-impacts-search-ranking
9 Ways to enhance your site's load speed:
- Minimize HTTP Requests - Your site loads faster if they have to wait for fewer HTTP requests.
- Combine all of your CSS into an external file and load it from the <head> section so that the external pages can be cached and it loads faster.
- Use asynchronous or defer function to load javascript files efficiently. Place the <script> tags in the <head> section likewise CSS. It is advisable to place the <script> tags without defer or asynchronous loading at the bottom of the <body>.
- Ensure your images are properly compressed and optimized for the web.
- Use server-side caching to create a HTML page for an URL so that dynamic sites don't have to build a page each time that URL is requested.
- Make utilize of Gzip which will significantly compress the size of the page sent to the browser which can then extract the information and can display it for the user.
- Eliminate 301 redirects wherever possible as 301 redirects force the browser to a new URL and require the browser to wait for the HTTP requests to come back.
- Serving your static contents from a “Cookie-Free” subdomain. To justify, Http request consists of cookies to enhance individual user experience but using cookies for static contents is unnecessary. Eliminating cookies from Http request for Static contents can improve the page speed significantly.
- Last but not least, If your site is capable of attracting a significant amount of global users then Implement a CDN to allow users to download information in parallel that helps your site to load faster. Nowadays, CDNs are becoming increasingly affordable with services like Amazon CloudFront (Thanks to AWS Free tier) and there are many free services like Cloudflare etc.
References:
https://moz.com/learn/seo/page-speed
https://www.reginaldchan.net/serving-static-content-from-cookieless-subdomain/
https://gtmetrix.com/serve-static-content-from-a-cookieless-domain.html
Interpretation of a CDN:
Content delivery networks serve the content of a site to a user based on their geographic locations through its “Distributed Data Centers” across the globe.
An Illustration for What is a CDN
Each Data centers consists of two primary building blocks as follows:
- Points of Presence (POPs)
- Caching Edge Servers
Points of Presence(POP):
PoPs are the data centers distributed strategically using certain efficient algorithms responsible for communicating with users in their geographic vicinity to reduce the number of Hops(Intermediate portions in the traversing path from a source to destination), round trip time by taking the content closer to the site’s user. PoP holds a numerous number of caching servers.
Reference:
Hops : https://en.wikipedia.org/wiki/Hop_(networking)
Caching Edge Servers:
Edge servers are the ones which store and deliver cached files to accelerate website load times and reduce bandwidth consumption. Caching Edge server contains multiple storage drives along with high amounts of RAM resources to store the most frequently accessed items.
The mission of CDN:
CDNs are designed to reduce the latency delay between the moment a request to load a webpage occurs and the moment its content actually appears on your browser’s screen.
Latency delay interval is hugely impacted by the physical distance between your location and the website's hosting server location.
A CDN's mission involves virtually shortening the physical distance to improve site rendering speed and performance.
Portraying the Missions of CDN and a Glimpse of how it is achieved
Source:wpmudev
Working of a CDN:
CDN stores a cached version of its content in multiple geographical locations named PoPs(Points of Presence) to minimize the distance between the visitors and your site's server. Each PoP contains a number of caching servers to deliver the content to visitors within its proximity.
CDN caches your content in many places at once to provide vast coverage to your users. For Eg: when a user in Australia accesses your US-hosted website, the requests will be handled through a local Australian PoP so that the user's requests and your website’s responses need not travel the full width of the Globe and back. This makes the request handling and delivering responses much quicker.
Working of a CDN
Source: keycdn
Rise of CDN:
Almost everyone uses CDN because nowadays over half of all traffic has already been served by CDNs. Those numbers are rapidly ascending year by year. Every one of us interacts with CDNs in a daily basis like when reading articles on news sites, shopping online, watching videos or glancing social media feeds.
12 Reasons to use a CDN:
CDN works by storing a cached version of its content in data centers distributed strategically across the globe which results in:
- Improving your page load speed since your website content will be served from your nearest data centre.
- Availability of your site even when your website hosted server is down since CDN pushes(literally copies) your website’s content to multiple data centers.
- Using Distributed Servers in contrast to a Single Centralized Server reduces bandwidth consumption.
- Handling high traffic by distributing your website’s traffic across multiple caching edge servers.
- Maintaining Load balance between multiple servers.
- Localizing the coverage of your site without more cost.
Source: wpsuperstars
- Routing your traffic to CDN’s DNS aids in blocking spammers, scrapers and other bad bots through their security measures.
- Protecting your website from DDoS attack.
- Modern CDN offers high capacity infrastructures.
- Detailed Usage Analytics of your site traffic, bandwidth usage, etc in each CDN vendors Dashboard.
- Built-in version control to track and revert the changes if necessary.
- Global availability of your content, etc.
P.S : If you find the reasons aren’t satisfactory, We insist you to completely go through the afore mentioned details in this blog or do a scrutiny aside on CDN’s architecture and its working. Understanding the conceptual side of CDN paves the way to find convincing answers to justify why we have listed these 12 reasons.
Cons of using a CDN:
Nothing is Perfect nor Ideal for all cases. Likewise, CDN also has its own imperfections.If you find that there is no need to extend your services globally because the vast majority of your users are from the same region as your hosting then using a CDN globally may seem to be unnecessary. As it can increase the intermediate DNS lookups and introduces another unessential connection point between the visitor and an already nearby server. This, in turn, can end up in increasing your site loading speed which is really a painful thing.
So, in this case, it is more intellectual to avoid using even some free CDNs. But Hosting your website contents in a server near to target user’s country or Configuring a “Cookie-Free” subdomain for serving static contents can be handy for non-global users to attain the benefits of latency boost. To explore more about Cookie-free subdomains, Please refer the links below.
References:
https://www.reginaldchan.net/serving-static-content-from-cookieless-subdomain/
https://www.keycdn.com/support/how-to-use-cookie-free-domains/
https://www.gulshankumar.net/serve-static-content-from-a-cookieless-sub-domain/
https://www.ravelrumba.com/blog/static-cookieless-domain/
Implementing a CDN:
CDN architecture and implementation differ from one vendor to another. We took an initiative to get our hands dirty on CDN for a Sample Blogging Site with hefty images, CSS, js libraries and built in Wordpress platform.
Enabling Cloudflare CDN for your site is pretty simple, you should add your site in your registered Cloudflare account. Once your site is added, CloudFlare gives you their name servers(ns1.cloudflare.com) and proceed to modify your root domain DNS configurations (e.g., domain.com) and those of your subdomains (e.g., www.domain.com, img.domain.com) so that it should be the default inbound gateway for all incoming traffic.
Please visit https://support.cloudflare.com/hc/en-us/categories/200275218-Getting-Started to get detailed step-by-step instructions for implementation.
In general, In your root domain change an A record to point to one of the CDN's IP ranges. In each subdomain, modify its CNAME record to point to a CDN-provided subdomain address (e.g., ns1.cdn.com). These results in the DNS routing all visitors to your CDN instead of being directed to your original server.
If this sounds weird, you need not worry because CDN vendors offer step-by-step instructions throughout the activation phase. In addition, they provide assistance via their support team too.
Performance Analysis:
We were delighted to witness the enhancement achieved in “Fully loaded time from 18.0s to 9.5s” after implementing CloudFlare cdn in our sample blogging wordpress site. Though we improved our paged speed drastically, The scores may seem poor because we did not implement any other optimisation techniques mentioned earlier (click to explore) other than CDN.
Report generated for a sample wordpress site without CDN and no other optimizations
Report generated for a sample wordpress site with Cloudflare CDN only and no other optimizations
P.S : Page load speed and score are subjected to change based on certain things like their web hosted server, technology used and implementation etc.
In conclusion, Every business owner eagerly anticipates that their site can land them on cloud nine at any moment, I mean your site can attract plenty of users in a short span which undoubtedly gives you the best feeling. But rather than enjoying, there may be something worrying. Though your site has a good number of views but there might not be any conversions or leads for your business.
Heartbreaking right ?. The Business of business is to make money, make profits and being keen to attract leads and conversions by showcasing your stuffs. Using a CDN efficiently can be really handy in enhancing your site's SEO score which in turn can improve your conversions rate. I hope my perception is convincing and making sense.
Indeed It is advisable that your site should be prepared to counter huge amount of traffics. Using a CDN can split your website traffics and bandwidth usage across multiple edge servers as explained earlier.
Come On, Don’t hesitate to invest your time and penny in implementing a CDN for your site which is capable of attracting a good global traffic. Let's kick start using a CDN, it can turn out to be a worthy try.
Creating a Digital Lending Infrastructure for a Seamless Fintech Ecosystem | Co-founder - CloudBankin | Fintech Enthusiast | CloudBankIn | Loan Origination | Loan Management | Digital Lending
7 年Detailed article. Great work Abuthahir Sulaiman