Skip to content

Instantly share code, notes, and snippets.

@aktaumag
Created May 7, 2020 20:01
Show Gist options
  • Save aktaumag/e03ce5463cedc2a5991cb6b79117b2d8 to your computer and use it in GitHub Desktop.
Save aktaumag/e03ce5463cedc2a5991cb6b79117b2d8 to your computer and use it in GitHub Desktop.
Откладываем загрузку счётчиков
@aktaumag
Copy link
Author

aktaumag commented Nov 5, 2022

Объединил оба варианта:

<!-- START wSEO.pw Michael Nossov: Отложенная загрузка сторонних скриптов -->
<script>
    async function wsloadScript(url, async) {
        async = async || false;
        const wsscript = document.createElement("script");
        wsscript.type = "text/javascript";
        wsscript.async = (async || false);
        return new Promise(function(done, failed) {
                wsscript.onload = function() {
                    done();
                };
                wsscript.onerror = function() {
                    failed();
                };
                wsscript.src = url;
                document.getElementsByTagName("head")[0].appendChild(wsscript);
            }
        );
    }

    let psLoadedJs = false
    const getExtJs = async () => {
        // проверяем, была ли выполнена функция ранее
        if (!psLoadedJs) {
            psLoadedJs = true;
            // при выполенении функций удаляем события, которые были навешаны ранее.
            window.removeEventListener("scroll", getExtJs, false);
            window.removeEventListener("touchstart", getExtJs, false);
            window.removeEventListener("mousemove", getExtJs, false);
            window.removeEventListener("click", getExtJs, false);
            window.removeEventListener("keydown", getExtJs, false);

            // Здесь все внешние скрипты, вроде живосайта, метрики,
            // аналитикса, обратные звонки, коллтрекинги и так далее
            await wsloadScript("https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXXXX-1",true);
            await wsloadScript("/js/google-analytics.js",true);
            await wsloadScript("/js/yandex-metrika.js",true);

            console.log("metrics done");
            return true;
        }
    }
    // Вешаем выполнение функцию на каждое необходимое событие. Здесь перечислены самые распространенные.
    window.addEventListener("scroll", getExtJs, { passive: true });
    window.addEventListener("touchstart", getExtJs, { passive: true });
    window.addEventListener("mousemove", getExtJs, { passive: true });
    window.addEventListener("click", getExtJs, { passive: true });
    window.addEventListener("keydown", getExtJs, { passive: true });
    // Если никакое событие не произошло, то выполняем функцию через 5 секунд
    window.addEventListener("load", function () { setTimeout(getExtJs, 5000); return true; } );


    async function wsloadmetrics() {
        // Чаты и другие маркетинговые инструменты, которые отображаются на странице спустя какое-то время можно отклыдвать только по таймеру и смело откалыдвать чат на 15-20 секунд.
        await wsloadScript("/js/jivo.js",true);
        console.log("chats done");
        return true;
    }
    window.addEventListener("load", function () { setTimeout(wsloadmetrics, 5000); return true; } );
    // Для каждого скрипта нужно подбирать время, чтобы предыдущий успевал загрузиться и инициализироваться.

</script>
<!-- END wSEO.pw Michael Nossov: Отложенная загрузка сторонних скриптов -->

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment