Flicker Option for Customization

  • Updated

What is flicker and why does it happen? 

When API calls are needed a brief amount of time will be required for that process to happen. A library will need to connect, data needs to be sent and processed, and other data needs to be returned from outside your website. This necessary series of events is the main reason for “flicker”. With client-side customization, this becomes much more noticeable as this is no longer just data hidden in the background. For Demandbase, on a page visit, an API call needs to pass the user’s IP, Demandbase processes and returns data, and the changes are applied to a page once all elements to be targeted are available.


Our recommended solution

Hide the initial default element being customized and run a poll function like the attached file. To use this solution:

-Wrap whichever elements as display “none” or visibility “hidden” (optional to your team), so that the default image does not appear immediately. If the element doesn’t have a class or id, it is recommended to add one.

-Add polling function after both the Demandbase Tag and the element to be customized on the page are available.

On top of resolving for the flash, this function has the additional benefit of not holding up the page load. Whenever the elements are all available, this is intended to run (or max out), no need to use the extra poll if at the end of an earlier poll count all needed parts are available. This solution is intended to be hosted client side for best performance.


        // feel free to adjust the poll interval and count per your preference

        var POLL_INTERVAL = 25;

        var MAX_POLL_COUNT = 40;

        var pollCount = 0;

        function poll() {


            if ((window.Demandbase && window.Demandbase.IP.CompanyProfile) || pollCount === MAX_POLL_COUNT) {


                var attr = document.querySelector(SELECTOR).attr('style');

    if (typeof attr == typeof undefined || attr == false) {


                        this.style.setProperty('background-image', 'url(https://www.something.com/someimage.jpg)', 'important');



            } else if (pollCount < MAX_POLL_COUNT) {

                setTimeout(poll, POLL_INTERVAL);


        } poll();


if(window.console){console.log("DB__ "+e.message);}



Was this article helpful?

0 out of 0 found this helpful