vue-hook-optimizer 0.0.12 → 0.0.14

Sign up to get free protection for your applications and to get access to all the features.
package/README.md CHANGED
@@ -16,7 +16,6 @@ pnpm run play
16
16
 
17
17
  Open the browser and visit `http://localhost:3000/`.
18
18
 
19
- ![playground](./images/playground1.png)
20
19
 
21
20
  ## How To Use
22
21
 
@@ -28,7 +27,7 @@ Open the browser and visit `http://localhost:3000/`.
28
27
 
29
28
  The tool will analyze the code, and show the relations between the variables and the methods. This is a simple demo.
30
29
 
31
- ![demo](./images/demo1.png)
30
+ ![playground](./images/playground1.png)
32
31
 
33
32
  ## Motive
34
33
 
@@ -39,7 +38,7 @@ So I want to build a tool to help us analyze the code, and find the relations be
39
38
  ## Development Plan
40
39
 
41
40
  - [ ] add ~~node type~~ (has added `var` and `fun` types) and more info
42
- - [ ] provide some suggestions for optimization
41
+ - [x] provide some suggestions for optimization
43
42
  - [x] support `options api`
44
43
  - [x] [vscode extension](./packages/vscode)
45
44
 
package/dist/index.d.mts CHANGED
@@ -1,56 +1,38 @@
1
1
  export { parse } from '@vue/compiler-sfc';
2
2
  import * as vis_network from 'vis-network';
3
3
 
4
- declare function analyze$2(content: string): Set<string>;
5
-
4
+ type TypedNode = {
5
+ label: string;
6
+ type: NodeType;
7
+ };
6
8
  declare enum NodeType {
7
9
  var = "var",
8
10
  fun = "fun"
9
11
  }
10
12
 
13
+ declare function analyze$2(content: string): Set<string>;
14
+
11
15
  declare function analyze$1(content: string): {
12
- nodes: Set<{
13
- label: string;
14
- type: NodeType;
15
- }>;
16
- edges: Map<{
17
- label: string;
18
- type: NodeType;
19
- }, Set<{
20
- label: string;
21
- type: NodeType;
22
- }>>;
16
+ nodes: Set<TypedNode>;
17
+ edges: Map<TypedNode, Set<TypedNode>>;
23
18
  };
24
19
 
25
20
  declare function analyze(content: string): {
26
- nodes: Set<{
27
- label: string;
28
- type: NodeType;
29
- }>;
30
- edges: Map<{
31
- label: string;
32
- type: NodeType;
33
- }, Set<{
34
- label: string;
35
- type: NodeType;
36
- }>>;
21
+ nodes: Set<TypedNode>;
22
+ edges: Map<TypedNode, Set<TypedNode>>;
37
23
  };
38
24
 
25
+ declare function gen(graph: {
26
+ nodes: Set<TypedNode>;
27
+ edges: Map<TypedNode, Set<TypedNode>>;
28
+ }, usedNodes: Set<string>): string[];
29
+
39
30
  declare function getVisData(graph: {
40
- nodes: Set<{
41
- label: string;
42
- type: string;
43
- }>;
44
- edges: Map<{
45
- label: string;
46
- type: string;
47
- }, Set<{
48
- label: string;
49
- type: string;
50
- }>>;
31
+ nodes: Set<TypedNode>;
32
+ edges: Map<TypedNode, Set<TypedNode>>;
51
33
  }, usedNodes: Set<string>): {
52
34
  nodes: vis_network.Node[];
53
35
  edges: vis_network.Edge[];
54
36
  };
55
37
 
56
- export { analyze as analyzeOptions, analyze$1 as analyzeSetupScript, analyze$2 as analyzeTemplate, getVisData };
38
+ export { NodeType, TypedNode, analyze as analyzeOptions, analyze$1 as analyzeSetupScript, analyze$2 as analyzeTemplate, gen, getVisData };
package/dist/index.d.ts CHANGED
@@ -1,56 +1,38 @@
1
1
  export { parse } from '@vue/compiler-sfc';
2
2
  import * as vis_network from 'vis-network';
3
3
 
4
- declare function analyze$2(content: string): Set<string>;
5
-
4
+ type TypedNode = {
5
+ label: string;
6
+ type: NodeType;
7
+ };
6
8
  declare enum NodeType {
7
9
  var = "var",
8
10
  fun = "fun"
9
11
  }
10
12
 
13
+ declare function analyze$2(content: string): Set<string>;
14
+
11
15
  declare function analyze$1(content: string): {
12
- nodes: Set<{
13
- label: string;
14
- type: NodeType;
15
- }>;
16
- edges: Map<{
17
- label: string;
18
- type: NodeType;
19
- }, Set<{
20
- label: string;
21
- type: NodeType;
22
- }>>;
16
+ nodes: Set<TypedNode>;
17
+ edges: Map<TypedNode, Set<TypedNode>>;
23
18
  };
