Статистика сторінок 99/100 через Google Analytics - як я можу кешувати GA?


243

Я прагну досягти 100/100 на PageSpeed, і я майже там. Я намагаюся знайти гарне рішення для кешування Google Analytics.

Ось повідомлення, які я отримую:

Використовуйте кешування браузера Встановлення дати закінчення терміну дії або максимального віку в заголовках HTTP для статичних ресурсів вказує браузеру завантажувати раніше завантажені ресурси з локального диска, а не через мережу. Використовуйте кешування браузера для таких кешованих ресурсів: http://www.google-analytics.com/analytics.js (2 години)

Єдине рішення, яке я знайшов, було з 2012 року, і я не думаю, що це гарне рішення. По суті, ви копіюєте код GA та розміщуєте його самостійно. Тоді ви запускаєте роботу cron, щоб повторно перевірити Google один раз на день, щоб схопити останній код GA та замінити його.

http://diywpblog.com/leverage-browser-cache-optimize-google-analytics/

Що ще я можу зробити, щоб досягти 100/100 під час використання Google Analytics?

Дякую.


1
Я використовував метод cron, Без використання cron (завантаження та кеш-завантаження. Я можу поділитися PHP кодом, якщо хочете). І я виправив свою пропозицію щодо фіксації GA. Але там залишилася невелика проблема: я залишив заголовок "Кеш-контроль: max-age = 604800". Це набагато вище, ніж кеш 5 хвилин.
Роман Лосєв

6
Це справді гарна ідея? Кешування цього файлу на вашому сервері означає, що веб-переглядачу доведеться повторно завантажити його замість повторного використання файлу, який він уже кешував, відвідавши інші сайти за допомогою Google Analytics. Так це може насправді трохи уповільнити відвідувачів.
s427

Відповіді:


241

Що ж, якщо Google вас обманює, ви можете обдурити Google назад:

Це користувальницький агент для pageSpeed:

“Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/536.8 (KHTML, like Gecko; Google Page Speed Insights) Chrome/19.0.1084.36 Safari/536.8”

Ви можете вставити умовне, щоб уникнути подачі сценарію аналітики для PageSpeed:

<?php if (!isset($_SERVER['HTTP_USER_AGENT']) || stripos($_SERVER['HTTP_USER_AGENT'], 'Speed Insights') === false): ?>
// your analytics code here
<?php endif; ?>

Очевидно, що це не призведе до жодного реального покращення, але якщо ваша єдина проблема - отримати 100/100 бал, це зробить це.


4
Розумний ...... жаль, я використовую кешування краю, тому що цей сценарій працюватиме лише в тому випадку, якщо запити досягають вашого походження для кожного запиту :(
Емі Невіл

49
Завантажте через JS тоді :)if(navigator.userAgent.indexOf("Speed Insights") == -1) { /* analytics here */ }
Наполовину божевільний

1
@Jim Див stackoverflow.com/questions/10734968 / ... - ви б використовувати цей метод внутрішньої частини { }в моєму прикладі, поряд з будь-якими іншими JS , що GA використовує (наприклад, ga('create', 'UA-XXXXX-Y', 'auto'); ga('send', 'pageview');чи будь-який інший )
Половина Crazed

1
@Jim Я додав відповідь, яка охоплює це.
Наполовину божевільний

6
Попередження: Це більше не працює. Інформація про швидкість сторінки за допомогою Lighthouse використовує за замовчуванням userAgent, який більше не можна виявити.
Девід Вільхубер

39

Існує підмножина бібліотеки js Google Analytics, яка називається ga-lite, яку ви можете кешувати, як тільки захочете.

Бібліотека використовує загальнодоступний API REST Google Analytics для надсилання даних відстеження користувачів в Google. Ви можете прочитати більше з публікації в блозі про ga-lite .

Відмова: Я є автором цієї бібліотеки. Я боровся з цією конкретною проблемою, і найкращий результат, який я знайшов, - це втілення цього рішення.


21

Ось дійсно просте рішення з використанням JS, для базового відстеження GA, яке також буде працювати для кращих кешів / проксі (це було перетворено з коментаря):

