TTFB
Category: Design
What is TTFB?
Time To First Byte (TTFB) is a performance metric that measures the time from the moment the user's browser sends an HTTP request, to the moment it receives the first byte of the response from the server.
TTFB is a fundamental metric that affects all subsequent page loading metrics and is critical for overall user experience.
What does TTFB include?
- 1
DNS request
Resolving the domain name to an IP address
- 2
TCP connection
Establishing a TCP connection with the server
- 3
TLS handshake
For SSL/TLS encrypted connections (HTTPS)
- 4
Server processing
Time for the server to process the request
- 5
First byte
Receiving the first byte of the response
Why is TTFB important?
Fundamental metric
TTFB sets the foundation for the overall page loading time
SEO impact
Google takes TTFB into account as a ranking factor
User experience
Fast TTFB creates a sense of immediate reaction
Business metrics
Good TTFB leads to a lower bounce rate and higher conversion
Standard evaluation of TTFB:
Good <= 200 milliseconds
The server responds quickly and provides excellent user experience
Needs improvement - 200 - 500 milliseconds
There is noticeable delay in the server response
Weak > 500 milliseconds
The server responds slowly and needs significant improvements
Components of TTFB:
Network delay
DNS Lookup
Time to resolve the domain name
- Good: < 50ms
- Bad: > 200ms
TCP Connection
Time to establish a TCP connection
- Good: < 100ms
- Bad: > 300ms
Server delay
Request Processing
Time to process the request from the server
- Good: < 100ms
- Bad: > 500ms
Response Generation
Time to generate the response
- Good: < 50ms
- Bad: > 200ms
Common causes of bad TTFB:
Geographical distance
Problem: The server is too far from the users
Solution: Using CDN, servers in different regions
Slow hosting
Problem: Shared hosting with limited resources
Solution: Moving to VPS, dedicated server or cloud hosting
Unoptimized database
Problem: Slow SQL queries or lack of indexes
Solution: Database optimization, caching queries
Неефективен сървърен код
Problem: Poorly written backend code or inefficient frameworks
Solution: Code optimization, choosing efficient technologies
Missing caching
Problem: Every request is processed again
Solution: Implementation of caching at different levels
Large resources
Problem: Too large HTML responses or many dependencies
Solution: Minimizing responses, optimizing resources
Techniques for optimizing TTFB:
Infrastructure optimizations
- Using CDN for static and dynamic content
- Geographical placement of servers near the users
- HTTP/2 or HTTP/3 for more efficient connections
- Quality hosting with enough resources
Server optimizations
- Caching at server level (OPcache, Redis, Memcached)
- Gzip/Brotli compression for reducing the size of responses
- Optimization of web server (Nginx, Apache configuration)
- Database optimization and indexing
Code optimizations
- Efficient backend code and algorithms
- Minimizing dependencies
- Asynchronous processing of non-critical tasks
- Preloading resources
Network optimizations
- DNS pre-resolution
- Pre-connection (preconnect)
- TCP optimizations
- TLS 1.3 for faster handshake
Tools for measuring TTFB:
- Chrome DevTools Network tab shows TTFB for each request
- WebPageTest Detailed tests from different locations
- Pingdom Tools Online tool for analyzing performance
- GTmetrix Comprehensive analysis of performance
- cURL commands For quick tests from the command line
Good practices for TTFB:
- Regular monitoring of TTFB - use automated tools
- Test from different geographical locations
- Optimize the critical path - focus on the main page and key paths
- Use caching at multiple levels - browser, CDN, server, database
- Minimize blocking operations in the server code
- Avoid too many redirects
- Optimize images and static resources