Parcourir la source

feat: 打印时间信息

TIANYONG il y a 2 mois
Parent
commit
b079014f7f
2 fichiers modifiés avec 35 ajouts et 9 suppressions
  1. 35 0
      src/page-instrument/App.tsx
  2. 0 9
      src/page-instrument/view-detail/index.tsx

+ 35 - 0
src/page-instrument/App.tsx

@@ -8,6 +8,7 @@ import { studentQueryUserInfo } from "./api";
 import { api_cloudLoading, api_getToken } from "../helpers/communication";
 import { showToast } from "vant";
 import state from "/src/state"
+import { values } from "lodash";
 
 export default defineComponent({
   name: "App",
@@ -125,6 +126,40 @@ export default defineComponent({
       //     event.preventDefault();
       //   }
       // });
+
+      /**
+       * DNS 解析耗时: domainLookupEnd - domainLookupStart
+       * TCP 连接耗时: connectEnd - connectStart
+       * SSL 安全连接耗时: connectEnd - secureConnectionStart
+       * 网络请求耗时 (TTFB): responseStart - requestStart
+       *数据传输耗时: responseEnd - responseStart
+        *DOM 解析耗时: domInteractive - responseEnd
+        *资源加载耗时: loadEventStart - domContentLoadedEventEnd
+        *First Byte时间: responseStart - domainLookupStart
+        *白屏时间: responseEnd - fetchStart
+        *首次可交互时间: domInteractive - fetchStart
+        *DOM Ready 时间: domContentLoadEventEnd - fetchStart
+        *页面完全加载时间: loadEventStart - fetchStart
+        *http 头部大小: transferSize - encodedBodySize
+        *重定向次数:performance.navigation.redirectCount
+        *重定向耗时: redirectEnd - redirectStart
+       */
+      window.onload = function() {
+        console.log('加载完成111')
+        let timing: any = performance.getEntriesByType('navigation')[0];
+        const { domainLookupEnd, domainLookupStart, connectEnd, connectStart, responseStart,
+          requestStart, responseEnd, domInteractive, loadEventStart, domContentLoadedEventEnd,
+          fetchStart, domContentLoadEventEnd, transferSize, encodedBodySize,
+          redirectEnd, redirectStart
+        } = timing
+        console.log(timing.domInteractive);
+        console.log(timing.fetchStart);
+        let diff = timing.domInteractive - timing.fetchStart;
+        console.log("TTI: " + diff);
+        const timeInfo = [{ title: 'TTI', value: diff}];
+        console.table(timeInfo);
+        
+      };
     });
 
     onUnmounted(() => {

+ 0 - 9
src/page-instrument/view-detail/index.tsx

@@ -152,14 +152,6 @@ export default defineComponent({
         }
       }
     };
-    window.onload = function() {
-      console.log('加载完成111')
-      let timing: any = performance.getEntriesByType('navigation')[0];
-      console.log(timing.domInteractive);
-      console.log(timing.fetchStart);
-      let diff = timing.domInteractive - timing.fetchStart;
-      console.log("TTI: " + diff);
-    };
     // console.log(route.params, query)
     onMounted(async () => {
       (window as any).appName = "colexiu";
@@ -181,7 +173,6 @@ export default defineComponent({
       //   getMusicInfo(values[0]);
       // });
       window.addEventListener('message', changePlay)
-      console.log('加载中22222')
       const guideInfoStore = localStorage.getItem('guideInfo') ? JSON.parse(localStorage.getItem('guideInfo')) : {};
       state.guideInfo = guideInfoStore
       try {