if(navigator.userAgent.indexOf("Speed Insights") == -1) {
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-XXXXXXXXX-X', 'auto');
  ga('send', 'pageview');
}

Примітка. Це сценарій GA за замовчуванням. У вас можуть бути інші ga()дзвінки, і якщо так, вам потрібно буде завжди перевірити агент користувача перед тим, як дзвонити ga(), інакше це може помилитися.


2
Реагуючи на розділ «Примітка:», ви можете оголосити, gaяк ga = function(){};раніше, коли фрагмент мовчки вийшов з ладу при виконанні, ga();тому не потрібно перевіряти наявність цієї функції скрізь у вашому коді.
István Pálinkás

1
Як додати це в скрипт <script async src = " googletagmanager.com/gtag/js?id=UA-xx6600xx-1" > </… >
Navnish Bhardwaj

16

Я б не переймався цим. Не ставте його на свій власний сервер, це здається, що це проблема з Google, але настільки ж добре, як це стає. Якщо розмістити файл на власному сервері, це створить багато нових проблем.

Їм, ймовірно, потрібен файл, щоб викликати його щоразу, а не отримувати його з кеш-пам'яті клієнта, оскільки таким чином ви не рахували б відвідувань.

Якщо у вас є проблеми з цим добре, запустіть URL-адресу Google про статистику в Google insaghts, посмійтеся, розслабтеся і продовжуйте свою роботу.


68
Він хоче знати, як він може досягти 100, але якщо 99 - це нормально.
Ерік Енгельгардт

4
Ця відповідь не відповідає дійсності, коли завантажений файл Analytics.js не впливає на те, чи слід слідкувати аналітики. Проблема розміщення власного файлу аналітики полягає в тому, що вам завжди доведеться вручну оновлюватись до останньої версії (кілька разів на рік).
Меттью Долман

1
Дякую Метью, що вказав на це. Мабуть, я помилявся, що добре, але все-таки я не думаю, що розмістити цей файл на власному сервері, тому що я можу уявити, що це створить багато нових проблем. Питання ОП полягало в тому, як дістатися до 100 на швидкості сторінок, і моя відповідь полягає в тому, щоб не турбуватися про те, щоб досягти цієї 100. Це може бути справді прикрою відповіддю, але це я.
Лев Мюллер

3
хороша відповідь для людей, які заблукали, думаючи 99, недостатньо хороша. краще присвятіть свій час реальним проблемам.
linqu

@ErickEngelhardt Ви маєте рацію, але якщо люди задають питання, де, на вашу думку, вони не прагнуть досягти найкращої мети, ви повинні дати їм голову, яке рішення може служити їм краще.
спостерігач

10

У документах Google вони визначили pagespeedфільтр, який буде завантажувати сценарій асинхронно:

ModPagespeedEnableFilters make_google_analytics_async

Документацію можна знайти тут: https://developers.google.com/speed/pagespeed/module/filter-make-google-analytics-async

Варто виділити одне, що фільтр вважається високим ризиком. З документів:

Фільтр make_google_analytics_async є експериментальним і не проводив широкого реального тестування. Один з випадків, коли перезапис може спричинити помилки, якщо фільтр пропускає дзвінки до методів Google Analytics, які повертають значення. Якщо такі методи знайдені, перезапис пропускається. Однак методи дискваліфікації будуть пропущені, якщо вони прийдуть до завантаження, є в таких атрибутах, як "onclick" або якщо вони знаходяться у зовнішніх ресурсах. Очікується, що ці випадки будуть рідкісними.


7

varvy.com ( 100/100 швидкість розуміння сторінки на сторінці Google ) завантажує код analitycs google, лише якщо користувач здійснив прокрутку сторінки:

var fired = false;

