zoukankan      html  css  js  c++  java
  • [HTML5] Track First Contentful Paint with PerformanceObserver and Google Analytics

    "If you can't measure it, you can't improve it." The first step when doing performance work is to measure meaningful metrics to establish a baseline for improvement. In this lesson, we'll measure Time to First Contentful Paint, a user-centric performance metric. We'll first create a PerformanceObserver object and explore the information it captures. Next, we'll send that information to Google Analytics to track FCP over time. Lastly, we'll discover why PerformanceObserver is one of the few bits of Javascript that rightly belong in the head of your document.

    const observer = new PerformanceObserver((list) => {
                    for (const entry of list.getEntries()) {
                        console.log(entry.name, entry.startTime);
                        // note: the ga call will only work on your actual domain, make
                        // sure the code is executed on your domain and not just in a test environment.
                        ga('send', 'timing', entry.name, 'userId', Math.round(entry.startTime));
                    }
                });
    observer.observe({entryTypes: ['paint']});
  • 相关阅读:
    cocos2dx遇到的一些坑
    cocos2dx场景切换的坑
    整合quickx到普通cocos2dx
    Hadoop、spark
    Redis高级特性及应用场景
    wpf相关好资源
    MVVM模式的几个开源框架
    ASP.NET的IIS映射
    NET 开发者必备的工具箱
    C#开源汇总
  • 原文地址:https://www.cnblogs.com/Answer1215/p/10363770.html
Copyright © 2011-2022 走看看