Google Analytics nedeniyle PageSpeed ​​Insights 99/100 - GA'yı nasıl önbelleğe alabilirim?


243

PageSpeed'de 100/100'e ulaşmak için bir arayış içindeyim ve neredeyse oradayım. Google Analytics'i önbelleğe almak için iyi bir çözüm bulmaya çalışıyorum.

İşte aldığım mesaj:

Tarayıcının önbelleğe alınmasından yararlanın Statik kaynaklar için HTTP üstbilgilerinde bir son kullanma tarihi veya maksimum yaş ayarlamak, tarayıcıya önceden indirilmiş kaynakları ağ yerine yerel diskten yüklemesini söyler. Aşağıdaki önbelleğe alınabilir kaynaklar için tarayıcı önbelleğinden yararlanın: http://www.google-analytics.com/analytics.js (2 saat)

Bulduğum tek çözüm 2012'den geldi ve bunun iyi bir çözüm olduğunu düşünmüyorum. Esasen GA kodunu kopyalayıp kendiniz barındırıyorsunuz. Ardından, en son GA kodunu alıp değiştirmek için Google'ı günde bir kez yeniden kontrol etmek için bir cron işi çalıştırırsınız.

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

Google Analytics'i kullanırken 100/100'e ulaşmak için başka ne yapabilirim?

Teşekkür ederim.


1
Cron yöntemini kullandım, cron kullanımı olmadan (yükler ve önbellekler yüklenir. İsterseniz php kodunu paylaşabilirim). Ve GA sabitleme önerimi düzelttim. Ama orada çok az sorun kaldı: "Cache-Control: max-age = 604800" başlığını bıraktım. Hangi 5 dakika önbellek çok daha yüksektir.
Roman Losev

6
Bu gerçekten iyi bir fikir mi? Bu dosyayı sunucunuzda önbelleğe almak, tarayıcının Google Analytics'i kullanarak diğer siteleri ziyaret ederek önceden önbelleğe aldığı dosyayı yeniden kullanmak yerine yeniden indirmesi gerektiği anlamına gelir. Bu yüzden ziyaretçilerinizi biraz yavaşlatabilir.
s427

Yanıtlar:


241

Google sizi aldatıyorsa, Google'ı aldatabilirsiniz:

Bu pageSpeed ​​için kullanıcı aracısıdır:

“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”

Analytics komut dosyasını PageSpeed'e sunmaktan kaçınmak için bir koşul ekleyebilirsiniz:

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

Açıkçası, herhangi bir gerçek gelişme sağlamaz, ancak tek endişeniz 100/100 puan almaksa, bunu yapacaktır.


4
Zeki ...... yazık Bu komut sadece istekleri her istek için kökeni ulaştığında çalışacağı için kenar önbellek kullanın :(
Amy Neville

49
JS ile yükleyin o zaman :)if(navigator.userAgent.indexOf("Speed Insights") == -1) { /* analytics here */ }
Half Crazed

1
@Jim Bkz. Stackoverflow.com/questions/10734968/… - bu yöntemi { }örneğimin içinde, GA'nın kullandığı diğer JS ile birlikte (örneğin ga('create', 'UA-XXXXX-Y', 'auto'); ga('send', 'pageview');veya ne olursa olsun) kullanırsınız
Half Crazed

1
@Jim Bunu kapsayan bir cevap ekledim.
Half Crazed

6
Uyarı: Bu artık çalışmıyor. Lighthouse tarafından desteklenen Sayfa Hızı Analizleri, artık algılanamayan varsayılan bir userAgent kullanır.
David Vielhuber

39

Google Analytics js kitaplığının ga-lite adında bir alt kümesi var , istediğiniz gibi önbelleğe alabileceğiniz .

Kütüphane, kullanıcı izleme verilerini Google'a göndermek için Google Analytics'in genel REST API'sini kullanır. Blog yayınından ga-lite hakkında daha fazla bilgi edinebilirsiniz .

Feragatname: Bu kütüphanenin yazarıyım. Bu özel sorunla mücadele ettim ve bulduğum en iyi sonuç bu çözümü uygulamaktı.