window.addEventListener("scroll", function(){
    if ((document.documentElement.scrollTop != 0 && fired === false) || (document.body.scrollTop != 0 && fired === false)) {

        (function(i,s,o,g,r,a,m{i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga');

        ga('create', 'UA-XXXXXXXX-X', 'auto');
        ga('send', 'pageview');

        fired = true;
    }
}, true);

7
Що робити, якщо відвідувач не прокручує, а просто натискає посилання. Він не буде зарахований до аналітики.
Росс Іванців

@RossIvantsiv ви можете впоратися і з клацанням!
ar099968

6

Ви можете спробувати розмістити analytics.js локально та оновити його вміст за допомогою кешування сценарію або вручну.

Файл js оновлюється лише кілька разів на рік, і якщо вам не потрібні нові функції відстеження, оновіть його вручну.

https://developers.google.com/analytics/devguides/collection/analyticsjs/changelog


2
Будьте попереджені: Google явно не підтримує Google: support.google.com/analytics/answer/1032389?hl=uk
сталь

6

зберігати localy analytics.js, але це не рекомендується google: https://support.google.com/analytics/answer/1032389?hl=uk

не рекомендується, тому що Google може оновлювати скрипт, коли вони хочуть, тому просто робіть сценарій, який завантажує аналітичний JavaScript щотижня, і у вас не буде проблем!

До речі, це рішення запобігає блокуванню adblock блокування скриптів аналітики Google


Це не обходить Adblock повністю (він все ще блокує дзвінки Ajax), але принаймні ви отримуєте сеанси та перегляд сторінок
NiloVelez

5

Ви можете проксі-скрипт аналітики google через власний сервер, зберігати його локально та автоматично оновлювати файл щогодини, щоб переконатися, що це завжди остання версія Google від Google.

Я робив це на кількох сайтах зараз, і все працює нормально.

Проксі-маршрут Google Analytics у стеку NodeJS / MEAN

Ось як я реалізував це у своєму блозі , створеному зі стеком MEAN.

router.get('/analytics.js', function (req, res, next) {
    var fileUrl = 'http://www.google-analytics.com/analytics.js';
    var filePath = path.resolve('/content/analytics.js');

    // ensure file exists and is less than 1 hour old
    fs.stat(filePath, function (err, stats) {
        if (err) {
            // file doesn't exist so download and create it
            updateFileAndReturn();
        } else {
            // file exists so ensure it's not stale
            if (moment().diff(stats.mtime, 'minutes') > 60) {
                updateFileAndReturn();
            } else {
                returnFile();
            }
        }
    });

    // update file from remote url then send to client
    function updateFileAndReturn() {
        request(fileUrl, function (error, response, body) {
            fs.writeFileSync(filePath, body);
            returnFile();
        });
    }

    // send file to client
    function returnFile() {
        res.set('Cache-Control', 'public, max-age=' + oneWeekSeconds);
        res.sendFile(filePath);
    }
});

Метод дії проксі-сервера Google Analytics у ASP.NET MVC

Ось як я реалізував це на інших сайтах, створених за допомогою ASP.NET MVC.

public class ProxyController : BaseController
{
    [Compress]
    public ActionResult GoogleAnalytics()
    {
        var fileUrl = "https://ssl.google-analytics.com/ga.js";
        var filePath = Server.MapPath("~/scripts/analytics.js");

        // ensure file exists 
        if (!System.IO.File.Exists(filePath))
            UpdateFile(fileUrl, filePath);

        // ensure file is less than 1 hour old
        var lastModified = System.IO.File.GetLastWriteTime(filePath);
        if((DateTime.Now - lastModified).TotalMinutes > 60)
            UpdateFile(fileUrl, filePath);

        // enable caching for 1 week for page speed score
        Response.AddHeader("Cache-Control", "max-age=604800");

        return JavaScript(System.IO.File.ReadAllText(filePath));
    }

    private void UpdateFile(string fileUrl, string filePath)
    {
        using (var response = WebRequest.Create(fileUrl).GetResponse())
        using (var dataStream = response.GetResponseStream())
        using (var reader = new StreamReader(dataStream))
        {
            var body = reader.ReadToEnd();
            System.IO.File.WriteAllText(filePath, body);
        }
    }
}

Це CompressAttribute, який використовується MVC ProxyController для стиснення Gzip

public class CompressAttribute : ActionFilterAttribute
{
    public override void OnActionExecuting(ActionExecutingContext filterContext)
    {

        var encodingsAccepted = filterContext.HttpContext.Request.Headers["Accept-Encoding"];
        if (string.IsNullOrEmpty(encodingsAccepted)) return;

        encodingsAccepted = encodingsAccepted.ToLowerInvariant();
        var response = filterContext.HttpContext.Response;

        if (encodingsAccepted.Contains("gzip"))
        {
            response.AppendHeader("Content-encoding", "gzip");
            response.Filter = new GZipStream(response.Filter, CompressionMode.Compress);
        }
        else if (encodingsAccepted.Contains("deflate"))
        {
            response.AppendHeader("Content-encoding", "deflate");
            response.Filter = new DeflateStream(response.Filter, CompressionMode.Compress);
        }
    }
}

Оновлений сценарій Google Analytics

На стороні клієнта я додаю шлях аналітики з поточною датою до години, щоб браузер не використовував кешовану версію, старшу години.

<!-- analytics -->
<script>
    (function (i, s, o, g, r, a, m) {
        i['GoogleAnalyticsObject'] = r; i[r] = i[r] || function () {
            (i[r].q = i[r].q || []).push(arguments)
        }, i[r].l = 1 * new Date(); a = s.createElement(o),
        m = s.getElementsByTagName(o)[0]; a.async = 1; a.src = g; m.parentNode.insertBefore(a, m)
    })(window, document, 'script', '/analytics.js?d=' + new Date().toISOString().slice(0, 13), 'ga');
</script>


4

PHP

Додайте це у свій HTML або PHP-код:

<?php if (!isset($_SERVER['HTTP_USER_AGENT']) || stripos($_SERVER['HTTP_USER_AGENT'], 'Speed Insights') === false): ?>
  <script>
    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
    })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

    ga('create', 'UA-PUT YOUR GOOGLE ANALYTICS ID HERE', 'auto');
    ga('send', 'pageview');
  </script>
<?php endif; ?>

JavaScript

Це добре працює за допомогою JavaScript:

  <script>
  if(navigator.userAgent.indexOf("Speed Insights") == -1) {
    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
    })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

    ga('create', 'UA-<PUT YOUR GOOGLE ANALYTICS ID HERE>', 'auto');
    ga('send', 'pageview');
  }
  </script>