24
19
 
25
20
  declare function analyze(content: string): {
26
- nodes: Set<{
27
- label: string;
28
- type: NodeType;
29
- }>;
30
- edges: Map<{
31
- label: string;
32
- type: NodeType;
33
- }, Set<{
34
- label: string;
35
- type: NodeType;
36
- }>>;
21
+ nodes: Set<TypedNode>;
22
+ edges: Map<TypedNode, Set<TypedNode>>;
37
23
  };
38
24
 
25
+ declare function gen(graph: {
26
+ nodes: Set<TypedNode>;
27
+ edges: Map<TypedNode, Set<TypedNode>>;
28
+ }, usedNodes: Set<string>): string[];
29
+
39
30
  declare function getVisData(graph: {
40
- nodes: Set<{
41
- label: string;
42
- type: string;
43
- }>;
44
- edges: Map<{
45
- label: string;
46
- type: string;
47
- }, Set<{
48
- label: string;
49
- type: string;
50
- }>>;
31
+ nodes: Set<TypedNode>;
32
+ edges: Map<TypedNode, Set<TypedNode>>;
51
33
  }, usedNodes: Set<string>): {
52
34
  nodes: vis_network.Node[];
53
35
  edges: vis_network.Edge[];
54
36
  };
55
37
 
56
- export { analyze as analyzeOptions, analyze$1 as analyzeSetupScript, analyze$2 as analyzeTemplate, getVisData };
38
+ export { NodeType, TypedNode, analyze as analyzeOptions, analyze$1 as analyzeSetupScript, analyze$2 as analyzeTemplate, gen, getVisData };
package/dist/index.js CHANGED
@@ -19802,12 +19802,12 @@ var require_gen_mapping_umd = __commonJS({
19802
19802
  };
19803
19803
  exports2.fromMap = (input2) => {
19804
19804
  const map2 = new traceMapping.TraceMap(input2);
19805
- const gen = new GenMapping({ file: map2.file, sourceRoot: map2.sourceRoot });
19806
- putAll(gen._names, map2.names);
19807
- putAll(gen._sources, map2.sources);
19808
- gen._sourcesContent = map2.sourcesContent || map2.sources.map(() => null);
19809
- gen._mappings = traceMapping.decodedMappings(map2);
19810
- return gen;
19805
+ const gen2 = new GenMapping({ file: map2.file, sourceRoot: map2.sourceRoot });
19806
+ putAll(gen2._names, map2.names);
19807
+ putAll(gen2._sources, map2.sources);
19808
+ gen2._sourcesContent = map2.sourcesContent || map2.sources.map(() => null);
19809
+ gen2._mappings = traceMapping.decodedMappings(map2);
19810
+ return gen2;
19811
19811
  };
19812
19812
  addSegmentInternal = (skipable, map2, genLine, genColumn, source, sourceLine, sourceColumn, name, content) => {
19813
19813
  const { _mappings: mappings, _sources: sources, _sourcesContent: sourcesContent, _names: names } = map2;
@@ -25138,8 +25138,8 @@ var require_lib6 = __commonJS({
25138
25138
  };
25139
25139
  exports.CodeGenerator = CodeGenerator;
25140
25140
  function generate2(ast, opts, code) {
25141
- const gen = new Generator(ast, opts, code);
25142
- return gen.generate();
25141
+ const gen2 = new Generator(ast, opts, code);
25142
+ return gen2.generate();
25143
25143
  }
25144
25144
  }
25145
25145
  });