21

Temel önbellek izleme için JS'yi kullanan, kenar önbellekleri / proxy'leri için de çalışacak olan gerçekten basit bir çözüm (bu bir yorumdan dönüştürüldü):

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');
}

Not: Bu varsayılan GA betiğidir. Başka ga()çağrılarınız olabilir ve eğer öyleyse, aramadan önce her zaman kullanıcı aracısını kontrol etmeniz gerekir ga(), aksi takdirde hata verebilir.


2
Tepki gösteren "Not:" bölümü, Sen ilan edebilir gaolarak ga = function(){};olarak çalıştırıldığında pasajı sessizce başarısız olmasına önce ga();kodunuzda her yerde bu işlevin varlığını kontrol etmek zorunda kalmamak.
István Pálinkás

1
Bunu <script async src = " googletagmanager.com/gtag/js?id=UA-xx6600xx-1 " > </… >
Navnish Bhardwaj

16

Onun hakkında endişe etmem. Kendi sunucunuza koymayın, bunun Google ile ilgili bir sorun olduğu anlaşılıyor, ancak olabildiğince iyi. Dosyayı kendi sunucunuza koymak birçok yeni sorun yaratacaktır.

Dosyayı istemcinin önbelleğinden almak yerine her seferinde çağırmak için muhtemelen dosyaya ihtiyaçları vardır, çünkü bu şekilde ziyaretleri saymazsınız.

Bununla iyi hissetmek için bir sorununuz varsa, Google öngörülerinin URL'sini Google öngörülerinin üzerinde çalıştırın, gülün, rahatlayın ve işinize devam edin.


68
99 iyi değilse, 100'e nasıl ulaşabileceğini bilmek istiyor.
Erick Engelhardt

4
Analytics.js dosyasının indirildiği yerdeki bu yanıt doğru değildir; analitik parçalarının olup olmadığını etkilemez. Kendi analiz dosyanızı barındırma sorunu, her zaman manuel olarak en son sürüme (yılda birkaç kez) güncelleme yapmanız gerektiğidir.
Matthew Dolman

1
Matthew bunu belirttiğin için teşekkürler. Görünüşe göre yanılmışım, bu iyi, ama yine de bu dosyayı kendi sunucunuzda barındırmanın iyi bir fikir olduğunu düşünmüyorum, çünkü birçok yeni sorun yaratacağını hayal edebiliyorum. OP sorusu sayfa hızında 100'e nasıl ulaşılacağıydı ve cevabım bu 100'e ulaşma konusunda endişelenmemekti. Bu gerçekten can sıkıcı bir cevap olabilir, ama bu benim.
Leo Muller

3
99 düşünerek kaybolan insanlar için iyi bir cevap yeterli değildir. zamanınızı gerçek sorunlara ayırmanız daha iyi olur.
linqu

@ErickEngelhardt Haklısınız, ancak insanlar en iyi hedefi hedeflemediklerini düşündükleri bir soru sorarlarsa, onlara hangi çözümün daha iyi hizmet edebileceğine dikkat etmelisiniz.
gözlemci

10

Google dokümanlarında, pagespeedkomut dosyasını eşzamansız olarak yükleyecek bir filtre belirlediler :

ModPagespeedEnableFilters make_google_analytics_async

Belgeleri burada bulabilirsiniz: https://developers.google.com/speed/pagespeed/module/filter-make-google-analytics-async

Vurgulanması gereken bir şey, filtrenin yüksek riskli kabul edilmesidir. Dokümanlardan:

Make_google_analytics_async filtresi deneyseldir ve kapsamlı gerçek dünya testlerine sahip değildir. Yeniden yazmanın hatalara neden olacağı durumlardan biri, filtrenin, değer döndüren Google Analytics yöntemlerine yapılan çağrıları kaçırmasıdır. Bu tür yöntemler bulunursa, yeniden yazma işlemi atlanır. Ancak, diskalifiye yöntemleri yükten önce gelirse, "onclick" gibi özniteliklere sahipse veya dış kaynaklarda ise özlenecektir. Bu vakaların nadir olması bekleniyor.


