구글 유니버설 분석회사가 문을 닫고 있다.다음은 당신이 알아야 할 것입니다.

2022년 3월 16일Google announced its plans for a shutdown of Universal Analytics property에 발표하고 2020년 말부터 출시되는 구글 분석4(v4)로 완전히 교체했다.
구글은 그들의 서비스를 죽이는 것을 좋아한다.다행히도 구글 분석을 끄는 것이 아니라 사이트에서 분석 데이터를 수집하는 방법에 관한 것이다.Google Analytics를 한동안 사용했다면 Universal Analytics를 사용할 가능성이 더 높습니다.번호 앞의 추적코드UA-를 보면 이 점을 알 수 있다.
4판 (UA는 3판) 의 분석 기술은 이미 한동안 개발되었지만, 구글이 예상한 대로 빠르게 사용되지 않았다. 이것이 바로 그들이 하나를 닫아서 다른 것을 지원함으로써 변화를 강요하는 이유다.
첫 번째 문제는 UA가 GAv4와 호환되지 않는다는 것입니다.너는 현재 데이터, 방문량 등을 GAv4로 옮길 수 없다.GAv4는 다른 데이터 수집 방법을 사용하고 있습니다. 이것이 바로 당신이 그것을 사용하고 싶다면 처음부터 데이터를 수집해야 하는 이유입니다. (네, 알고 있습니다. 완전히 허튼소리입니다.)
만약 당신이 인터넷 소유자로서 GAv4로 이전해야 한다면 가장 좋은 시기는 2022년의 마지막 날이나 다음 해의 첫날(2023년)이다.
다행히 2023년 7월 1일 Universal Analytics가 종료되므로 2022년 데이터를 지속적으로 수집하고 새해부터 Google Analytics 4로 전환하는 현재 솔루션을 계속 사용할 수 있습니다.이를 감안하여 지난 1년간의 데이터를 분석해야 한다면 두 가지 분석 사이에서 흔들릴 필요가 없다.
두 번째 문제는 당신의 사이트 성능입니다.인터넷 성능 향상에 힘쓰는 사람(예를 들어 나)은 구글 분석 추적 스크립트가 AdBlocker(예를 들어 내가 게시물Prevent Google Analytics from being blocked by AdBlocker에서 언급한)에 의해 차단되기 쉽다는 것을 알고 있지만 스크립트 자체도 약간 무거워서 불러오기(기억해라, 구글의 스크립트)는 PageSpeed Insight(구글의 해결 방안이기도 하다)의 사이트 성능을 떨어뜨린다.주로 영향을 받는 것은 관건적인 핵심 사이트이다. 이것은 구글 검색 결과를 잘 포지셔닝하는 데 필수적이다!
그래서 사람들은 가장 작은 구글 분석 부분을 해결 방안으로 사용해 왔다.minimalanalycs.com 웹 사이트에 따르면 Google Tag Manager + Analytics의 무게는 73kB(내 무게는 93kB!)여기서 코드 세그먼트의 무게는 1.5kB에 불과합니다.그것은 보기에는 매우 작아 보이지만, 네트워크 성능에 관한 것이라면, 이것은 매우 큰 차이이다.
Google Analytics 스크립트와 Minimal Analytics는 AdBlocker에 의해 차단되기 쉽습니다.
현재 구글 Analytics 4(Google Analytics 4)에 최소한의 해결 방안이 없기 때문에 Minimal Analytics를 종료해야 한다면, 구글의 스크립트를 불러올 수밖에 없으며, 성능에 영향을 미칠 위험에 직면하게 될 것입니다.새 스크립트는 최소 171kB(!) 증가한 몬스터입니다이것은 성능에 막대한 영향을 미칠 수 있다.
나는 연말까지 우리의 새로운 해결 방안의 최저 버전을 정렬할 수 있기를 바란다. (나의 이익을 위해 이를 감시할 것이다.) 그러나 만약 그렇지 않다면, 당신의 사이트에서 새로운 해결 방안을 서둘러 실시하기 전에, 우리가 현명한 방식으로 이 일을 하도록 하자. 내가 게시물 Smashing Magazine 에서 설명한 것처럼. Implementing JavaScript Delay for Cookie Consent Banner
그런 다음 Google Analytics JavaScript를 웹 사이트에서 진정한 사용자 상호작용을 할 수 있도록 지연시키고 Google 추적 스크립트를 지능적으로 표시 (숨기기) 합니다. 그러면 AdBlocker가 이를 막지 않고 분석에 더 정확한 근거를 제공할 수 있습니다.
더 자세히 논의하기 전에 Universal Analytics 속성을 닫는 또 다른 문제를 기억해야 합니다.
당신은 이전을 2023년 7월 1일로 연기할 수 있습니다. (나는 강력히 반대합니다.)이 기간 후 UA는 데이터 수집을 중지하고 6개월만 남게 됩니다. 이 기간 동안 UA는 기록에 접근할 수 있습니다. (기존의 데이터의 절반은 말할 것도 없고, 다른 절반은 새 건물에 있습니다.)새로운 솔루션으로만 마이그레이션할 수는 없으므로 이 솔루션이 영구적으로 사라지기 전에 기억해야 합니다export it.2023년에 지능적인 방법으로 새로운 해결 방안을 시작할 계획을 세우고 준비합시다.
다음은 우리가 이 점을 어떻게 할 것인가이다.

분쇄탄창법

시작하기 전에 Smashing Magazine에서 분석 스크립트를 어떻게 부르는지 살펴보겠습니다.

<script class=js-additional importance=low delay=https://www.google-analytics.com/analytics.js defer></script>

If I am not wrong, they still using Universal Analytics and they will need to implement GAv4 as well (unless they will migrate somewhere else).

