@vue/devtools-kit 7.5.4 → 7.5.6

package/dist/index.cjs

@@ -2331,7 +2331,7 @@ var import_devtools_shared8 = require("@vue/devtools-shared");
 // src/ctx/state.ts
 init_cjs_shims();
 var import_devtools_shared7 = require("@vue/devtools-shared");
-var import_perfect_debounce2 = require("perfect-debounce");
+var import_perfect_debounce3 = require("perfect-debounce");
 
 // src/core/timeline/storage.ts
 init_cjs_shims();
@@ -2368,6 +2368,7 @@ function getTimelineLayersStateFromStorage() {
 // src/ctx/hook.ts
 init_cjs_shims();
 var import_hookable = require("hookable");
+var import_perfect_debounce2 = require("perfect-debounce");
 
 // src/ctx/inspector.ts
 init_cjs_shims();
@@ -2385,6 +2386,7 @@ var devtoolsTimelineLayers = new Proxy(import_devtools_shared5.target.__VUE_DEVT
   }
 });
 function addTimelineLayer(options, descriptor) {
+  devtoolsState.timelineLayersState[descriptor.id] = false;
   devtoolsTimelineLayers.push({
     ...options,
     descriptorId: descriptor.id,
@@ -2514,9 +2516,9 @@ function createDevToolsCtxHooks() {
   hooks2.hook("addInspector" /* ADD_INSPECTOR */, ({ inspector, plugin }) => {
     addInspector(inspector, plugin.descriptor);
   });
-  hooks2.hook("sendInspectorTree" /* SEND_INSPECTOR_TREE */, async ({ inspectorId, plugin }) => {
+  const debounceSendInspectorTree = (0, import_perfect_debounce2.debounce)(async ({ inspectorId, plugin }) => {
     var _a25;
-    if (!inspectorId || !((_a25 = plugin == null ? void 0 : plugin.descriptor) == null ? void 0 : _a25.app))
+    if (!inspectorId || !((_a25 = plugin == null ? void 0 : plugin.descriptor) == null ? void 0 : _a25.app) || devtoolsState.highPerfModeEnabled)
       return;
     const inspector = getInspector(inspectorId, plugin.descriptor.app);
     const _payload = {
@@ -2537,10 +2539,11 @@ function createDevToolsCtxHooks() {
         rootNodes: _payload.rootNodes
       })));
     }, "sendInspectorTreeToClient" /* SEND_INSPECTOR_TREE_TO_CLIENT */);
-  });
-  hooks2.hook("sendInspectorState" /* SEND_INSPECTOR_STATE */, async ({ inspectorId, plugin }) => {
+  }, 120);
+  hooks2.hook("sendInspectorTree" /* SEND_INSPECTOR_TREE */, debounceSendInspectorTree);
+  const debounceSendInspectorState = (0, import_perfect_debounce2.debounce)(async ({ inspectorId, plugin }) => {
     var _a25;
-    if (!inspectorId || !((_a25 = plugin == null ? void 0 : plugin.descriptor) == null ? void 0 : _a25.app))
+    if (!inspectorId || !((_a25 = plugin == null ? void 0 : plugin.descriptor) == null ? void 0 : _a25.app) || devtoolsState.highPerfModeEnabled)
       return;
     const inspector = getInspector(inspectorId, plugin.descriptor.app);
     const _payload = {
@@ -2567,7 +2570,8 @@ function createDevToolsCtxHooks() {
         state: _payload.state
       })));
     }, "sendInspectorStateToClient" /* SEND_INSPECTOR_STATE_TO_CLIENT */);