7

varvy.com ( 100/100 Google sayfa hızı bilgileri ) google analitycs kodunu yalnızca kullanıcı sayfada bir kaydırma yaparsa yükler:

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
Ziyaretçi kaydırmazsa, yalnızca bir bağlantıyı tıklatırsa ne olur? Analitikte sayılmayacak.
Ross Ivantsiv

@RossIvantsiv de tıklama işleyebilir!
ar099968

6

Analytics.js dosyasını yerel olarak barındırmayı ve içeriğini bir önbellek komut dosyasıyla veya el ile güncellemeyi deneyebilirsiniz.

Js dosyası yılda sadece birkaç kez güncellenir ve yeni izleme özelliklerine ihtiyacınız yoksa manuel olarak güncelleyin.

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


2
Bunun Google tarafından açıkça desteklenmediğini unutmayın: support.google.com/analytics/answer/1032389?hl=tr
çelik


5

Google analitik komut dosyasını kendi sunucunuz aracılığıyla proxy yapabilir, yerel olarak kaydedebilir ve her zaman Google'dan en son sürüm olduğundan emin olmak için dosyayı otomatik olarak güncelleyebilirsiniz.

Bunu şimdi birkaç sitede yaptım ve her şey iyi çalışıyor.

NodeJS / MEAN Yığında Google Analytics Proxy Rotası

Bu benim üzerinde uygulanan nasıl blogumda ORTALAMA yığını inşa edilmiştir.

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);
    }
});

ASP.NET MVC'de Google Analytics Proxy Eylem Yöntemi

ASP.NET MVC ile inşa edilmiş diğer sitelere bu şekilde uyguladım.

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);
        }
    }
}

Bu, MVC ProxyController tarafından Gzip sıkıştırması için kullanılan CompressAttribute'tir.

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);
        }
    }
}

Güncellenmiş Google Analytics Komut Dosyası

İstemci tarafında, tarayıcının önbelleğe alınmış sürümü bir saatten fazla kullanmaması için, analitik yolunu geçerli tarihe kadar saate ekliyorum.

<!-- 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

Bunu HTML veya PHP kodunuza ekleyin:

<?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 ile sorunsuz çalışır:

  <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 zaten şunları söyledi: Açıkçası, gerçek bir gelişme sağlamayacak, ancak tek endişeniz 100/100 puanı alıyorsa, bunu yapacak.



0

Google uyarıları Analtics komut yerel kopyalarını kullanarak karşı. Ancak bunu yapıyorsanız, muhtemelen eklentilerin yerel hatalarını ve hata ayıklama komut dosyasını kullanmak isteyeceksiniz.

Agresif önbelleklemeyle ilgili ikinci bir endişe , önbelleğe alınmış sayfalardan site değiştirmiş veya kaldırılmış olabilecek isabetler alacağınızdır.


0

Bu sorunu gidermek için dosyayı yerel olarak indirmeniz ve güncellemeye devam etmek için bir cron işi çalıştırmanız gerekir. Not: Bu, web sitenizi hiç daha hızlı yapmaz, bu yüzden sadece görmezden gelmek en iyisidir.

Ancak gösterim amacıyla şu kılavuzu izleyin: http://diywpblog.com/leverage-browser-cache-optimize-google-analytics/


"Bu, web sitenizi daha hızlı yapmaz" anlamına gelmez. Teoride olduğu gibi, kritik olmayan birleştirilmiş JS'yi analiz içeren bir dosya gzipping, paylaşılan sözlük nedeniyle ayrılmış bir analitik dosyasından biraz daha küçük sıkıştırmalıdır. Belki de değerinden daha fazla sorun.
Ray Foss

0

Bu hile yapabilir :)

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

0

Google Analytics verilerini kullanımınıza bağlı olarak, temel bilgiler (ziyaretler, kullanıcı arayüzü etkileşimleri gibi) istiyorsanız, analytics.js'yi hiç dahil edemeyebilir, ancak yine de GA'da veri toplayabilirsiniz.