previous post regarding JavaScript Delay 에서 언급한 바와 같이, 그들은 삭제 src 부분을 통해 상술한 스크립트를 무효화시켰다. (HTML에 대해서는)만약 그것이 없다면 스크립트를 불러올 수 없습니다.이후 자바스크립트 딜레이를 실행하기 위해 다른 자바스크립트를 사용합니다. 필요할 때 단어 delay 를 src 로 바꾸고, 위 <script> 는 필요한 내용을 다시 실행합니다.

Let's ignore class=js-additional and importance=low for now.

마지막 일은 defer 페이지를 불러온 후에 스크립트를 불러오려고 시도하는 것입니다. (기본적으로 실패합니다.)
지금은 시간을 끌 때이다.

JavaScript 지연

다음 코드(이상적으로 종료 전 마지막 부분</body>를 사용합니다.

<script>
const autoLoadDuration = 5; //In Seconds
const eventList = ["keydown", "mousemove", "wheel", "touchmove", "touchstart", "touchend"];

const autoLoadTimeout = setTimeout(runScripts, autoLoadDuration * 1000);

eventList.forEach(function(event) {
    window.addEventListener(event, triggerScripts, { passive: true })
});

function triggerScripts() {
    runScripts();
    clearTimeout(autoLoadTimeout);
    eventList.forEach(function(event) {
         window.removeEventListener(event, triggerScripts, { passive: true });
    });
}

function runScripts() {
    document.querySelectorAll("script[delay]").forEach(function(scriptTag) {
        scriptTag.setAttribute("src", scriptTag.getAttribute("delay"));
    });
}
</script>

이 스크립트는 키를 누르거나 마우스를 이동하거나 화면을 터치해서 사용자의 상호작용을 기다립니다.이것은 성능을 테스트하거나 페이지를 캡처하는 기계가 아니라 실제 사용자의 실제 상호작용이다.
이 대화 후에 모든 지연된 스크립트를 시작합니다.우리의 예에서 구글 분석을 자극할 것이다.google-analytics.com에서 외부 스크립트를 실행하려고 시도하는 경우 대부분의 AdBlocker가 이를 차단합니다.
일부 사용자에게는 가능하지만, 더 많은 방문자가 아니라면 약 30퍼센트의 방문을 놓칠 수 있다는 것을 쉽게 알 수 있다.
다음plausible.io approach to fighting with AdBlockers 우리는 이곳에서 마술을 할 것이다.

구글 분석 4 코드(글로벌 사이트 라벨-gtag.js)

시작하기 전에 새로운 추적 코드가 어떤지 봅시다.

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-FD38MN17VB"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'G-FD38MN17VB');
</script>

독립적으로 google-analytics.com 또는 googletagmanager.com 에서 실행될 경우, AdBlocker가 픽업하고 막습니다.

구글 분석 4 코드 차단(숨김)

스크립트의 코드를 숨기기 위해서, 우리는 로컬에서 스크립트를 호출하는 척하고 redirect 규칙 200 을 사용하여 백엔드에서 나머지 작업을 수행할 것입니다.
Netlify를 호스트 공급자로 사용하기 때문에 다음과 같이 리디렉션을 _redirects 파일에 넣습니다.

/collect/js   https://www.googletagmanager.com/gtag/js   200

근거 Netlify redirect options with Query parameters:

"(...) our service automatically passes on all query string parameters to destination paths for redirects with 200, (...)"

우리는 가능한 한 간단하게 방향을 바꿀 수 있다.
그러나 만약에 우리가 조회 파라미터를 선택하여 전달하고자 한다면 우리는 이런 방식으로 실현할 수 있다

/collect/js id=:id  https://www.googletagmanager.com/gtag/js?id=:id  200

참고로, 이 점을 어떻게 실현하는지는 당신의 위탁 관리 공급자가 무엇을 제공했는지에 달려 있다.
실현된 리디렉션 규칙으로 수정한 코드는 다음과 같습니다.

<script async src="/collect/js?id=G-FD38MN17VB"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'G-FD38MN17VB');
</script>

만약 내가 지연(그리고 지연)을 실시한다면 그것은 다음과 같다.

<script delay="/collect/js?id=G-FD38MN17VB" defer></script>
<script delay="/js/big-g-2nd-part.js" defer></script>

코드의 두 번째 부분은 다음과 같습니다.

  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'G-FD38MN17VB');

나는 그것을 내 사이트 루트 디렉터리 /js/ 폴더에 넣고 big-g-2nd-part.js 라는 파일에 놓았다. 이 파일은 첫 방문 후에 시작될 것이다.파일의 이름은 사용자가 결정하지만 analytics.js 라고 부르지 마십시오. 쉽게 막히기 때문입니다.
이렇게 하면 이론적으로 우리는 페이지를 불러온 후(구글 PageSpeed Insight 로봇이 렌더링을 멈춘 후) 이 무거운 분석 스크립트를 시작할 것이다.
결국 구글이 징벌할 수 있는 셀프 트랜잭션 분석 코드를 사용하지 않을 뿐만 아니라, 내 사이트가 불필요한 성능 저하를 피하지 못하게 할 것이다.
나는 이것이 이론적으로 가능하다고 말한 적이 있다. 왜냐하면 우리는 그것이 실제 환경에서 어떻게 일을 하는지 보아야 하기 때문이다.변경 사항이 필요하면 이 게시물을 업데이트해 보겠습니다.
그 밖에 이런 방법이 독특한 장점이 있는지downside, like I explained in my other post도 살펴봐야 한다.
누군가가 우리에게 v4의 최저 분석을 제공할 수 있기를 바랍니다. 마치 우리에게 v3 (통용 분석) 을 제공하는 것과 같습니다.