@@ -46322,14 +46322,65 @@ var require_lib13 = __commonJS({
46322
46322
  // src/index.ts
46323
46323
  var src_exports = {};
46324
46324
  __export(src_exports, {
46325
+ NodeType: () => NodeType,
46325
46326
  analyzeOptions: () => analyze3,
46326
46327
  analyzeSetupScript: () => analyze2,
46327
46328
  analyzeTemplate: () => analyze,
46329
+ gen: () => gen,
46328
46330
  getVisData: () => getVisData,
46329
46331
  parse: () => parse$7
46330
46332
  });
46331
46333
  module.exports = __toCommonJS(src_exports);
46332
46334
 
46335
+ // src/analyze/utils.ts
46336
+ var NodeType = /* @__PURE__ */ ((NodeType3) => {
46337
+ NodeType3["var"] = "var";
46338
+ NodeType3["fun"] = "fun";
46339
+ return NodeType3;
46340
+ })(NodeType || {});
46341
+ var NodeCollection = class {
46342
+ nodes = /* @__PURE__ */ new Map();
46343
+ addNode(label, node2, options = { isComputed: false }) {
46344
+ if (this.nodes.has(label)) {
46345
+ return;
46346
+ }
46347
+ if (!options.isComputed && (node2.type === "VariableDeclarator" && [
46348
+ "ArrowFunctionExpression",
46349
+ "FunctionDeclaration"
46350
+ ].includes(node2.init?.type || "") || node2.type === "FunctionDeclaration" || node2.type === "ObjectMethod")) {
46351
+ this.nodes.set(label, {
46352
+ label,
46353
+ type: "fun" /* fun */
46354
+ });
46355
+ } else {
46356
+ this.nodes.set(label, {
46357
+ label,
46358
+ type: "var" /* var */
46359
+ });
46360
+ }
46361
+ }
46362
+ addTypedNode(label, node2) {
46363
+ this.nodes.set(label, {
46364
+ label,
46365
+ type: node2.type
46366
+ });
46367
+ }
46368
+ map(graph) {
46369
+ const nodes = new Set(Array.from(graph.nodes).map((node2) => {
46370
+ return this.nodes.get(node2);
46371
+ }).filter((node2) => !!node2));
46372
+ const edges = new Map(Array.from(graph.edges).map(([from2, to]) => {
46373
+ return [this.nodes.get(from2), new Set(Array.from(to).map((node2) => {
46374
+ return this.nodes.get(node2);
46375
+ }).filter((node2) => !!node2))];
46376
+ }));
46377
+ return {
46378
+ nodes,
46379
+ edges
46380
+ };
46381
+ }
46382
+ };
46383
+
46333
46384
  // node_modules/.pnpm/@vue+compiler-sfc@3.3.4/node_modules/@vue/compiler-sfc/dist/compiler-sfc.esm-browser.js
46334
46385
  function makeMap(str2, expectsLowerCase) {
46335
46386
  const map2 = /* @__PURE__ */ Object.create(null);
@@ -86273,52 +86324,6 @@ function analyze(content) {
86273
86324
 
86274
86325
  // src/analyze/setupScript.ts
86275
86326
  var import_traverse2 = __toESM(require_lib13());
86276
-
86277
- // src/analyze/utils.ts
86278
- var NodeCollection = class {
86279
- nodes = /* @__PURE__ */ new Map();
86280
- addNode(label, node2, options = { isComputed: false }) {
86281
- if (this.nodes.has(label)) {
86282
- return;
86283
- }
86284
- if (!options.isComputed && (node2.type === "VariableDeclarator" && [
86285
- "ArrowFunctionExpression",
86286
- "FunctionDeclaration"
86287
- ].includes(node2.init?.type || "") || node2.type === "FunctionDeclaration" || node2.type === "ObjectMethod")) {
86288
- this.nodes.set(label, {
86289
- label,
86290
- type: "fun" /* fun */
86291
- });
86292
- } else {
86293
- this.nodes.set(label, {
86294
- label,
86295
- type: "var" /* var */
86296
- });
86297
- }
86298
- }
86299
- addTypedNode(label, node2) {
86300
- this.nodes.set(label, {
86301
- label,
86302
- type: node2.type
86303
- });
86304
- }
86305
- map(graph) {
86306
- const nodes = new Set(Array.from(graph.nodes).map((node2) => {
86307
- return this.nodes.get(node2);
86308
- }).filter((node2) => !!node2));
86309
- const edges = new Map(Array.from(graph.edges).map(([from2, to]) => {
86310
- return [this.nodes.get(from2), new Set(Array.from(to).map((node2) => {
86311
- return this.nodes.get(node2);
86312
- }).filter((node2) => !!node2))];
86313
- }));
86314
- return {
86315
- nodes,
86316
- edges
86317
- };
86318
- }
86319
- };
86320
-
86321
- // src/analyze/setupScript.ts
86322
86327
  var traverse2 = (
86323
86328
  //@ts-ignore
86324
86329
  import_traverse2.default.default?.default || import_traverse2.default.default || import_traverse2.default
@@ -86808,6 +86813,99 @@ function analyze3(content) {
86808
86813
  return nodeCollection.map(graph);
86809
86814
  }
86810
86815
 
86816
+ // src/suggest/split.ts
86817
+ function dfs(graph, node2, targets, visited, component) {
86818
+ component.add(node2);
86819
+ visited.add(node2);
86820
+ targets.forEach((target) => {
86821
+ if (!visited.has(target)) {
86822
+ dfs(graph, target, graph.get(target) || /* @__PURE__ */ new Set(), visited, component);
86823
+ }
86824
+ });
86825
+ }
86826
+ function haveIntersection(setA, setB) {
86827
+ for (let item of setA) {
86828
+ if (setB.has(item)) {
86829
+ return true;
86830
+ }
86831
+ }
86832
+ return false;
86833
+ }
86834
+ function mergeSets(arr) {
86835
+ let result2 = [...arr];
86836
+ for (let i = 0; i < result2.length; i++) {
86837
+ for (let j = i + 1; j < result2.length; j++) {
86838
+ if (haveIntersection(result2[i], result2[j])) {
86839
+ const newSet = /* @__PURE__ */ new Set([...result2[i], ...result2[j]]);
86840
+ result2.splice(j, 1);
86841
+ result2.splice(i, 1);
86842
+ result2 = [...result2, newSet];
86843
+ return mergeSets(result2);
86844
+ }
86845
+ }
86846
+ }
86847
+ return result2;
86848
+ }
86849
+ function splitGraph(graph) {
86850
+ const components = [];
86851
+ const sorted = Array.from(graph).sort((a, b) => b[1].size - a[1].size);
86852
+ new Map(sorted).forEach((targets, node2) => {
86853
+ const visited = /* @__PURE__ */ new Set();
86854
+ if (!visited.has(node2)) {
86855
+ let component = /* @__PURE__ */ new Set();
86856
+ dfs(graph, node2, targets, visited, component);
86857
+ components.push(component);
86858
+ }
86859
+ });
86860
+ return mergeSets(components).map((component) => {
86861
+ const subGraph = /* @__PURE__ */ new Map();
86862
+ component.forEach((node2) => {
86863
+ const targets = graph.get(node2);
86864
+ if (targets) {
86865
+ subGraph.set(node2, targets);
86866
+ }
86867
+ });
86868
+ return subGraph;
86869
+ });
86870
+ }
86871
+
86872
+ // src/suggest/filter.ts
86873
+ function noIndegreeFilter(graph) {
86874
+ const nodes = Array.from(graph.keys());
86875
+ const indegree = /* @__PURE__ */ new Map();
86876
+ nodes.forEach((node2) => {
86877
+ indegree.set(node2, 0);
86878
+ });
86879
+ graph.forEach((targets, node2) => {
86880
+ targets.forEach((target) => {
86881
+ indegree.set(target, (indegree.get(target) || 0) + 1);
86882
+ });
86883
+ });
86884
+ return nodes.filter((node2) => indegree.get(node2) === 0);
86885
+ }
86886
+
86887
+ // src/suggest/index.ts
86888
+ function gen(graph, usedNodes) {
86889
+ const suggests = [];
86890
+ const splitedGraph = splitGraph(graph.edges);
86891
+ splitedGraph.forEach((g) => {
86892
+ const nodes = Array.from(g.keys());
86893
+ if (splitedGraph.length > 1) {
86894
+ suggests.push(`Node${nodes.length > 1 ? "s" : ""} [${nodes.length > 10 ? nodes.slice(0, 10).map((node2) => node2.label).join(",") + "...(" + nodes.length + ")" : nodes.map((node2) => node2.label).join(",")}] ${nodes.length > 1 ? "are" : "is"} isolated${nodes.length > 2 ? ", perhaps you can refactor them to an isolated file." : "."}`);
86895
+ }
86896
+ if (nodes.every((node2) => !usedNodes.has(node2.label))) {
86897
+ suggests.push(`Node${nodes.length > 1 ? "s" : ""} [${nodes.length > 10 ? nodes.slice(0, 10).map((node2) => node2.label).join(",") + "..." : nodes.map((node2) => node2.label).join(",")}] ${nodes.length > 1 ? "are" : "is"} not used, perhaps you can remove ${nodes.length > 1 ? "them" : "it"}.`);
86898
+ }
86899
+ });
86900
+ const noIndegreeNodes = noIndegreeFilter(graph.edges);
86901
+ noIndegreeNodes.forEach((node2) => {
86902
+ if (!usedNodes.has(node2.label)) {
86903
+ suggests.push(`Node [${node2.label}] is not used, perhaps you can remove it.`);
86904
+ }
86905
+ });
86906
+ return suggests;
86907
+ }
86908
+
86811
86909
  // src/vis.ts
86812
86910
  function getVisData(graph, usedNodes) {
86813
86911
  const nodes = [];
@@ -86843,9 +86941,11 @@ function getVisData(graph, usedNodes) {
86843
86941
  }
86844
86942
  // Annotate the CommonJS export names for ESM import in node:
86845
86943
  0 && (module.exports = {
86944
+ NodeType,
86846
86945
  analyzeOptions,
86847
86946
  analyzeSetupScript,
86848
86947
  analyzeTemplate,
86948
+ gen,
86849
86949
  getVisData,
86850
86950
  parse
86851
86951
  });