[et_pb_section fb_built=”1″ _builder_version=”4.9.10″ _module_preset=”default”][et_pb_row _builder_version=”4.9.10″ _module_preset=”default”][et_pb_column type=”4_4″ _builder_version=”4.9.10″ _module_preset=”default”][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]The loading time of a website is the time needed for a browser to load the complete content of that website. So improve website speed.
It is common knowledge that website speed can play a vital role in how a company performs: the longer the website loading time, the higher the chances of users abandoning your website and moving to a competitor’s website. Specifically, data shows that 40% of people abandon a website that takes more than 3 seconds to load, hurting your conversion rates by as much as 7% for every single second delay in page response. Thus, it is essential to improve the website performance by ensuring a fast loading speed for your website.
How to do that, you ask? You are in luck. We have written two articles to explain how to achieve higher speed with your website: in the first one, we will discuss how two popular tools, Nginx and Varnish, can let your website achieve higher speeds, and show and example implementation. In the second one, we will focus on Chinese specificities and make sure your website can achieve higher speeds given the differences in the local ecosystem. But let’s get back to the topic of this article – how do we make a website faster with Nginx and Varnish? Let’s find out.
[/et_pb_text][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]
How to make a website faster?
There are different ways to make your website faster, but generally speeding up a website requires faster content delivery via servers that are nearby to avoid request-response latency. This is especially true for global websites, where multiple servers are necessary to balance the load and serve the content from the closest available location. Balancing load or delivering the content in an optimized manner usually requires complex and expensive solutions. Luckily, Nginx and Varnish let you manage these factors with minimal configuration. How exactly? Let’s find out
[/et_pb_text][et_pb_image src=”https://blog.gotmenow.com/wp-content/uploads/2021/09/how-to-improve-website-Loading-speed-2.jpg” alt=”improve website speed” title_text=”improve website speed” _builder_version=”4.9.10″ _module_preset=”default”][/et_pb_image][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]
1. Improve website speed with Nginx
What is Nginx?
Started off merely as a web server, Nginx is now an open source software with numerous features dedicated to serving content faster and in an optimized manner. Nginx provides services like a web server with load balancing, multi-level caching, performance monitoring, Web Firewall and others. Nginx is known to be powering over 40% of the busiest websites around the world.
[/et_pb_text][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]Nginx started with the goal of creating the fastest web server around the world with all the necessary optimization algorithms implemented within, and maintaining that excellence is still a central goal of the project. Nginx consistently beats Apache and other servers in benchmarks measuring web server performance.
[/et_pb_text][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]Nginx has two variants. The standard Nginx server is free to use and comes with the basic caching and optimized delivery features. Nginx Plus is a premium version with additional features like the firewall and load balancer. Both versions are the best-in-class application servers. Nginx has been used as high-end application delivery solutions for high-traffic and content-intensive websites such as Dropbox, Netflix, and Zynga. Based on the data available from Nginx’s website, as of today over 367 million websites throughout the world, including some of the world’s busiest websites, rely on Nginx and Nginx Plus to deliver their content quickly, reliably, and securely.
[/et_pb_text][et_pb_button button_url=”https://bit.ly/gotmenow-whatsapp” url_new_window=”on” button_text=”Connect With Us” button_alignment=”center” _builder_version=”4.9.10″ _module_preset=”default” box_shadow_style=”preset1″ box_shadow_color=”#0C71C3″][/et_pb_button][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]
How can Nginx improve website performance?
Optimized content delivery is one of the most important requirements when it comes to speeding up a website. One way Nginx can improve performance is to cache static assets within the server cache memory. These static assets include common content like the scripts and stylesheets used by every page, default images like logos and banners and also some static pages. It has been observed that nearly 30 percent of data on the modern web pages are static. Such content should be cached in order to improve the performance of Nginx as a web application server.
[/et_pb_text][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]In addition to caching, one can look into enabling reverse proxy server configuration. A reverse proxy server helps to optimize the delivery by utilizing an additional machine to handle the requests. This machine is connected over a high-speed connection with the main application server that serves only the necessary data. This improves the processing time of the application server and eventually speeds up the website.
[/et_pb_text][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]
Going further with performance optimization on Nginx
But it doesn’t stop here. Nginx can be further optimized thanks to its support of the latest technologies such as:
- Brotli compression: a more advanced compression algorithm than gzip with a descent browser support.
- HTTP/2 Protocol: out of the box HTTP/2 protocol for more low-latencies and parallel HTTP connections
- PageSpeed: a Nginx plugin that will automatically improve performances of your website
Thanks to these advanced features, NGINX is a powerful tool that cannot be ignored when it comes to performance optimization and should be on your to-do list when considering optimizing your website.
[/et_pb_text][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]
What are the drawbacks of using Nginx?
Even though Nginx is one best tool around, the drawback with using its built-in micro cache is the fact that assets cannot be purged from cache individually using a standardized API. Luckily, this issue can be solved by using another tool: Varnish.
[/et_pb_text][et_pb_image src=”https://blog.gotmenow.com/wp-content/uploads/2021/09/Website-speed-optimization.jpg” alt=”website speed” title_text=”website speed” align=”center” _builder_version=”4.9.10″ _module_preset=”default”][/et_pb_image][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]
2. Improve Website speed with Varnish
The performance improvement gained by using micro caching on Nginx can be further improved by using Varnish. This pairing will not only allow you to slightly improve the speed but mostly it will allow you to retain your flexibility when managing the content of your application.
[/et_pb_text][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]
What is Varnish?
Varnish is a web server with caching implemented at its core and an easy-to-implement addition to the previous Nginx setup. It can also be customized to reduce the origin-server load by writing a simple algorithm to manage the server requests. Unlike Nginx, it uses blocking system calls that make it easier to implement caching and configure load-distribution
[/et_pb_text][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]
Varnish has a threaded architecture but avoids using event loops. This is the main reason for choosing it over Nginx when turnaround time is important. With proper configuration and tuning, Varnish has been noted to serve content at very high speed. Another important reason to choose Varnish is the possibility of purging individual resources from the cache, using one of the many open-source libraries available for the different backend platforms. This is not easily doable when using Nginx microcache.
[/et_pb_text][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]
How to Accelerate your Business Digitally during the Global Pandemic
[/et_pb_text][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]
How to properly tune up your configuration?
Although it might seem tough to configure Varnish, with the key performance metrics easily available, Varnish can be easily tuned to perform at its best. In order to fine-tune your Varnish configuration to serve at the optimal speed, there are some factors to look at, most notably:
[/et_pb_text][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]
- Amount of client requests
- Cache hits – The number of times content gets delivered from cache
- Thread metrics – The cycle of thread creation, queuing and success or failure
- Backend metrics – Frequency of failure, hardware health, and CPU consumption
[/et_pb_text][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]
What are the drawbacks of using Varnish?
Due to the fact that Varnish is a specialized software only dedicated to caching, it lacks many common web server capabilities, the most noticeable one being the inability of implementing SSL. Therefore, it does not allow you to use HTTPS protocol. This can, of course, be solved by pairing Varnish with a reverse proxy that acts as TLS termination, in our example Nginx. How to implement this configuration?
[/et_pb_text][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]
[/et_pb_text][et_pb_text _builder_version=”4.9.10″ _module_preset=”default” custom_padding=”||0px|||”]
How to leverage Varnish and Nginx – An example implementation
The following diagram provides an overview of an example implementation with a Chinese user and an International user trying to access the same resources on a website.
In the example we are using a different domain to direct the traffic, however, some DNS services allow to use GeoIP detection to balance the traffic to different servers based on the location so the same domain can be used if the DNS service chosen supports this option.
[/et_pb_text][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]
[/et_pb_text][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]In this diagram, we can see how Nginx acts mainly as a TLS termination (managing the incoming https traffic) and is set as a reverse proxy that sends all the traffic to varnish. In other cases, specific rules (based on paths, parameters, etc..) can be set to redirect the traffic directly to the origin server.
[/et_pb_text][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]As mentioned above both Nginx and Varnish have load balancing capabilities, so multiple varnish servers and nginx servers can be set for the same domain as well.
An additional improvement to this setup can be achieved by using Nginx to fetch data from the origin server before storing the cached version in Varnish, allowing us to do some simple replacements in the content received (for instance URLs of blocked resources) for the different markets, without impacting or having to modify anything on the Origin server.
[/et_pb_text][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]
[/et_pb_text][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]
Improving website speed in China – a different scenario
In China, the scenario of website loading is completely different. China internet regulation is a highly secluded territory of the global network. Numerous APIs including Google-owned APIs are blocked in China and this is a major roadblock in optimizing the speed of a website. Today, nearly 40% of the website around the world are CMS-based and almost every single one of them internally uses JQuery and Google fonts which rely on Google servers for loading. In China, these fonts or scripts are blocked from loading, so the website does not get rendered as expected. Moreover, even for the other third-party APIs, the Chinese network setup increases the loading time to allow the API script to pass through. This eventually leads to poor performance of foreign websites in China.
[/et_pb_text][et_pb_button button_url=”http://www.gotmenow.com/” url_new_window=”on” button_text=”Visit Us” button_alignment=”center” _builder_version=”4.9.10″ _module_preset=”default” filter_saturate=”147%” filter_brightness=”61%” box_shadow_style=”preset1″ box_shadow_horizontal=”11px” box_shadow_color=”#0C71C3″][/et_pb_button][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]In addition to the URL based blocking, China has its own web to manage the DNS data and every request made from China needs to pass through its highly protected firewalls. There is a high probability that the DNS data of certain domains might not be synced in China as the relevant data server might be blocked due to detected illegal activities.
As discussed, it is challenging to speed up a foreign website in China without any potential block. Hence, apart from the conventional techniques like using Nginx or Varnish, one needs to go through several other processes like acquiring an ICP license, getting a hosting within China and optimizing the content for a better delivery within China. These techniques will be discussed in the next article.
[/et_pb_text][et_pb_text _builder_version=”4.9.10″ _module_preset=”default”]
Conclusion
The major factor determining the optimization of a website loading speed lies at its core – the web application server. By correctly implementing and leveraging Nginx and Varnish, a website speed can be greatly improved – however, more techniques should be used when approaching website speed optimization in China. More details on how should we deal with these challenges will be covered the next part of this series.
[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row _builder_version=”4.9.10″ _module_preset=”default”][et_pb_column type=”4_4″ _builder_version=”4.9.10″ _module_preset=”default”][et_pb_post_slider posts_number=”5″ include_categories=”2″ bg_overlay_color=”#0C71C3″ _builder_version=”4.9.10″ _module_preset=”default”][/et_pb_post_slider][/et_pb_column][/et_pb_row][et_pb_row _builder_version=”4.9.10″ _module_preset=”default”][et_pb_column type=”4_4″ _builder_version=”4.9.10″ _module_preset=”default”][et_pb_social_media_follow _builder_version=”4.9.10″ _module_preset=”default” text_orientation=”center”][et_pb_social_media_follow_network social_network=”facebook” url=”https://www.facebook.com/Gotmenownrp” _builder_version=”4.9.10″ _module_preset=”default” background_color=”#3b5998″ follow_button=”off” url_new_window=”on”]facebook[/et_pb_social_media_follow_network][et_pb_social_media_follow_network social_network=”twitter” url=”https://twitter.com/Gotmenow3″ _builder_version=”4.9.10″ _module_preset=”default” background_color=”#00aced” follow_button=”off” url_new_window=”on”]twitter[/et_pb_social_media_follow_network][et_pb_social_media_follow_network social_network=”linkedin” url=”https://www.linkedin.com/in/gotmenow-soft-solutions/” _builder_version=”4.9.10″ _module_preset=”default” background_color=”#007bb6″ follow_button=”off” url_new_window=”on”]linkedin[/et_pb_social_media_follow_network][et_pb_social_media_follow_network social_network=”instagram” url=”https://www.instagram.com/gotmenow_soft_solutions/” _builder_version=”4.9.10″ _module_preset=”default” background_color=”#ea2c59″ follow_button=”off” url_new_window=”on”]instagram[/et_pb_social_media_follow_network][/et_pb_social_media_follow][/et_pb_column][/et_pb_row][/et_pb_section]