PageSpeed

“We have 12 milliseconds for moving every pixel.”
Addy Osmani

User Centric Performance Metrics

User-centric Web Page Speed Performance Metrics

User-centric web page speed performance metrics focus on different verticals that affect the perception of users for the page loading performance of a website. User-centric performance metrics are announced by Google Developers and W3C Web Performance Working Group to organize the concepts that are related to the Lighthouse. User-centric performance metrics involve the relativity of …

User-centric Web Page Speed Performance Metrics Read More »

Web Font Loading Optimize

How to Optimize Web Font Loading Performance with Best Practices

Optimizing WebFont files includes the process of decreasing the size of font files and using only necessary glyphs along with better font-file extensions such as Woff2 instead of TFF or Woff for better web page loading performance. A WebFont file contains stylish glyphs that refer to a letter, numeric value, or a character for a …

How to Optimize Web Font Loading Performance with Best Practices Read More »

Add Expires to the .htacess file

Add HTTP Expires Headers to the .htacess Files

To add the Expires HTTP Headers to .htaccess file and WordPress sites, a code line can be used such as “ExpiresByType image/jpg “access plus 1 month””. Expires HTTP Headers are directives to determine the lifetime of a cached file within browsers’ storage. HTTP Cache is an important factor for page speed optimization, thus using Expires …

Add HTTP Expires Headers to the .htacess Files Read More »

Cache-control HTTP Header

Cache-Control HTTP Response Header

Cache-control is an HTTP response header to determine browser caching time span for a specific web page resource. Cache-control includes a resource’s caching methodology, where to cache, and its expiration date with maximum age (time to live). Cache-control HTTP Header regulates browser caching policies for clients. Examples for Cache-Control Response Header Cache-control example values and …

Cache-Control HTTP Response Header Read More »

If None Match Request Header

What is If None Match HTTP Request Header?

HTTP request header If-None-Match conditions the request. For GET and HEAD methods, the server will return the specified resource only if its ETag does not match the given ones. If the resource’s ETag is not on the list, the request will not be processed. The server needs to return 304 (Not Modified) when the GET …

What is If None Match HTTP Request Header? Read More »

Speed Index

What is Speed Index? How to Improve Speed Index?

Speed Index is a web page load performance metric that shows how quickly elements of a web page become visible. Speed Index (SI) is measured only on the visible portion of the screen. The visible part of the screen, above the head section, affects the Speed Index score with visual progress and visual completeness speed …

What is Speed Index? How to Improve Speed Index? Read More »

Cumulative Layout Shifting

What is Cumulative Layout Shift? How to Optimize CLS?

Cumulative Layout Shift (CLS) is one of the Core Web Vitals metrics and user-centric performance metrics that focus on visual-stability during the entire life span of a web page. CLS is an important term for preventing the layout shifts that annoy users. While reading a text or being about to click a link, if the …

What is Cumulative Layout Shift? How to Optimize CLS? Read More »

HTTP Vary Conditional Request

Specify a Vary: Accept-Encoding Header: Understanding The HTTP Vary Header

The HTTP Vary Response Header is used to indicate which type and format of content are requested from the web site’s server via the browser. This process performed through HTTP Vary Header is called “Content Negotiation”. In the RFC7232 Document, Hypertext Transfer Protocol (HTTP / 1.1), this case is called “Conditional Requests”. Accordingly, when entering …

Specify a Vary: Accept-Encoding Header: Understanding The HTTP Vary Header Read More »

Total Blocking Time Optimization

What is Total Blocking Time and How to Optimize It?

Total Blocking Time (TBT) is a load responsiveness metric that measures the usability of the web page during the loading. Total Blocking Time is an important user-centric performance metric that compares the time amount of non-responsive and responsive time during the rendering phase of the web page. Input responsiveness or the interactivity between the web …

What is Total Blocking Time and How to Optimize It? Read More »

Content Delivery Network

What is the Content Delivery Network (CDN) and Its Importance?

The abbreviation CDN stands for Content Delivery Network. A content delivery network (CDN) is a network of servers in various data centers around the world. It is an excellent opportunity to offer or develop your website or web application worldwide. If you use such a network, your web server connects to a large number of …

What is the Content Delivery Network (CDN) and Its Importance? Read More »

Time to Interactive Definition and Optimization

What is Time to Interactive (TTI) and How to Optimize It?

Time to Interactive (TTI) is the performance metric that measures when the web page’s subresources have been downloaded and when the user can interact with the web page. Time to Interactive is not just about “loading responsiveness”. It is also about the “downloading the main resources of the web page”. To measure and understand the …

What is Time to Interactive (TTI) and How to Optimize It? Read More »

Largest Contentful Paint Optimization

What is the Largest Contentful Paint and How to Optimize It?

Largest Contentful Paint (LCP) is the rendering time of the largest and main content of the web page. LCP is one of the Core Web Vitals Metrics that are launched by Google Chrome Developers to measure “user experience” based on Page Speed Metrics. Largest Contentful Paint is important to see that when the most important …

What is the Largest Contentful Paint and How to Optimize It? Read More »

First Contentful Paint

What is First Contentful Paint: How to Optimize it?

First Contentful Paint (FCP) measures the time between the user’s navigation and the first paint of content for the web page. Anything related to the DOM of the web page can be included in the First Contentful Paint such as Paragraphs, Navigation Bar, Images, Form Elements, etc. Iframe Elements are not included in the First …

What is First Contentful Paint: How to Optimize it? Read More »

First Input Delay

What is First Input Delay and How to Optimize It?

First Input Delay is the time between the user’s first interaction with the web page and the web page’s response. First Input Delay (FID) is also a user-centric Load Timing Metric. Also, FID is an important signal to see the “load responsiveness” of the web page. Even if a web page loads faster than its …

What is First Input Delay and How to Optimize It? Read More »

Time to First Byte

Time to First Byte (TTFB): Server Response Time and Page Speed

Recent studies have shown that search rankings are affected by the loading speed of web pages. The logic behind all of this is clear and simple: A website that loads slowly delivers a bad user experience, and websites with a bad user experience don’t deserve to be at the top of search results. This means that if …

Time to First Byte (TTFB): Server Response Time and Page Speed Read More »

Scroll to Top