Slow Website Loading and Flickering Issue with Adobe Target | Community
Skip to main content
M
miguelbm_1989
Level 2
July 27, 2023
Solved

Slow Website Loading and Flickering Issue with Adobe Target

  • July 27, 2023
  • 3 replies
  • 8982 views

Dear Experience League Communities,

 

We are facing a critical issue with our website's loading speed and flickering problem related to the implementation of Adobe Target's anti-flicker solution. Despite our efforts and following the provided documentation, we have been unable to resolve the issue. We would really appreciate  your assistance in finding a solution to this pressing matter.

 

The Problem: Our client has reported that our website is loading slowly, which we have traced back to the implementation of the anti-flicker snippet. However, removing the anti-flicker snippet causes the original control version to briefly appear before the Adobe Target variant loads, resulting in an undesirable user experience.

 

Our Current Approach: Following the guidance from Adobe's documentation and other relevant sources, we added the anti-flicker snippet before loading Adobe Target through Google Tag Manager (GTM). Unfortunately, this has not resolved the problem, and the flickering persists.

We have reviewed the documentation: 

https://terrynwinter.com/adobe-target-how-to-avoid-page-blank-and-flickering-issues/

https://experienceleague.adobe.com/docs/target-dev/developer/client-side/at-js-implementation/at-js/manage-flicker-with-atjs.html?lang=en

 

We highly appreciate your expertise and support in resolving this critical issue. Thank you for your time and consideration. We eagerly await your guidance and are open to any additional information or insights you may require from us to assist in diagnosing and resolving this problem.

Best regards,

 

 

Update

- The snippet is working but the issue is that there is a blank page that stays one the page for a bit before our activity loads.

    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 Perrin_Ennen

    Hi @miguelbm_1989,

    So if you already have the possibility to include the at.js directly in the head, then also as first and without async and defer attributes.

     

    <script type="text/javascript" src="AT SCRIPT"></script>

     

    I would edit the AT SCRIPT file. Around the at.js code some kind of wrapper code - for example an IF query. This checks the OptanonConsent cookie if accordingly Consent was already given. So you have the advantage that you do not have to wait for anything else.

     

    In addition, if no reload of the page takes place when the Consent would be updated - OneTrust certainly has an event that you can listen to, so that even if the corresponding Consent inital is not yet given - but the user then give consent, then Adobe Target should also load (if that is desired).

    3 replies

    PratheepArunRaj
    Community Advisor and Adobe Champion
    PratheepArunRajCommunity Advisor and Adobe Champion
    Community Advisor and Adobe Champion
    July 28, 2023

    Dear @miguelbm_1989 ,

    Have you gone through my blog on Flickering & Page Blank Issues (I know that you have already shared the link above, didn't you get the solution?).

    To avoid Page Blank Issue, rather than hiding the entire body, try to hide just the element or the entire container having the element you are trying to change. This will eliminate the Page Blank Issue and will not show the default content (Flickering) before the test content (Because you are hiding the element).

    Thank You, Pratheep Arun Raj B (Arun) | NextRow Digital | Terryn Winter Analytics

    Thank You, Pratheep Arun Raj B (Arun) | Xerago | Terryn Winter Analytics
      M
      miguelbm_1989Author
      Level 2
      August 3, 2023

      Yes! thank you for the information. 

        alexbishop
        Adobe Employee
        alexbishopAdobe Employee
        Adobe Employee
        August 1, 2023

        Loading Adobe Target through GTM won't work because GTM can only be executed in an asynchronous way. So there will be some gap between the anti-flicker snippet being executed and Target being loaded, which is why you see a blank page for a relatively long period of time.

        The best option will be to load Target in the <head> of the page, completely separately from GTM

          M
          miguelbm_1989Author
          Level 2
          August 3, 2023

          Oh ok!! perfect. I think we will follow your advice @alexbishop thank you so much!

            Perrin_Ennen
            Community Advisor
            Perrin_EnnenCommunity Advisor
            Community Advisor
            August 2, 2023

            Hi @miguelbm_1989,
            basically there are pros and cons how it is included.

             

            Yes directly on the page and at the top of the head - is pretty cool, because you then also no pre-hiding snippet and target is available faster.

             

            But there are also reasons why it is being loaded via e.g. a tag manager. Basically that works too - but you have to pay attention to something more. It is important that with both variants Target is only executed if the user has given consent (if this is required in the respective country).

             

            So if you embed it directly in the head - it is necessary to wrap the code e.g. and create a query before that checks the consent if it is given or not. Also, if the page is already loaded and the user only then gives consent - must be ensured that Target is loaded / executed accordingly later.

             

            But if you embed it as in your case via the GTM - you must ensure that a pre-hiding snippet is loaded (I personally recommend that the pre-hiding snippet then really synchronously on the page far above embed). It is also important that this is only loaded if consent is given - otherwise users without consent will see the page white for 3 seconds (this step is important and many do it wrong). In addition, it is important, especially for asynchronous loading, that the target is loaded as early as possible.

             

            Hope this helps you.

             

              M
              miguelbm_1989Author
              Level 2
              August 7, 2023

              Thank you for your reply and your help!!! We will follow your advice of embeding it directly in the head. Ana also, wraping the code thath checks the consent. 

                Terms & ConditionsAccessibility statement

                Loading footer...