Как добавить на сайт счётчики аналитики не ухудшая скорость загрузки?

Что на счет такого варианта:

<script>
  setTimeout(function(){
      // Код счетчиков
    }, 5000); 
</script>

Даем на загрузку страницы 5 секунд и только 5 секунд спустя подгружаем все это барахло.

1. Вышеуказанный совет использовать Tag Manager верен, но всё-равно счётчики будут замедлять сайт.

2. Настоящие индейцы вполне могут обходиться без всех этих счётчиков. Для всех задач достаточно связки из трёх компонентов:

Яндекс.Вебмастер
SearcheConsole

goaccess your.domain.ru.access.log -o report.html --log-format=COMBINED

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

Все счётчики асинхронные и никак на скорость загрузки сайта не влияют

Просто грузить надо скрипты себе на сайт, обновляя их по крону раз в сутки, а не грузить со сторонних серверов

Касательно яндекс.метрики:
Не включайте вебвизор, если он не нужен. TTI в Lighthouse значительно проседает.

Касательно гугл аналитики:
Подключайте через analitics.js, а не через gtag.js

Не нужно делать setTimeout на подключение — не поможет. Асинхронного подключения достаточно.
Для того же lighthouse setTimeout может навредить. И если значение поставить слишком высокое, то сама аналитика будет уже искаженные данные показывать, а из этого следует вывод — зачем тогда вообще нужна аналитика, если её подключать через 5 секунд, как здесь советуют?

По поводу размещения скриптов на своем сайте:
Антон вполне прав и это не чушь. Размещая скрипты на своем сервере, можно задать свои заголовки кэширования, что позволяет дольше хранить скрипты у пользователя. И CDN чаще может дольше отвечать, чем свой правильно настроенный сервер.
Для обновления достаточно нужный скрипт в крон добавить (загружать через wget или curl). Никакую инфраструктуру для этого не надо разворачивать.

На счет пикселей ФБ, ВК и прочих — по мне это лишнее уже, реально.

Хороший вопрос от автора.
Правильный ответ примерно такой:

Работать над оптимизацией внешних подключений важно. Асинхронность по умолчанию должна быть, но она не спасает от перегрузки основного потока.
У нас на проекте стоит не только Яндекс Метрика, Гугл Аналитика, пиксель ФБ, пиксель ВК, но и Hotjar и utmstat и они совершенно не мешают ничему. Подключать всё надо грамотно, откладывая по времени и по событиям. Если событие наступило, то счетчик времени отключается. Важно найти то время, на которое откладывать скрипт. Чтобы не поехали цели в метрике или в GA. Следите за приоритезацией загрузки, чтобы всё осталось в рабочем состоянии, но не влияло на скорость загрузки.

Подробно, как правильно подключать внешку, мы показывали с этой минуты: https://youtu.be/_3c0aPSkNdc?t=1480.
Там же есть пример скрипта обработчика.

Алексей из loading.express

Через Google Tag Manager

Для начало определите для себя что такое скорость загрузки, если это кб/с это ответ никак, обычно это время до взаимодействия с сайтом на 3г скорости, а для этого достаточно html и критический css загрузить, все остальное можно потом и не влияет понятие скорость загрузки сайта.

1) проверьте асинхронность у скрипта
2) отключите вебвизоры — они для баловства