This section is your dedicated resource for assessing and optimizing the technical performance of your website. The metrics listed here allow you to closely monitor how your website is performing from a technical standpoint, ensuring an optimal user experience.




Cumulative Layout Shift (CLS) 


CLS (Cumulative Layout Shift), part of Core Web Vitals*, is a metric that measures the visual stability of your website as it loads and becomes interactive. It quantifies how much the content on a page shifts or moves unexpectedly during the loading process, which can result in a disruptive user experience. This metric measures the average CLS for all the pages of your website where the Project Agora Platform site tag is present, for desktop and mobile separately. It also provides information on the CLS measured during the Last hour, allowing you to compare this value against the CLS measured for the Last 24 hours. A graph is also available to assess the fluctuations in your website's CLS during the Last 7 days. CLS updates approximately every 1 hour.


The following table shows the CLS rating system:


Cumulative Layout Shift (CLS)
Rating
0.1
Good
>0.1 AND ≤0.25
Moderate
>0.25
Poor



  • Good: A "good" CLS value indicates that the webpage maintains a high level of visual stability during loading and user interaction. Elements on the page remain relatively stationary, resulting in minimal or no noticeable content shifts. Users can comfortably interact with the content without experiencing odd movements or distractions.
  • Moderate: A "moderate" CLS value suggests that there might be some noticeable content shifts during the loading process, but they are not excessively disruptive. Users might experience occasional and minor shifts in content, but they can still navigate and interact with the page without significant frustration.
  • Poor: A "poor" CLS value indicates that the webpage experiences frequent and significant content shifts during loading, leading to a disruptive user experience. Users might find it challenging to interact with the content due to frequent and noticeable content movements. High CLS can lead to unintended clicks, difficulty reading, and overall frustration, negatively impacting user engagement.


Monitoring CLS is essential for delivering a seamless, and visually consistent experience to your website visitors. Optimizing CLS contributes to better engagement, lower bounce rates, improved conversion rates, and an overall positive perception of your website.




How to improve Cumulative Layout Shift:

  • Set dimensions for media (width and height attributes) to prevent sudden shifts during loading.
  • Defer loading of third-party content with "lazy" attribute to minimize CLS caused by delayed elements.
  • Avoid dynamically injected content or use placeholders to reserve space in advance.
  • Preload essential fonts and critical CSS to ensure timely loading and reduce layout shifts.
Learn more

 



First Input Delay (FID)


FID (First Input Delay), part of Core Web Vitals*, is a performance metric that measures the responsiveness of your website to user interactions. It quantifies the delay between a user's first interaction (such as clicking a button or tapping a link) and the moment when the browser is able to respond to that interaction. FID focuses on capturing the delay caused by JavaScript execution and other processing tasks that occur in the background. This metric measures the average FID for all the pages of your website where the Project Agora Platform site tag is present, for desktop and mobile separately. It also provides information on the FID measured during the Last hour, allowing you to compare this value against the FID measured for the Last 24 hours. A graph is also available to assess the fluctuations in your website's FID during the Last 7 days. FID updates approximately every 1 hour.


The following table shows the FID rating system:


First Input Delay (FID)
Rating
100ms
Good
>100ms AND ≤300ms
Moderate
>300ms
Poor



  • Good: A "good" FID value indicates that the webpage quickly responds to user interactions, providing an almost immediate and seamless experience. Users can effortlessly interact with the page, leading to high engagement and satisfaction.
  • Moderate: A "moderate" FID value suggests that there might be a slight delay between user interactions and the browser's response, but it's still within an acceptable range. Users might experience a brief delay before the page responds to their interactions, but it's not significant enough to prevent navigation on the website.
  • Poor: A "poor" FID value indicates that the webpage experiences noticeable delays in responding to user interactions, potentially leading to frustration. Users might encounter significant delays after interacting with the page, impacting their ability to engage seamlessly.


Monitoring FID is crucial for delivering a seamless, responsive, and user-friendly experience. A low FID contributes to higher engagement, better conversions, and a positive perception of your website's performance, ultimately leading to increased user satisfaction and business success.




How to improve First Input Delay:

  • Optimize server response times and reduce backend processing for faster interactions.
  • Minimize JavaScript execution by removing unnecessary code and leveraging code splitting.
  • Use a browser cache and preconnect to reduce network round trips.
  • Offload non-essential tasks and improve responsiveness.
Learn more

 



Interaction to Next Paint (INP)