NiloVelez вже сказав: Очевидно, це не призведе до реального поліпшення, але якщо ваша єдина проблема - отримати 100/100 бал, це зробить це.


1

спробуйте це просто вставити раніше

<script async='async' src='https://cdn.jsdelivr.net/ga-lite/latest/ga-lite.min.js'></script> <script>var galite=galite||{};galite.UA="xx-xxxxxxx-x";</script>

Змініть xx-xxxxxxx-x на свій код, будь ласка, перевірте на імплементацію тут http://www.gee.web.id/2016/11/how-to-leverage-browser-caching-for-google-analitycs.html


1
Будьте в курсі, що це стосується ga-lite, а не стандартної аналітики
Роб Форест

0

Google застерігає від використання локальних копій сценаріїв аналітики. Однак якщо ви це робите, ви, ймовірно, захочете використовувати локальні копії плагінів та сценарій налагодження.

Другим питанням агресивного кешування є те, що ви отримуватимете звернення із кешованих сторінок - які, можливо, змінилися або були видалені з сайту.


0

Щоб виправити цю проблему, вам доведеться завантажити файл локально та запустити завдання cron, щоб продовжувати оновлення. Примітка: це зовсім не робить ваш веб-сайт швидшим, тому найкраще просто ігнорувати його.

Проте для демонстраційних цілей дотримуйтесь цього посібника: http://diywpblog.com/leverage-browser-cache-optimize-google-analytics/


"Це не робить ваш веб-сайт швидшим", що не обов'язково відповідає дійсності. Як і в теорії, gzipping некритичний зв'язаний JS-файл із включеною аналітикою повинен стискати трохи менше, ніж окремий файл аналітики через спільний словник. Можливо, більше клопоту, ніж варто.
Рей Фосс

0

Це може зробити трюк :)

<script>
  $.ajax({
  type: "GET",
  url: "https://www.google-analytics.com/analytics.js",
  success: function(){},
  dataType: "script",
  cache: true
  });
</script>

0

Залежно від використання даних Google Analytics, якщо ви хочете отримати базову інформацію (наприклад, відвідування, взаємодію з інтерфейсом інтерфейсу), ви можете взагалі не включати analytics.js, але все одно збирати дані в GA.