-  });
+  }, 120);
+  hooks2.hook("sendInspectorState" /* SEND_INSPECTOR_STATE */, debounceSendInspectorState);
   hooks2.hook("customInspectorSelectNode" /* CUSTOM_INSPECTOR_SELECT_NODE */, ({ inspectorId, nodeId, plugin }) => {
     const inspector = getInspector(inspectorId, plugin.descriptor.app);
     if (!inspector)
@@ -2578,6 +2582,10 @@ function createDevToolsCtxHooks() {
     addTimelineLayer(options, plugin.descriptor);
   });
   hooks2.hook("timelineEventAdded" /* TIMELINE_EVENT_ADDED */, ({ options, plugin }) => {
+    var _a25;
+    const internalLayerIds = ["performance", "component-event", "keyboard", "mouse"];
+    if (devtoolsState.highPerfModeEnabled || !((_a25 = devtoolsState.timelineLayersState) == null ? void 0 : _a25[plugin.descriptor.id]) && !internalLayerIds.includes(options.layerId))
+      return;
     hooks2.callHookWith(async (callbacks) => {
       await Promise.all(callbacks.map((cb) => cb(options)));
     }, "sendTimelineEventToClient" /* SEND_TIMELINE_EVENT_TO_CLIENT */);
@@ -2639,10 +2647,10 @@ function initStateFactory() {
 }
 var _a9, _b9;
 (_b9 = (_a9 = import_devtools_shared7.target)[STATE_KEY]) != null ? _b9 : _a9[STATE_KEY] = initStateFactory();
-var callStateUpdatedHook = (0, import_perfect_debounce2.debounce)((state) => {
+var callStateUpdatedHook = (0, import_perfect_debounce3.debounce)((state) => {
   devtoolsContext.hooks.callHook("devtoolsStateUpdated" /* DEVTOOLS_STATE_UPDATED */, { state });
 });
-var callConnectedUpdatedHook = (0, import_perfect_debounce2.debounce)((state, oldState) => {
+var callConnectedUpdatedHook = (0, import_perfect_debounce3.debounce)((state, oldState) => {
   devtoolsContext.hooks.callHook("devtoolsConnectedUpdated" /* DEVTOOLS_CONNECTED_UPDATED */, { state, oldState });
 });
 var devtoolsAppRecords = new Proxy(import_devtools_shared7.target.__VUE_DEVTOOLS_KIT_APP_RECORDS__, {
@@ -3176,7 +3184,7 @@ var DevToolsPluginAPI = DevToolsV6PluginAPI;
 
 // src/core/plugin/components.ts
 init_cjs_shims();
-var import_perfect_debounce3 = require("perfect-debounce");
+var import_perfect_debounce4 = require("perfect-debounce");
 
 // src/core/component/state/index.ts
 init_cjs_shims();
@@ -4088,10 +4096,10 @@ function createComponentsDevToolsPlugin(app) {
         await api.sendInspectorState("components");
       }
     });
-    const debounceSendInspectorTree = (0, import_perfect_debounce3.debounce)(() => {
+    const debounceSendInspectorTree = (0, import_perfect_debounce4.debounce)(() => {
       api.sendInspectorTree(INSPECTOR_ID);
     }, 120);
-    const debounceSendInspectorState = (0, import_perfect_debounce3.debounce)(() => {
+    const debounceSendInspectorState = (0, import_perfect_debounce4.debounce)(() => {
       api.sendInspectorState(INSPECTOR_ID);
     }, 120);
     const componentAddedCleanup = hook.on.componentAdded(async (app2, uid, parentUid, component) => {
@@ -4213,7 +4221,7 @@ function registerDevToolsPlugin(app) {
 // src/core/router/index.ts
 init_cjs_shims();
 var import_devtools_shared16 = require("@vue/devtools-shared");
-var import_perfect_debounce4 = require("perfect-debounce");
+var import_perfect_debounce5 = require("perfect-debounce");
 
 // src/ctx/router.ts
 init_cjs_shims();
@@ -4291,11 +4299,13 @@ function normalizeRouterInfo(appRecord, activeAppRecord2) {
     console.warn = c;
   }
   init();
-  hook.on.componentUpdated((0, import_perfect_debounce4.debounce)(() => {
+  hook.on.componentUpdated((0, import_perfect_debounce5.debounce)(() => {
     var _a25;
     if (((_a25 = activeAppRecord2.value) == null ? void 0 : _a25.app) !== appRecord.app)
       return;
     init();
+    if (devtoolsState.highPerfModeEnabled)
+      return;
     devtoolsContext.hooks.callHook("routerInfoUpdated" /* ROUTER_INFO_UPDATED */, { state: import_devtools_shared16.target[ROUTER_INFO_KEY] });
   }, 200));
 }

package/dist/index.js

@@ -2240,7 +2240,7 @@ import { target as target5 } from "@vue/devtools-shared";
 // src/ctx/state.ts
 init_esm_shims();
 import { target as global, isUrlString } from "@vue/devtools-shared";
-import { debounce as debounce2 } from "perfect-debounce";
+import { debounce as debounce3 } from "perfect-debounce";
 
 // src/core/timeline/storage.ts
 init_esm_shims();
@@ -2277,6 +2277,7 @@ function getTimelineLayersStateFromStorage() {
 // src/ctx/hook.ts
 init_esm_shims();
 import { createHooks } from "hookable";
+import { debounce as debounce2 } from "perfect-debounce";
 
 // src/ctx/inspector.ts
 init_esm_shims();
@@ -2294,6 +2295,7 @@ var devtoolsTimelineLayers = new Proxy(target3.__VUE_DEVTOOLS_KIT_TIMELINE_LAYER
   }
 });
 function addTimelineLayer(options, descriptor) {
+  devtoolsState.timelineLayersState[descriptor.id] = false;
   devtoolsTimelineLayers.push({
     ...options,
     descriptorId: descriptor.id,
@@ -2423,9 +2425,9 @@ function createDevToolsCtxHooks() {
   hooks2.hook("addInspector" /* ADD_INSPECTOR */, ({ inspector, plugin }) => {
     addInspector(inspector, plugin.descriptor);
   });
-  hooks2.hook("sendInspectorTree" /* SEND_INSPECTOR_TREE */, async ({ inspectorId, plugin }) => {
+  const debounceSendInspectorTree = debounce2(async ({ inspectorId, plugin }) => {
     var _a25;
-    if (!inspectorId || !((_a25 = plugin == null ? void 0 : plugin.descriptor) == null ? void 0 : _a25.app))
+    if (!inspectorId || !((_a25 = plugin == null ? void 0 : plugin.descriptor) == null ? void 0 : _a25.app) || devtoolsState.highPerfModeEnabled)
       return;
     const inspector = getInspector(inspectorId, plugin.descriptor.app);
     const _payload = {
@@ -2446,10 +2448,11 @@ function createDevToolsCtxHooks() {
         rootNodes: _payload.rootNodes
       })));
     }, "sendInspectorTreeToClient" /* SEND_INSPECTOR_TREE_TO_CLIENT */);
-  });
-  hooks2.hook("sendInspectorState" /* SEND_INSPECTOR_STATE */, async ({ inspectorId, plugin }) => {
+  }, 120);
+  hooks2.hook("sendInspectorTree" /* SEND_INSPECTOR_TREE */, debounceSendInspectorTree);
+  const debounceSendInspectorState = debounce2(async ({ inspectorId, plugin }) => {
     var _a25;
-    if (!inspectorId || !((_a25 = plugin == null ? void 0 : plugin.descriptor) == null ? void 0 : _a25.app))
+    if (!inspectorId || !((_a25 = plugin == null ? void 0 : plugin.descriptor) == null ? void 0 : _a25.app) || devtoolsState.highPerfModeEnabled)
       return;
     const inspector = getInspector(inspectorId, plugin.descriptor.app);
     const _payload = {
@@ -2476,7 +2479,8 @@ function createDevToolsCtxHooks() {
         state: _payload.state
       })));
     }, "sendInspectorStateToClient" /* SEND_INSPECTOR_STATE_TO_CLIENT */);
-  });
+  }, 120);
+  hooks2.hook("sendInspectorState" /* SEND_INSPECTOR_STATE */, debounceSendInspectorState);
   hooks2.hook("customInspectorSelectNode" /* CUSTOM_INSPECTOR_SELECT_NODE */, ({ inspectorId, nodeId, plugin }) => {
     const inspector = getInspector(inspectorId, plugin.descriptor.app);
     if (!inspector)
@@ -2487,6 +2491,10 @@ function createDevToolsCtxHooks() {
     addTimelineLayer(options, plugin.descriptor);
   });
   hooks2.hook("timelineEventAdded" /* TIMELINE_EVENT_ADDED */, ({ options, plugin }) => {
+    var _a25;
+    const internalLayerIds = ["performance", "component-event", "keyboard", "mouse"];
+    if (devtoolsState.highPerfModeEnabled || !((_a25 = devtoolsState.timelineLayersState) == null ? void 0 : _a25[plugin.descriptor.id]) && !internalLayerIds.includes(options.layerId))
+      return;
     hooks2.callHookWith(async (callbacks) => {
       await Promise.all(callbacks.map((cb) => cb(options)));
     }, "sendTimelineEventToClient" /* SEND_TIMELINE_EVENT_TO_CLIENT */);
@@ -2548,10 +2556,10 @@ function initStateFactory() {
 }
 var _a9, _b9;
 (_b9 = (_a9 = global)[STATE_KEY]) != null ? _b9 : _a9[STATE_KEY] = initStateFactory();
-var callStateUpdatedHook = debounce2((state) => {
+var callStateUpdatedHook = debounce3((state) => {
   devtoolsContext.hooks.callHook("devtoolsStateUpdated" /* DEVTOOLS_STATE_UPDATED */, { state });
 });
-var callConnectedUpdatedHook = debounce2((state, oldState) => {
+var callConnectedUpdatedHook = debounce3((state, oldState) => {
   devtoolsContext.hooks.callHook("devtoolsConnectedUpdated" /* DEVTOOLS_CONNECTED_UPDATED */, { state, oldState });
 });
 var devtoolsAppRecords = new Proxy(global.__VUE_DEVTOOLS_KIT_APP_RECORDS__, {
@@ -3085,7 +3093,7 @@ var DevToolsPluginAPI = DevToolsV6PluginAPI;
 
 // src/core/plugin/components.ts
 init_esm_shims();
-import { debounce as debounce3 } from "perfect-debounce";
+import { debounce as debounce4 } from "perfect-debounce";
 
 // src/core/component/state/index.ts
 init_esm_shims();
@@ -3997,10 +4005,10 @@ function createComponentsDevToolsPlugin(app) {
         await api.sendInspectorState("components");
       }
     });
-    const debounceSendInspectorTree = debounce3(() => {
+    const debounceSendInspectorTree = debounce4(() => {
       api.sendInspectorTree(INSPECTOR_ID);
     }, 120);
-    const debounceSendInspectorState = debounce3(() => {
+    const debounceSendInspectorState = debounce4(() => {
       api.sendInspectorState(INSPECTOR_ID);
     }, 120);
     const componentAddedCleanup = hook.on.componentAdded(async (app2, uid, parentUid, component) => {
@@ -4122,7 +4130,7 @@ function registerDevToolsPlugin(app) {
 // src/core/router/index.ts
 init_esm_shims();
 import { deepClone, target as global3 } from "@vue/devtools-shared";
-import { debounce as debounce4 } from "perfect-debounce";
+import { debounce as debounce5 } from "perfect-debounce";
 
 // src/ctx/router.ts
 init_esm_shims();
@@ -4200,11 +4208,13 @@ function normalizeRouterInfo(appRecord, activeAppRecord2) {
     console.warn = c;
   }
   init();
-  hook.on.componentUpdated(debounce4(() => {
+  hook.on.componentUpdated(debounce5(() => {
     var _a25;
     if (((_a25 = activeAppRecord2.value) == null ? void 0 : _a25.app) !== appRecord.app)
       return;
     init();
+    if (devtoolsState.highPerfModeEnabled)
+      return;
     devtoolsContext.hooks.callHook("routerInfoUpdated" /* ROUTER_INFO_UPDATED */, { state: global3[ROUTER_INFO_KEY] });
   }, 200));
 }

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@vue/devtools-kit",
   "type": "module",
-  "version": "7.5.4",
+  "version": "7.5.6",
   "author": "webfansplz",
   "license": "MIT",
   "repository": {
     "directory": "packages/devtools-kit",
     "type": "git",
-    "url": "git+https://github.com/vuejs/devtools-next.git"
+    "url": "git+https://github.com/vuejs/devtools.git"
   },
   "exports": {
     ".": {
@@ -29,7 +29,7 @@
     "perfect-debounce": "^1.0.0",
     "speakingurl": "^14.0.1",
     "superjson": "^2.2.1",
-    "@vue/devtools-shared": "^7.5.4"
+    "@vue/devtools-shared": "^7.5.6"
   },
   "devDependencies": {
     "@types/speakingurl": "^13.0.6",