INP (Interaction to Next Paint), part of Core Web Vitals*, is a performance metric that evaluates the latency of each interaction a user initiates on the page and provides a single value representing the threshold below which all, or nearly all, interactions fell. This metric measures the average INP for all the pages of your website where the Project Agora Platform site tag is present, for desktop and mobile separately. It also provides information on the INP measured during the Last hour, allowing you to compare this value against the INP measured for the Last 24 hours. A graph is also available to assess the fluctuations in your website's INP during the Last 7 days. INP updates approximately every 1 hour.


The following table shows the INP rating system:


Interaction to Next Paint (INP)
Rating
≤200ms
Good
>200ms AND ≤500ms
Moderate
>500ms
Poor



  • Good: A "good" INP value indicates that the web page is highly responsive to user input, with most interactions resulting in quick responses. This contributes positively to user satisfaction and engagement. 
  • Moderate: A "moderate" INP value suggests that while the page generally responds adequately to user input, there may be occasional instances of delay or unresponsiveness. This could potentially impact user experience to some extent but might still be acceptable depending on the overall performance of the website or application.
  • Poor: A "poor" INP value indicates significant delays or unresponsiveness in the page's reaction to user input. This can lead to frustration, decreased user engagement, and potentially higher bounce rates as users may abandon the page due to the poor experience


Monitoring INP is crucial for delivering a seamless, responsive, and user-friendly experience. A low INP contributes to higher engagement, better conversions, and a positive perception of your website's performance, ultimately leading to increased user satisfaction and business success.




How to improve your Interaction to Next Paint:

  • Optimize JavaScript and CSS to minimize rendering delays and improve responsiveness.
  • Prioritize critical resources delivery for faster loading and interaction response.
  • Efficiently handle events and animations to reduce processing time and enhance user experience.
  • Continuously monitor and test performance to identify and address any bottlenecks affecting interaction speed.
Learn more

 



Largest Contentful Paint (LCP)


LCP (Largest Contentful Paint), part of Core Web Vitals*, is a performance metric that measures the loading speed of your website. It focuses on the time it takes for the largest and most important content element (often an image, video, or text block) to become fully visible to users as they scroll down the page. This metric measures the average LCP for all the pages of your website where the Project Agora Platform site tag is present, for desktop and mobile separately. It also provides information on the LCP measured during the Last hour, allowing you to compare this value against the LCP measured for the Last 24 hours. A graph is also available to assess the fluctuations in your website's LCP during the Last 7 days. LCP updates approximately every 1 hour.


The following table shows the LCP rating system:


Largest Contentful Paint (LCP)
Rating
2.5s
Good
>2.5s AND ≤4s
Moderate
>4s
Poor



  • Good: A "good" LCP value indicates that the largest content element on the webpage becomes fully visible to users very quickly after the page loads. Users see the most important content within a very short time, leading to a positive initial experience.
  • Moderate: A "moderate" LCP value suggests that the largest content element takes a bit more time to become fully visible, but it's still within an acceptable range. Users might experience a slight delay before the main content is visible, but it's not significantly detrimental to their experience.
  • Poor: A "poor" LCP value indicates that the largest content element has a noticeable delay in becoming fully visible, potentially leading to a slower user experience. Users might perceive the page as slow if they have to wait too long for the main content to load. High LCP values can lead to users leaving the site before engaging with the core content, resulting in dissatisfaction.


Monitoring LCP is essential for delivering a fast, engaging, and user-friendly experience. A low LCP contributes to higher engagement, better conversions, and a positive perception of your website's performance, ultimately leading to increased user satisfaction and business success.




How to improve Largest Contentful Paint:

  • Optimize image and video sizes for faster loading.
  • Utilize browser caching to store frequently accessed content.
  • Prioritize above-the-fold content loading for quicker visual rendering.
  • Enable compression and use Content Delivery Networks (CDNs) for faster content delivery.
Learn more

        



*Core Web Vitals (CWV)


Core Web Vitals (CWV) are a set of user-centric performance metrics introduced by Google to measure and quantify key aspects of the user experience on the web. These metrics aim to assess various dimensions of web performance that directly impact user satisfaction and engagement. The Core Web Vitals are part of Google's larger effort to encourage website owners and developers to prioritize user experience when designing and optimizing websites.  CLS, INP and LCP collectively provide insights into visual stability, interactivity, and loading performance – three fundamental aspects of a positive user experience on the web. Google uses these metrics to assess and rank websites based on their user experience, with the goal of improving the overall quality of the web.