网页加载速度测试

测试网页加载速度

目前為 2023-03-09 提交的版本,檢視 最新版本

// ==UserScript==
// @name         网页加载速度测试
// @author       ChatGPT定制
// @version      1
// @description 测试网页加载速度
// @match        *://*/*
// @run-at      document-end
// @grant        none
// @namespace https://greasyfork.org/users/452911
// ==/UserScript==

(function() {
  const button = document.createElement('button');
  button.textContent = '测试加载速度';
  button.style.cssText = `
    position: fixed;
    right: 10px;
    bottom: 10px;
    z-index: 999999999999999999999999;
  `;
  // 插入按钮到 body 中
  document.body.appendChild(button);

  // 给按钮绑定点击事件
  button.onclick = function() {
    // 创建 iframe
    const iframe = document.createElement('iframe');
    // 设置 iframe 样式
    iframe.style.position = 'fixed';
    iframe.style.top = 0;
    iframe.style.left = 0;
    iframe.style.width = '100%';
    iframe.style.height = '100%';
    iframe.style.border = 'none';
    iframe.style.zIndex = 99999;
    // 插入到 body 中
    document.body.appendChild(iframe);
    // 获取当前网站 URL
    const url = window.location.href;
    // 在 iframe 中重复显示当前网站
    iframe.src = url;
    // 记录开始时间
    const startTime = performance.now();
    // 监听 iframe 的 load 事件
    iframe.onload = () => {
      // 计算加载时间
      const loadTime = (performance.now() - startTime) / 1000;
      // 弹出提示框显示加载时间
      alert(`网页完整显示时间:${loadTime.toFixed(2)} 秒`);
      // 移除 iframe
      iframe.parentNode.removeChild(iframe);
    };
  };
})();