cmp:loaded event to trigger just once | Community
Skip to main content
N
Nick_2024
Level 4
January 31, 2024
Solved

cmp:loaded event to trigger just once

  • January 31, 2024
  • 3 replies
  • 1192 views

Hi all, 

 

we are implementing the pageView tracking to analytics and wanted to use one of the event reported here: https://experienceleague.adobe.com/docs/experience-manager-learn/sites/integrations/analytics/collect-data-analytics.html?lang=en

 

we have cmp:show and cmp:loaded, is there an event that is better to choose? can it be that one of the event here triggers more than once impacting pageView count? 

 

Thanks!

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by Raja_Reddy

Hi @nick_2024 

When implementing page view tracking to Adobe Analytics in AEM, both `cmp:show` and `cmp:loaded` events can be used. However, it's important to understand the differences between these events and how they can impact the page view count.

1. `cmp:show` event: This event is triggered when a component becomes visible on the page. It is typically used when you want to track the visibility of specific components. For example, you might want to track when a carousel or a banner becomes visible to the user. The `cmp:show` event can be triggered multiple times if the component visibility changes, such as when the user scrolls or interacts with the page.

2. `cmp:loaded` event: This event is triggered when a component is loaded on the page. It is typically used when you want to track the initial loading of components. For example, you might want to track when a specific component is loaded for the first time. The `cmp:loaded` event is typically triggered only once per component, as it represents the initial loading of the component.

In terms of choosing the event for page view tracking, it depends on your specific use case and what you want to track. If you want to track the visibility of components and how they are displayed to the user, you can use the `cmp:show` event. If you want to track the initial loading of components, you can use the `cmp:loaded` event.

3 replies

Raja_Reddy
Community Advisor
Raja_ReddyCommunity AdvisorAccepted solution
Community Advisor
February 1, 2024

Hi @nick_2024 

When implementing page view tracking to Adobe Analytics in AEM, both `cmp:show` and `cmp:loaded` events can be used. However, it's important to understand the differences between these events and how they can impact the page view count.

1. `cmp:show` event: This event is triggered when a component becomes visible on the page. It is typically used when you want to track the visibility of specific components. For example, you might want to track when a carousel or a banner becomes visible to the user. The `cmp:show` event can be triggered multiple times if the component visibility changes, such as when the user scrolls or interacts with the page.

2. `cmp:loaded` event: This event is triggered when a component is loaded on the page. It is typically used when you want to track the initial loading of components. For example, you might want to track when a specific component is loaded for the first time. The `cmp:loaded` event is typically triggered only once per component, as it represents the initial loading of the component.

In terms of choosing the event for page view tracking, it depends on your specific use case and what you want to track. If you want to track the visibility of components and how they are displayed to the user, you can use the `cmp:show` event. If you want to track the initial loading of components, you can use the `cmp:loaded` event.

    kautuk_sahni
    Community Manager
    kautuk_sahniCommunity Manager
    Community Manager
    February 2, 2024

    @nick_2024 Did you find the suggestions from users helpful? Please let us know if more information is required. Otherwise, please mark the answer as correct for posterity. If you have found out solution yourself, please share it with the community.

    Kautuk Sahni
    PAGIDALAGURUKRISHNA
    Adobe Employee
    PAGIDALAGURUKRISHNAAdobe Employee
    Adobe Employee
    February 2, 2024

    Hi @nick_2024 

    When implementing page view tracking for analytics with Adobe Experience Manager (AEM), it is important to select the appropriate event to ensure accurate page view counts. The documentation provided from the AEM Core Components library describes several events, including cmp:show and cmp:loaded, which can be used to trigger analytics tracking.

    The cmp:show event is triggered on page load and is dispatched from in-line JavaScript immediately beneath the opening <body> tag, making it the earliest event in the Data Layer event queue. This event is particularly used in components like the accordion, carousel, and tabs when a user views or interacts with these components.

    The cmp:loaded event is triggered as soon as the Data Layer is populated with the Core Components on the page. This event signals that all the initial components have been loaded onto the page.

    In choosing between cmp:show and cmp:loaded for page view tracking, consider the following:

    • cmp:show: Since this event is also dispatched on page load and is expected to be the first event, it can be a good candidate for tracking initial page views. However, if the same component is used multiple times on a page (e.g., in an accordion or tabs that can be expanded or collapsed), this event might trigger multiple times, potentially leading to over-counting page views.
    • cmp:loaded: This event signifies that the page has fully loaded all its initial components. Using this event would ensure that the page view is counted once all components are ready, which might provide a more accurate count of page views.

    It is important to note that if any of the components that trigger the cmp:show event are dynamic and can load content after the initial page load (e.g., lazy loading of tabs or additional content being loaded into an accordion), it could potentially trigger the event multiple times. This could indeed impact the page view count if not handled properly.

    For precise page view tracking, you might want to:

    1. Use the cmp:loaded event to ensure the page view is counted once, after all initial components are fully loaded.
    2. Implement additional logic to ensure that cmp:show events triggered by user interactions after the initial page load do not count as additional page views.

    It's also recommended to configure your analytics to differentiate between the initial page load event and subsequent interactions that may trigger the same events. Doing so will provide a more accurate representation of user engagement with the page.

    For more information on the events triggered by AEM Core Components, you may refer to the official documentation:

      Terms & ConditionsAccessibility statement

      Loading footer...