contact us

Let's get in touch. Have a question or just simply want to say hi? Do not hesitate to contact us.

get started

Need a website done? Let's get started today. We will get back to you with a quote.

Let's get in touch

Have a question? Send your message and we will respond promptly.

Thank you!

Your request has been successfully delivered to our team, we will get back to you as soon as possible.

Error

Sorry, there has been an error with the message you sent. We will investigate this issue as soon as possible. If this error continues please contact us directly through support (at) nilead (dot) com.

Ready to get started?

Nilead provides high-end web design, development and management service.
Need a new website project done? Provide us with some initial information and our team will get back to you as soon as possible.

Can you tell us your requirements?

Tell us about your website project's ideas and requirements.

For example:
I need an img/video gallery to show my projects
I need a product listing section and a checkout system similar to abc.com website

Do you have any preferences?

Feel free to list a few websites you admire in general or for a specific design/feature. Provide specific URLs and description.

For example:
http://nilead.com - I like their blog layout

Thank you!

Your request has been successfully delivered to our team, we will get back to you as soon as possible.

Error

Sorry, there has been an error with the message you sent. We will investigate this issue as soon as possible. If this error continues please contact us directly through support (at) nilead (dot) com.

How to speed up your website loading

By Vu Nguyen

May 7, 2017

Users are extremely impatient, they do not want to wait for a slow website to finish loading. If a user is looking for something and the website loads too slow, he/she will immediately go to another website as there are so many alternatives and options out there. Even if your website has something that others don't which force the users to stay on the site, he/she will spend less time navigating your site if the loading speed is too slow. A slow loading website will also affect your website search engine ranking, as Google gives higher ranking to fast loading websites.

Each time you open your browser and key in an address to the address bar, the browser (your machine) will have to connect to the server, (the machine that hosts the website you want to visit) download the webpage content, parse the downloaded content then render the everything to display on the view port.

Let's take a look at the round trip from browser to server:

Each request from the client (browser) server includes 3 main steps:

Client (browser) sends request to server

Server processes client request

Server sends response to server

Once the browser completes downloading the web page, it will have to parse the content (in code) to display for you.

Let's have a look at a sample web-page request and see how the browser parses and processes the request:

As you can see, each web page request may require more than round trip to the server (each image, stylesheet, javascript file is a request to the server).

Now that we know how a web page is downloaded, processed and rendered, we can see that there are several factors that affect the loading speed:

Connection between the server and client is too slow

Server takes too much time to process one request

There are too many resources to load for each web page request

The website code is not optimized (inefficient HTML, Javascript and CSS code)

If you believe your website has a loading speed problem, first you need to determine which factor is affecting the loading speed.

I. Use traceroute to troubleshoot your website loading speed

Traceroute is a command-line tool included with Windows and other operating systems to troubleshoot and understand connection problems. You can use traceroute to determine if the connection from your machine to the server is too slow and why.

Now that you have used traceroute to troubleshoot your connection to the server, you may find out that your machine has to go through a lot of hops to get to the server, and some of these hops may have extremely high latency. Before you do anything, take note that it's not important that your connection to the server is slow or not, it's important that your client's connection to the server is fast.

If your target audience is in the US for example, then you should traceroute from a US based machine. If your website serves a global audience, you may want to prioritize the markets that have the major share.

To fix the latency issue, first, check if the problem is with your hosting/server. It could be that your website is hosted on a server or data center with limited in/out connection. In this case, it's best to move out to a faster server/data center.

The second most common issue is the distance between the client machine and the server forcing the request and response to go through too many hops. For example, if your server is located in the US and your client comes from China then he/she will have to jump through lots of hops before reach your website. You may decide to move to a server closer to your clients, or use CDN and various other techniques to mirror and serve your clients from a closer location. We have written a very detailed article regarding choosing the best hosting for Vietnam based websites, you can use it as a reference when making hosting decision for other markets as well.

Currently, Nilead can host your website on several data-centers around the globe, simply let us know your major markets and we will host your website from the best location. In the future, we will soon implement smart DNS routing that allows your website load amazingly fast from anywhere in the world without any configuration on your side.

II. Optimize your website assets (HTML, Javascript, and Stylesheet)

HTML (HyperText Markup Language) is the most basic building block of the Web. It describes and defines the content of a web-page. JavaScript is a programming language that is run by most modern browsers, it is often used to control effects on the web pages as well as user interaction with the web pages. Stylesheet, on another hand, as its name implies, is often used to control the style of the web pages (font, color, layout, etc,....)

Before the browser can render a page it has to download and parse the HTML markup. During this process, whenever the parser encounters a script (Stylesheet, Javascript) it has to stop and execute it before it can continue parsing the HTML. In the case of an external script, the parser is also forced to wait for the resource to download, which may incur one or more network roundtrips and delay the time to first render of the page.

To optimize assets, there are 3 main things you can do:

Reduce the total size of the assets (by minifying and gzip)

Reduce the number of asset requests (by combining multiple assets into one)

Optimize the code quality of your assets (good coding and bad coding can give the same final rendered layout, the later however can make the website loads many times slower)

You can also utilize the new html5 src-set and size attribute to serve the most optimized version of each image for each display device, CloudFour published a series of articles which talks about src-set and size in details.

III. Optimize your website images

Image loading is one major and most common factor that affects the site's loading speed. Since the invention of smartphone and readability of the digital cameras on smartphones, capturing moments and sharing them on the website have never been easier. The cameras available on smartphones are being improved every day giving higher quality images which have the side-effect of being bigger in sizes. Most users do not realize this and post the images directly from their smartphone or digital camera to the websites without realizing these images can be too huge for the websites. In most cases, web visitors do not need the high-quality images that the digital cameras provide by default. In fact, you can reduce the size of these images more than 10 times without the normal users noticing anything different.

While Nilead CMS will always attempt to optimize your uploaded images, we strongly recommend that you pre-optimize manually before uploading them. The rule of thumb is to make the image size as small as possible without losing the quality (total size of each image should not be more than 2 MegaBytes)

IV. Optimize your web server (backend) code

This is a bit harder to do as it requires the deep knowledge of how the server and the backend code which renders the web-page work. This is what Nilead team is constantly working on each day, improve the website overall performance and silently applies these new updates to the Nilead Platform that powers your website without you having to do anything. We understand that the website loading speed directly affects your business bottom line and we take serious effort in optimizing this from the initial website design to every feature we implement in the system.

about the author

Vu Nguyen

Vu Nguyen is an entrepreneur, a developer, and a founder of nilead.com. While his love is in the backend website development work, his experience covers eCommerce (being both a real online store owner and a developer), Search Engine Optimization, UX Design and Content Strategy.

Since 2005, Vu Nguyen has led and directed UX design, full-stack development teams on projects large and small for corporations, start-ups, individuals and more. He was involved in every task of each project, from idea to concept and vision, prototype, detailed design, build and deployment.