However, it should be kept in mind that, a performing website comes with its own sacrifices. As ultimately, a web page must constitute the core values it has been built upon, even if it comes short on some performance tweaks. In order to provide a very easy to use webpage with effective user experience, the page must be built to resonate with the requirements of the end users. Here is a list of few factors to consider if you want to boost your website performance:
1. Time to First Byte (TTFB)
The TTFB is used as a measurement to indicate the responsiveness of a web server. It is essentially the time taken by the browser to start receiving information after it has requested it from the server.
A website’s TTFB is calculated by the following ways:
HTTP request time + Process request time + HTTP response time
Your TTFB can be accessed easily by using our web performance analyzing tool.
For easily bring down the overall TTFB you can use a Content delivery network (CDN) and increase the load speed of your website.
2. Critical Path
The speed of page load time also depends upon what might be blocking the Document Object Model (DOM). A blockage of DOM will result in slow page loads. The render blocking resources; such as HTML, CSS (this can include web fonts), and Javascript are responsible for slow loading.
You can prevent the CSS and Javascript from blocking the DOM by optimizing the critical rendering path. The following steps can be used to reduce page loads:
In Javascript; You can use the following best practices:
Use the defer directive or async to avoid render blocking.
JS files can be concatenated into a single file even though with HTTP/2 this is no longer as important.
By moving the scripts to the bottom of the page right before your tag.
Minify your Javascript by removing any extra spaces, characters, etc)
By Inline your javascript if its small.
3. Domain Name Prefetching
DNP is an effective solution to resolve domain names before a user visit the link. Prefetching eliminates roundtrip latency and saves time for users by pre-connecting the browser to set up early connections by sending HTTP request to the server for connections such as DNS Lookup, TCP Handshake, and TLS negotiation.
4. Render Blocking Resources
The speed of a web page also depends upon what might be blocking the Document Object Model (DOM), that causes delays in page load times. The render blocking resources such as HTML, CSS (this can include web fonts), and Javascript should follow best practices.
The following are some recommendations on how to prevent CSS and Javascript from blocking the DOM by optimizing the critical rendering path.
In CSS
Call your CSS files properly
Concatenate the CSS files into one file
Use media queries to mark some CSS resources as non-render blocking
Minify Your CSS by removing extra spaces, characters, comments, etc
5. Number of HTTP Requests
When your browser fetches data from a server it does so use HTTP (Hypertext Transfer Protocol). It is a request/response between a client and a host. In general, the more HTTP requests your web page makes the slower it will load.
There are many ways you can reduce the number of requests such as:
Inline your Javascript, if it is very small
Using CSS Sprites
Minimise assets such as 3rd party plugins that make a large number of external requests
Don’t rely on 3rd party frameworks unless they are inevitable
Combine CSS and JS files
Running our comprehensive analyzing tool, 365andUP will let you know how many requests were needed in order to generate a particular page.
6. Identifying Where Assets Are Delivered From (Latency)
Identification of Latency and how it affects the assets and delivery is a must to check when scrutinizing the web page speed load times. The identification and fixing of network latency culprits consist of a three-step process:
Initial confirmation of latency
Locating the area where latency is occurring
Identifying and eliminating the true source of the latency
A ping test can verify the reachability of devices on a network. Ping test will provide insight on how long it took an ICMP packet to reach its destination and back. A ping test on multiple devices on different network devices and segments can be done and the round-trip times can be used to identify valuable information on network latency. The multiple tests will confirm the latency and it will as well as help to identify what part of the network is experiencing the slowdown.
There are some methods to decrease the ping time:
Decreasing the number of HTTP requests
Gzip Components
Add Expires or Cache-Control Header
Using Content Delivery Network (CDN) by caching website assets on global edge servers (POPs)
Use HTTP/2 by minimizing the number of round trips from the sender to the receiver and with parallelized transfers.
7. Optimising Large Images
Page speed highly depends upon the size of images and text in the page. To increase page speed, the uploaded image must be optimized for higher page speeds.
There are many online tools for optimizing image and among them are:
a. Kraken.io
b. TinyPNG
c. JPEGmini
8. 301 Redirects
Redirects slow down the performance of a website as it generates additional round trip times (RTT) and doubles the time required to load the initial HTML document before the browser even starts to load. So, for better page loads redirects must be avoided whenever possible.
9. Web Font Performance
A research done by HTTP Archive suggests that more than 60% of websites are now using custom fonts than relying on existing fonts like Google Font. Relying upon Google fonts will add extra HTTP requests to external resources and they may also be render blocking.
For better web font performance you can follow these points:
Select only the styles you need and stick to it
Keep character sets down to a minimum
Prioritize based on browser support
Use locally hosted fonts
Store in LocalStorage with Base64 Encoding
10. Fix 404 Errors
It is important to look out for missing links, as it generates a 404 HTTP error when a user browse to it. The 404 errors can be quite taxing on your server, as on an ‘average’ site with an ‘average’ module load, 60-100MB of memory must be consumed from the server to deliver a 404 Error page.
Installing plugins or modules to check for 404 error is not a recommended practice, but external service and online tools can be used to check for errors easily.
There are many online tools like “Broken Link Checker” can be used for this purpose. An occasional check of missing links and correcting it when necessary will ensures that you aren’t wasting any of your server’s resources on missing or broken links.
11. Enable Gzip Compression
Page load times can be boosted by using server level compression tools like Gzip Compression, which can compress Web Pages; CSS, and Javascript at the server level before sending them over to the browser. Whether your website has Gzip Compression enabled or not can be checked with our tool and it will also give insights about compressing the page to increase performance.
Posts