Одним із варіантів може бути замість цього використовувати протокол вимірювання в кешованому сценарії. Google Analytics: огляд протоколу вимірювання

Якщо явно встановити спосіб транспортування зображення, ви можете бачити, як GA будує власні маяки зображення.

ga('set', 'transport', 'image');

https://www.google-analytics.com/r/collect
  ?v={protocol-version}
  &tid={tracking-id}
  &cid={client-id}
  &t={hit-type}
  &dl={location}

Ви можете створити власні запити GET або POST з необхідним корисним навантаженням.

Однак, якщо вам потрібен більш високий рівень деталізації, це, ймовірно, не вартує ваших зусиль.


Де зв’язок із Pagespeed?
Ніко Хааз

Не завантажуючи analytics.js, ви уникаєте штрафу за швидкість перегляду сторінок.
Джонатан

Так. А пропустивши зі сторінки всі CSS, JS та зображення, це завантажиться ще швидше. Пропустити Google Analytics - це не варіант згідно з ОП
Ніко Хааз

За винятком того, що дані все ще записуються в Google Analytics, я вважаю, що моя відповідь є достовірною, і чітко сказано, що залежно від рівня деталізації, що вимагається від Google Analytics, можливо, варто врахувати, що важливо все-таки записувати відвідування, взаємодію з інтерфейсом та потенційно інші показники . Якщо ОП прагне оптимізувати остаточний 1%, це може бути оптимізацією, яку варто врахувати.
Джонатан

@NicoHaase Я відредагував свій коментар, щоб сподіватися зробити свою точку яснішою. Зацікавлено почути ваші думки.
Джонатан

0

Ви можете налаштувати дистрибутив на обласному екрані, який має www.google-analytics.com як свій початковий сервер, і встановити довший термін дії заголовка в налаштуваннях розповсюдження хмари. Потім змініть цей домен у фрагменті Google. Це запобігає навантаженню на ваш власний сервер та необхідності постійно оновлювати файл у роботі cron.

Це налаштування та забудьте. Тож ви можете додати повідомлення про виставлення рахунків до обласного фронту, якщо хтось "копіює" ваш фрагмент і вкраде вашу пропускну здатність ;-)

Редагувати: я спробував це, і це не так просто, Cloudfront проходить через заголовок кеша-керування, не маючи простий спосіб його видалити


0

Відкрийте https://www.google-analytics.com/analytics.js файл на новій вкладці, скопіюйте весь код.

Тепер створіть папку у своєму веб-каталозі, перейменуйте її на google-analytics.

Створіть текстовий файл у тій же папці та вставте весь код, який ви скопіювали вище.

Перейменуйте файл ga-local.js

Тепер змініть URL-адресу, щоб зателефонувати в локальний файл Analytics Script у своєму коді Google Analytics. Це буде виглядати приблизно так: https://domain.xyz/google-analytics/ga.js

Нарешті, розмістіть НОВИЙ код аналітики google у підніжжі веб-сторінки.

Вам добре піти. Тепер перевірте свій веб-сайт Google PageSpeed ​​Insights. Це не відображатиме попередження для веб-переглядача, який керує Google Analytics. І єдиною проблемою цього рішення є регулярне оновлення сценарію Analytics вручну.


0

У 2020 році користувацькими агентами Speed ​​Insights користувачі: "Chrome-Lighthouse" для мобільних пристроїв та "Insight Insight Page Google Instant" для робочого столу.

<?php if (!isset($_SERVER['HTTP_USER_AGENT']) || stripos($_SERVER['HTTP_USER_AGENT'], 'Chrome-Lighthouse') === false  || stripos($_SERVER['HTTP_USER_AGENT'], 'Google Page Speed Insights') === false): ?>
// your google analytics code and other external script you want to hide from PageSpeed Insights here
<?php endif; ?>

-13

Ви можете мінімізувати всі свої сценарії на сторінці, включаючи analytics.js:

Не забудьте пом'якшити файли перед його використанням. Інакше це забирає більше часу на обробку.


6
analytics.js вже змінено з джерела
Жоао Піментел Феррейра
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.