Chrome performance.timing 错误输出（不匹配开发工具）

Question

我编写了一个简单的扩展程序，将我的网页重定向到所需的站点，并通过所有 URL 的内容设置禁用 JavaScript。

我的代码是

1. 尽管我的后台脚本，我等待页面状态为“完成”
2. 当页面完成时，我通过 chrome.tabs.executescript() 注入一个脚本
3. 我的脚本使用 chrome.runtime.sendMessage() 将所需的统计信息发送回我的扩展程序的后台页面，在那里我打印它们。
4. 然后我将该页面重定向到给定的 URL（硬编码的“google.com”）
5. 回到步骤 1

我的目标是多次阅读“ https://google.com ”页面加载时间以及 DOM 计数和资源计数等，虽然它没有给出任何错误，但它提供的时间与开发工具时间不匹配。 现在我不确定哪个是错误的 Dev-Tool 或 Performance.Timings。 只有第一次它在我的重定向后匹配时间，它永远不会与 chrome DEV-TOOL 匹配。

如果有人想测试它，我已经包含了下面的所有代码。

我的 Chrome 版本低于

Windows 10 (64 Bit) also tested on UBUNTU 16.04 with Chromium 70.0.3538.77
Google Chrome   70.0.3538.110 (Official Build) (64-bit) 
Revision    ca97ba107095b2a88cf04f9135463301e685cbb0-refs/branch-heads/3538@{#1094}
OS  Windows
JavaScript  V8 7.0.276.40
Flash   31.0.0.153 

我的打印格式是 URL,DOM_Loaded,ON_LOAD,DOM_Count,Req_Count

Dom_loaded : performance.timing.domContentLoadedEventEnd-performance.timing.navigationStart,
on_load : performance.timing.loadEventEnd - performance.timing.navigationStart,
Dom_count : document.getElementsByTagName('*').length,              
req_count : window.performance.getEntriesByType("resource").length

显现

{
    "name" : "JS BLOCK settings",
    "version" : "1",
    "description" : "Block JS of Brower",
    "icons":{
        "128" : "js-logo.png",
        "48" : "js-logo.png",
        "16" : "js-logo.png"
    },
    "permissions": [
        "browsingData", 
        "contentSettings",
        "tabs",
        "<all_urls>" 
    ],
    "browser_action": {
        "default_icon": "js-logo.png"


    },
    "background": {
        "scripts": ["background.js"]

    },
    "externally_connectable": {
    "ids": [
      "*"
    ],
    "matches": ["https://www.google.com/"],
    "accepts_tls_channel_id": false
  },
    "manifest_version": 2
}

self_script.js

function send_stats(){

    chrome.runtime.sendMessage(

        {
            Dom_loaded : performance.timing.domContentLoadedEventEnd-performance.timing.navigationStart,
            on_load : performance.timing.loadEventEnd - performance.timing.navigationStart,
            Dom_count : document.getElementsByTagName('*').length,              
            req_count : window.performance.getEntriesByType("resource").length

        }, function(response) {
        }
    );

    console.log("IT WORKS");

}

send_stats();

背景.js

document.addEventListener('DOMContentLoaded', blockjs);

var mytabid = 0

var b = "https://google.com" 
chrome.tabs.onUpdated.addListener(
    function (tabId , info) {
        if (info.status == 'complete') {
            mytabid = tabId
            console.log("Going to exec")
            chrome.tabs.executeScript(tabId , {
                file: "self_script.js"
            // code: new_redirect
            });

            setTimeout(function(){
                console.log("JUST BEFORE UPDATE")
                chrome.tabs.update(mytabid,{url: b})
            },5000)

      }
});


function blockjs(tab) {

    chrome.contentSettings['javascript'].set({
        primaryPattern:  "<all_urls>",
        setting: 'block'
    })

}

// URL,DOM_Loaded,ON_LOAD,DOM_Count,Req_Count
chrome.runtime.onMessage.addListener(
  function(request, sender, sendResponse) {


    console.log(sender.tab.url+","+request.Dom_loaded+","+request.on_load+","+request.Dom_count+","+request.req_count)

    // var millisecondperhour = 3600000;
    // var onehourago = (new Date()).getTime() - millisecondperhour;
    // chrome.browsingData.remove({
    // "since": onehourago
    // }, {
    //     "appcache": true,
    //     "cache": true,
    //     "cookies": true
    //  }
    // );


});

Answer 1

问题是 (Background.js) 中的 chrome.tabs.update(mytabid,{url: b})。 通常，当我们请求网页时，它会启动 navigation.start 事件，但是当我们重定向网页时，chrome 在 redirect.end 之后需要时间，即 DomainlookupStart。

也可以选择 fetch start，但在这种情况下，浏览器缓存已禁用，因此采用 fetchStart 毫无意义。

对于确切的答案更改 background.js

Dom_loaded : performance.timing.domContentLoadedEventEnd-performance.timing.navigationStart,
on_load : performance.timing.loadEventEnd - performance.timing.navigationStart,
Dom_count : document.getElementsByTagName('*').length,              
req_count : window.performance.getEntriesByType("resource").length

到

Dom_loaded : performance.timing.domContentLoadedEventEnd-performance.timing.domainLookupStart,
on_load : performance.timing.loadEventEnd - performance.timing.domainLookupStart,
Dom_count : document.getElementsByTagName('*').length,              
req_count : window.performance.getEntriesByType("resource").length