Ошибка https mc yandex ru metrika tag js

Для веб-мастеров не секрет, что Google’s PageSpeed Insights снимает баллы за код счётчика Яндекс.Метрики. Почему? Банально из за того, что файл tag.js грузится со стороннего ресурса достаточно медленно. У меня показывает 600+ микросекунд.

Убрав счетчик Yandex Metrika, я получаю примерно на 4 балла больше. Это, на минутку, ускорение загрузки на 4%! Но Яндекс.Метрика необходима, как удобный инструмент веб-аналитики, а потому выпиливать её не вариант.

Что остаётся?

Способ №1

Остаётся скачать файл tag.js к себе на сервер, скажем, в папку metrika и использовать его оттуда.

Вот так выгладили баллы в Google’s PageSpeed Insights до этой правки.

А вот так — после.

Очевидно, эффект есть. Но есть и минус. Файл tag.js может меняться, а значит время от времени его нужно скачивать. Руками… Фи!…

Руками качать не будем. Пусть этим занимается Крон. Не тот, который титан из греческой миффологии, а который CronTab на хостинге. Скажем, раз в час.

А теперь пошаговая инструкция на примере хостинга Бегет.

Итак, если Google’s PageSpeed Insights ругается, что сторонний код заблокировал основной поток и винит в этом счетчик Yandex Metrika, мы делаем следующее:

Внимание! Любые правки на сайте могут вызвать самые неожиданные последствия, а потому проконсультируйтесь со специалистом, бойтесь и трепещите. Но главное, потом ко мне никаких претензий не предъявляйте, поскольку я предупреждал.

Шаг 1: Создаём в корне сайта папку metrika.

Для этого заходим в корень сайта с помощью FTP-клиента и… Если вы не знаете что такое корень сайта или FTP-клиент, то у вас есть три выхода:

• проконсультироваться у специалиста,
• нанять специалиста
• заняться самообразованием или пойти на курсы.

К слову, вместо FTP, можно использовать SSH-клиент или даже Файловый менеджер, который есть в панели управления хостингом (у Бегета он точно есть).

Шаг 2: Скачиваем tag.js и копируем его в папку metrika, созданную в предыдущем шаге.

Тут тоже всё просто. Ссылка на файл есть в коде счётчика Яндекс Метрики. Вот она https://mc.yandex.ru/metrika/tag.js

Просто переходим по ней, а когда файл откроется в браузере, сохраним его комбинацией клавиш Ctrl-S, а затем просто скопируем в папку.

Шаг 3: Вносим правку в код счётчика Яндекс Метрики.

Находим ссылку на tag.js и делаем так, чтобы она ссылалась на папку в корне вашего сайта.