Seçeneklerden biri, ölçüm protokolünü önbelleğe alınmış bir komut dosyasında kullanmak olabilir. Google Analytics: Ölçüm Protokolüne Genel Bakış

Aktarım yöntemini açıkça resme ayarladığınızda, GA'nın kendi görüntü işaretlerini nasıl oluşturduğunu görebilirsiniz.

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}

Gerekli yük ile kendi GET veya POST isteklerinizi oluşturabilirsiniz.

Bununla birlikte, daha yüksek bir ayrıntı düzeyine ihtiyacınız varsa, muhtemelen çabaya değmez.


Pagespeed ile bağlantı nerede?
Nico Haase

Analytics.js dosyasını yüklemediğinizde, sayfa hızı cezalarından kaçınırsınız.
Jonathan

Evet. Ve tüm bu CSS, JS ve görüntüleri sayfanızdan atlayarak daha da hızlı yüklenir. OP'ye göre Google Analytics'i atlamak bir seçenek değil
Nico Haase

Verilerin hala Google Analytics'e kaydedilmesi dışında, cevabımın geçerli olduğunu düşünüyorum ve Google Analytics'ten istenen ayrıntı düzeyine bağlı olarak, ziyaretlerin, kullanıcı arayüzü etkileşimlerinin ve potansiyel olarak diğer metriklerin hangilerinin hala kaydedileceğini düşünmeye değer bir seçenek olabileceğini açıkça belirtiyorum. . OP son% 1 için optimize etmek istiyorsa, dikkate değer bir optimizasyon olabilir.
Jonathan

@NicoHaase Umarım amacımı netleştirmek için yorumumu düzenledim. Düşüncelerinizi duymak ister.
Jonathan

0

Başlangıç ​​sunucusu olarak www.google-analytics.com adresine sahip bir cloudfront dağıtımı ayarlayabilir ve cloudfront dağıtım ayarlarında daha uzun bir süre sonu başlığı ayarlayabilirsiniz. Ardından, Google snippet'indeki bu alan adını değiştirin. Bu, kendi sunucunuzdaki yükü ve dosyayı bir cron işinde güncellemeye devam etme ihtiyacını önler.

Bu kurulum ve unut. Bu nedenle, birisinin snippet'inizi "kopyalaması" ve bant genişliğinizi çalması durumunda cloudfront'a bir faturalandırma uyarısı eklemek isteyebilirsiniz ;-)

Düzenleme: Denedim ve bu o kadar kolay değil, Cloudfront bunu kaldırmak için kolay bir yol olmadan Cache-Control üstbilgisinden geçer


0

Https://www.google-analytics.com/analytics.js adresini açın. Yeni sekmede dosya, tüm kodu kopyalayın.

Şimdi web dizininizde bir klasör oluşturun, google-analytics olarak yeniden adlandırın.

Aynı klasörde bir metin dosyası oluşturun ve yukarıda kopyaladığınız tüm kodları yapıştırın.

Ga-local.js dosyasını yeniden adlandırın

Şimdi Google Analytics Kodunuzda yerel olarak barındırılan Analytics Komut Dosyası dosyanızı aramak için URL'yi değiştirin. Bunun gibi bir şey olacak yani https://domain.xyz/google-analytics/ga.js

Son olarak, YENİ google analiz kodunuzu web sayfanızın altbilgisine yerleştirin.

Senin gitmen iyidir. Şimdi Google PageSpeed ​​Insights web sitenizi kontrol edin. Tarayıcıyı Önbelleğe Alma Google Analytics'i Kaldı uyarısı gösterilmez. Ve bu çözümle ilgili tek sorun, Analytics Komut Dosyasını düzenli olarak manuel olarak güncellemektir.


0

2020 Sayfa Hızı Analizlerinde kullanıcı aracıları şunlardır: mobil cihazlar için "Chrome-Lighthouse" ve masaüstü bilgisayarlar için "Google Page Speed ​​Insights".

<?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; ?>

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.