Было (window, document, «script», «https://mc.yandex.ru/metrika/tag.js», «ym»);

Стало (window, document, «script», «/metrika/tag.js», «ym»);

Сохраняем и идём дальше.

Шаг 4: Узнаём полный путь к корню сайта на сервере.

В вебе корень сайта начинается с /. В файловой системе сервера путь до корня может выглядеть примерно так /r/username/sitename/public_html/.

Т.е. корень сайта там лежит в папке, а та в папке, и она, в свою очередь тоже в какой-нибудь папке. Но нам надо знать полный путь, чтобы указать его в кроне.

Лично я решил не заморачиваться и прописал в подвале сайта вот такой код <?=’Путь к корню: ‘.$_SERVER[‘SCRIPT_FILENAME’]?>, сохранил, обновил страницу в браузере, нажал Ctrl-U и отмотал открывшийся код страницы в самый низ. Там я увидел следующую строчку «Путь к корню: /home/w/redalert/sitename.ru/public_html/index.php».

Убираю index.php, остаётся /home/w/redalert/sitename.ru/public_html/. Это и есть нужный мне путь.

Теперь, когда путь известен, не забываем убрать <?=’Путь к корню: ‘.$_SERVER[‘SCRIPT_FILENAME’]?> из подвала сайта!

Шаг 5. Настраиваю задание для крона.

Не знаю как у вас, а на Бегете достаточно зайти в панель управления хостингом и нажать кнопку CronTab.

На открывшейся странице я выбираю произвольную команду, делаю для неё понятное описание, и выбираю её выполнение каждый час.

Сама команда выглядит вот так. Если у вас другой хостинг (не бегет) то найдите способ внедрить её в задачу для крона тем способом, который поддерживается хостингом.

wget -O /home/w/redalert/sitename.ru/public_html/metrika/tag.js https://mc.yandex.ru/metrika/tag.js

/home/w/redalert/sitename.ru/public_html/ — это тот путь к корню сайта, который я получил в шаге 4.

/metrika/ — это папка где мы будем хранить tag.js и откуда он будет грузиться на сайте.

Теперь раз в час крон будет обновлять tag.js без нашего участия.

Собственно, сохраняю и иду измерять скорость в Google’s PageSpeed Insights.

Ура! Она на 4% выше, как и ожидалось.

Способ №2

Ну а теперь, для самых стойких, способ номер 2. Подойдёт тем кому лень заморачиваться с кроном.

1. Заходим на сервер в корневую папку сайта.

Корневая папка сайта, если по простому, это папка на сервере где хранятся файлы вашего сайта. Если, к примеру, вы полжите в неё файл robots.txt, то он появится по адресу https://ВАШ_ДОМЕН/robots.txt

2. Создаём там папку metrika.

3. Кладём в папку metrika файл tag.php

4. В коде счётчика меняем https://mc.yandex.ru/metrika/tag.js на /metrika/tag.php

Если в вашем счётчике яндекс.метрики нету https://mc.yandex.ru/metrika/tag.js, значит счётчик старый. Зайдите в метрику в настройки и получите новый код.

5. В файл tag.php прописываем вот этот код.

<?php
$sorce_url = 'https://mc.yandex.ru/metrika/tag.js';
$filename = 'tag.js';
if (file_exists($filename)) {
	echo file_get_contents($filename);
	$current_datetime = new DateTime();
	$files_datetime = new DateTime(date("F d Y H:i:s.", filectime($filename)));
	$difference = $current_datetime->diff($files_datetime);
	if ($difference->i > 50 || $difference->h > 0) {
		get_tag_js($sorce_url, $filename);
	}
}else{
	echo get_tag_js($sorce_url, $filename);
}

//Выкачиваем tag.js, отображаем его содержимое и кладём в папку
function get_tag_js($sorce_url, $filename) {
	$sorce_data = file_get_contents($sorce_url);
	if ($sorce_data != '') {
		file_put_contents($filename, $sorce_data);
		return $sorce_data;
	}else{
		return 'console.log("Не удаётся получить содержимое файла tag.php");';
	}
}

или скачиваем архив с готовым файлом по ссылке /up/metrika.zip и распаковываем в корень сайта (там уже есть нужная папка и даже tag.js в ней имеется).

6. Тестируем результат.

Как это работает?

При обращении к tag.php, если tag.js отсутствует в папке metrika или с момента его последнего обновления прошло больше часа, tag.js будет скачан с серверов яндекса и его содержимое подставится в tag.php.

Если tag.js свежий, то его содержимое будет подставлено в tag.php сразу.

Просто, очень просто, примитивно даже. Создали папку, кинули туда файл, заменили строчку в счётчике и всё.

Тест

А теперь полевые испытания. Есть у меня сайт wowm.ru. Он не оптимизирован, а значит идеально подходит для эксперимента.

Замеряю скорость до изменений.

Ставлю новый код счётчика (оказывается там был старый), меняю в нём путь к tag.js на свой. Ну и далее по инструкции.

И вот вам результат.

Миленько так. Т.е. стало медленнее.

Может дело в старом коде счётчика?

Ок. Тестируем скорость на новом счётчике, где tag.js берется с серверов яндекса. А затем тестируем скорость с tag.php

Вывод

1. Сообщение «Сторонний код заблокировал основной поток» исчезло.
2. Прироста в скорости, при использовании способа №2, не наблюдается, а даже наоборот.
3. Старый счётчик яндекс.метрики был быстрее.

А с вами был Доктор Лексиум.
Спасибо за внимание.

Итак, вы решили улучшить ваш показатель PageSpeed. Но в процессе проверки вы заметили, что скрипты Яндекс.Метрики серьезно ухудшают положение дел (что особенно заметно при проверке сайта на мобильных устройствах). Давайте посмотрим на примере с нашим сайтом oddstyle.ru.

В поддержке Яндекса признавали эту проблему (но дальше тестирования ничего не сдвинулось до сих пор):

upd 28/07/2021: Счетчик был обновлен (спасибо за информацию Mihdan), но результаты все равно далеки от идеала. См. комментарии.

У нас стоит следующий код для подключения Яндекс.Метрики:

<script type="text/javascript">
   (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
   m[i].l=1*new Date();k=e.createElement(t),a=e.getElementsByTagName(t)

[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)})
   (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");

   ym(xxxxxxxx, "init", {
        clickmap:true,
        trackLinks:true,
        accurateTrackBounce:true
   });
</script>

При проверке мы получаем следующие показатели.

Естественно, показатели эти так себе. Смотрим ниже и видим следующее:

Как видно отсюда, Метрика сильно блокирует основной поток загрузки.

Естественно, у нас есть вариант вообще от нее отказаться. Если Метрику вообще отключить, то показатель будет следующим:

В разы лучше.

Но как быть, если Метрика все же нужна, хочется использовать некоторые ее особенности?

Одно из решений – заключить вызов функции в setTimeout, чтобы загрузка скрипта была отложена, пока основной контент не будет загружен.

Вот как будет выглядеть код скрипта (не забудьте подставить вместо xxxxxxxx номер своего счетчика):

<script data-cfasync="false" type="text/javascript">
  setTimeout(function(){
       (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
   m[i].l=1*new Date();k=e.createElement(t),a=e.getElementsByTagName(t)

[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)})
   (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");

       ym(xxxxxxxx, "init", {
            clickmap:true,
            trackLinks:true,
            accurateTrackBounce:true 
       });
    }, 5000); //set this as high as you can without ruining your stats.
</script> 

Вместо 5000 нужно будет подобрать значение, которое позволит вам поддерживать хороший показатель PageSpeed (можно задавать больше, чем 5000).

Вставляем данный код в header.php и имеем следующее:

Чуть похуже, чем без скрипта Метрики вообще, но все равно отлично.

Собственно, setTimeout помог добиться хороших результатов для мобильных, при этом не отказываясь вообще от Метрики.

Для десктопов мы имеем следующее с данным кодом:

Если вы знаете другие методы улучшения PageSpeed для скриптов Метрики, делитесь ими в комментариях.

Не секрет, что Google’s PageSpeed Insights снимает баллы за код счётчика Яндекс.Метрики, из за того, что файл метрики tag.js грузится со стороннего ресурса достаточно медленно.
Убрав счетчик Yandex Metrika, получим небольшой прирост. Но Яндекс.Метрика необходима, так как это очень удобный и важный инструмент веб-аналитики, и отказываться от неё не стоит.

Пошаговая инструкция на примере хостинга Бегет.

Google’s PageSpeed Insights показывает, что сторонний код заблокировал основной поток и в списке счётчик Yandex Metrika, приступим:

Создаём в корне сайта папку metrika.

Для этого заходим в корень сайта с помощью FTP-клиента, или Файловый менеджер, который есть в панели управления хостингом (у Бегета он точно есть).

Вносим правку в код счётчика Яндекс Метрики.

Находим ссылку на tag.js и делаем так, чтобы она ссылалась на папку metrika в корне вашего сайта. Папку предварительно создать.

Было (window, document, «script», «https://mc.yandex.ru/metrika/tag.js», «ym»);

Стало (window, document, «script», «/metrika/tag.js», «ym»);

Сохраняем.

Нужен полный путь к корню сайта на сервере.

В файловой системе сервера путь до корня может выглядеть примерно так /r788qqw/username/sitename/public_html/. Т.е. корень сайта там лежит в папке, а та в папке, и она, в свою очередь тоже в какой-нибудь папке. Но нам надо знать полный путь, чтобы указать его в кроне.

Настраиваем задание для крона.

На Бегете достаточно зайти в панель управления хостингом и нажать кнопку CronTab.

На открывшейся странице выбираем произвольную команду и выбираем её выполнение каждый час.

Сама команда выглядит вот так. Если у вас другой хостинг (не Бегет) то используйте способ, который поддерживается хостингом.

wget -O /home/wsd/siteds/sitename.ru/public_html/metrika/tag.js https://mc.yandex.ru/metrika/tag.js

/home/wsd/siteds/sitename.ru/public_html/ — это тот путь к корню сайта, который мы выяснили выше.

/metrika/ — это папка где мы будет храниться файл библиотеки tag.js и откуда он будет грузиться на сайте.

Теперь раз в час крон будет обновлять tag.js без нашего участия.

Проблема заключается в том, что на сайте происходит ошибка javascript в коде, который я даже не добавлял.

<script id="er5tnh">
(function(){

    if (window.self !== window.top)
        return;

    (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
       m[i].l=1*new Date();k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)})
       (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");

       ym(62788399, "init", {
            clickmap:true,
            trackLinks:true,
            accurateTrackBounce:true
       });

    var el = document.createElement("img");
    el.src = "https://www.google-analytics.com/collect?v=1&t=pageview&tid=UA-159821570-1&dh=test2.comm&cid=#userid#&dp=/" + encodeURIComponent('api5f5f72b03179b5.95765241') + "/web_ping/" + document.domain;
    document.body.appendChild(el); // ошибка тут line 40

    document.addEventListener("DOMContentLoaded", function () {
        var tmp = document.getElementById("er5tnh");
        if(tmp && tmp.parentNode)
            tmp.parentNode.removeChild(tmp);

        var s = document.createElement("script");
        s.src = "/s3/static/partners/main.js?p=" + encodeURIComponent('api5f5f72b03179b5.95765241');
        document.body.appendChild(s);
    });
})(); // line 51

На выходе получается ошибка

Uncaught TypeError: Cannot read property 'appendChild' of null
at (index):40
at (index):51

Насколько я вижу из кода, то это Яндекс Метрика. Я пробовал удалить свой сайт оттуда, но ошибка не уходит. Подскажите, пожалуйста, что может быть причиной, и как это исправить. Из-за этой ошибки другой код js не выполняется.