this code very faster

src/commands/list_index/index.ts

@@ -1,5 +1,5 @@
 import type { EdgeSortId } from "src/const/graph";
-import type { BCGraph, EdgeAttribute } from "src/graph/MyMultiGraph";
+import type { EdgeAttribute } from "src/graph/MyMultiGraph";
 import { Traverse, type EdgeTree } from "src/graph/traverse";
 import {
 	get_edge_sorter,
@@ -11,6 +11,7 @@ import type { ShowNodeOptions } from "src/interfaces/settings";
 import { Links } from "src/utils/links";
 import { untyped_pick } from "src/utils/objects";
 import { url_search_params } from "src/utils/url";
+import type { NoteGraph, RecTraversalData } from "wasm/pkg/breadcrumbs_graph_wasm";
 
 export namespace ListIndex {
 	export type Options = {
@@ -44,7 +45,7 @@ export namespace ListIndex {
 	};
 
 	export const edge_tree_to_list_index = (
-		tree: EdgeTree[],
+		tree: RecTraversalData[],
 		options: Pick<
 			Options,
 			"link_kind" | "indent" | "show_node_options" | "show_attributes"
@@ -53,21 +54,23 @@ export namespace ListIndex {
 		let index = "";
 		const real_indent = options.indent.replace(/\\t/g, "\t");
 
-		tree.forEach(({ children, depth, edge }) => {
-			const display = stringify_node(edge.target_id, edge.target_attr, {
+		tree.forEach(({ children, depth, edge, node }) => {
+			const display = stringify_node(node, {
 				show_node_options: options.show_node_options,
 			});
 
-			const link = Links.ify(edge.target_id, display, {
+			const link = Links.ify(node.path, display, {
 				link_kind: options.link_kind,
 			});
 
-			const attr = options.show_attributes.length
-				? ` (${url_search_params(
-						untyped_pick(edge.attr, options.show_attributes),
-						{ trim_lone_param: true },
-					)})`
-				: "";
+			// TODO: show_attributes
+			// const attr = options.show_attributes.length
+			// 	? ` (${url_search_params(
+			// 			untyped_pick(edge.attr, options.show_attributes),
+			// 			{ trim_lone_param: true },
+			// 		)})`
+			// 	: "";
+			const attr = "";
 
 			index += real_indent.repeat(depth) + `- ${link}${attr}\n`;
 
@@ -77,8 +80,9 @@ export namespace ListIndex {
 		return index;
 	};
 
+	// TODO
 	export const build = (
-		graph: BCGraph,
+		graph: NoteGraph,
 		start_node: string,
 		options: Options,
 	) =>

src/components/EdgeLink.svelte

@@ -4,15 +4,17 @@
 	import { stringify_node } from "src/graph/utils";
 	import type { ShowNodeOptions } from "src/interfaces/settings";
 	import BreadcrumbsPlugin from "src/main";
+	import type { EdgeData, NodeData } from "wasm/pkg/breadcrumbs_graph_wasm";
 
-	export let edge: Pick<BCEdge, "attr" | "target_id" | "target_attr">;
+	export let edge: EdgeData;
+	export let target_node: NodeData;
 	export let plugin: BreadcrumbsPlugin;
 	export let show_node_options: ShowNodeOptions;
 	export let cls = "";
 
 	const { dendron_note } = plugin.settings.explicit_edge_sources;
 
-	const display = stringify_node(edge.target_id, edge.target_attr, {
+	const display = stringify_node(target_node, {
 		show_node_options,
 		trim_basename_delimiter:
 			dendron_note.enabled && dendron_note.display_trimmed
@@ -24,9 +26,9 @@
 <ObsidianLink
 	{plugin}
 	{display}
-	path={edge.target_id}
-	resolved={edge.target_attr.resolved}
-	cls="{cls} BC-edge {edge.attr.explicit
+	path={target_node.path}
+	resolved={target_node.resolved}
+	cls="{cls} BC-edge {edge.implied
 		? 'BC-edge-explicit'
-		: `BC-edge-implied BC-edge-implied-${edge.attr.implied_kind}`}"
+		: `BC-edge-implied BC-edge-implied-${ 'transitive' /*edge.attr.implied_kind */}`}"
 />

src/components/NestedEdgeList.svelte

@@ -9,10 +9,11 @@
 	import EdgeLink from "./EdgeLink.svelte";
 	import ChevronOpener from "./button/ChevronOpener.svelte";
 	import TreeItemFlair from "./obsidian/TreeItemFlair.svelte";
+	import type { RecTraversalData } from "wasm/pkg/breadcrumbs_graph_wasm";
 
 	export let plugin: BreadcrumbsPlugin;
 
-	export let tree: EdgeTree[];
+	export let tree: RecTraversalData[];
 
 	export let open_signal: boolean | null;
 	export let show_node_options: ShowNodeOptions;
@@ -30,8 +31,8 @@
 		open_signal = null;
 	}
 </script>
-
-{#each tree.sort((a, b) => sort(a.edge, b.edge)) as item, i}
+<!-- TODO add sorting using the edge sorter -->
+{#each tree as item, i}
 	<details class="tree-item" bind:open={opens[i]}>
 		<summary class="tree-item-self is-clickable flex items-center">
 			{#if item.children.length}
@@ -44,19 +45,21 @@
 				<EdgeLink
 					{plugin}
 					edge={item.edge}
+					target_node={item.node}
 					{show_node_options}
 					cls="tree-item-inner-text"
 				/>
 			</div>
 
-			{#if show_attributes?.length}
+			<!-- TODO -->
+			<!-- {#if show_attributes?.length}
 				<TreeItemFlair
 					label={url_search_params(
 						untyped_pick(item.edge.attr, show_attributes),
 						{ trim_lone_param: true },
 					)}
 				/>
-			{/if}
+			{/if} -->
 		</summary>
 
 		{#if item.children.length}

src/components/codeblocks/CodeblockMermaid.svelte

@@ -34,8 +34,10 @@
 		mermaid = plugin.graph.generate_mermaid_graph([file_path], options.fields ?? [], options.depth[1] ?? 100).mermaid;
 	};
 
-	update();
-
+	onMount(() => {
+		update();
+	});
+
 	// const sort = get_edge_sorter(
 	// 	// @ts-expect-error: ts(2345)
 	// 	options.sort,

src/components/codeblocks/CodeblockTree.svelte

@@ -14,6 +14,7 @@
 	import NestedEdgeList from "../NestedEdgeList.svelte";
 	import CopyToClipboardButton from "../button/CopyToClipboardButton.svelte";
 	import CodeblockErrors from "./CodeblockErrors.svelte";
+	import type { RecTraversalData } from "wasm/pkg/breadcrumbs_graph_wasm";
 
 	export let plugin: BreadcrumbsPlugin;
 	export let options: ICodeblock["Options"];
@@ -27,59 +28,71 @@
 	);
 	const { show_node_options } = plugin.settings.views.codeblocks;
 
-	let tree: EdgeTree[] = [];
+	let tree: RecTraversalData[] = [];
 
-	// if the file_path is an empty string, so the code block is not rendered inside note, we fall back to the active file store
-	$: source_path = file_path
-		? file_path
-		: $active_file_store
-			? $active_file_store.path
-			: "";
-
-	// this is an exposed function that we can call from the outside to update the codeblock
 	export const update = () => {
-		tree = get_tree();
+		tree = plugin.graph.rec_traverse(
+			file_path,
+			options.fields ?? [],
+			options.depth[1] ?? 100,
+		);
 	};
 
-	const base_traversal = (attr: EdgeAttrFilters) =>
-		Traverse.build_tree(
-			plugin.graph,
-			source_path,
-			{ max_depth: options.depth[1] },
-			(e) =>
-				has_edge_attrs(e, {
-					...attr,
-					$or_target_ids: options["dataview-from-paths"],
-				}),
-		);
+	onMount(() => {
+		update();
+	});
 
-	const edge_field_labels =
-		options.fields ?? plugin.settings.edge_fields.map((f) => f.label);
-
-	const get_tree = () => {
-		if (source_path && plugin.graph.hasNode(source_path)) {
-			const traversal = options["merge-fields"]
-				? base_traversal({ $or_fields: options.fields })
-				: edge_field_labels.flatMap((field) =>
-						base_traversal({ field }),
-					);
-
-			// NOTE: The flattening is done here so that:
-			// - We can use NestedEdgeList for both modes
-			// - ListIndex builds from an EdgeTree[] as well
-			return options.flat
-				? Traverse.flatten_tree(traversal).map((item) => ({
-						depth: 0,
-						children: [],
-						edge: item.edge,
-					}))
-				: traversal;
-		} else {
-			return [];
-		}
-	};
+	// // if the file_path is an empty string, so the code block is not rendered inside note, we fall back to the active file store
+	// $: source_path = file_path
+	// 	? file_path
+	// 	: $active_file_store
+	// 		? $active_file_store.path
+	// 		: "";
+
+	// // this is an exposed function that we can call from the outside to update the codeblock
+	// export const update = () => {
+	// 	tree = get_tree();
+	// };
+
+	// const base_traversal = (attr: EdgeAttrFilters) =>
+	// 	Traverse.build_tree(
+	// 		plugin.graph,
+	// 		source_path,
+	// 		{ max_depth: options.depth[1] },
+	// 		(e) =>
+	// 			has_edge_attrs(e, {
+	// 				...attr,
+	// 				$or_target_ids: options["dataview-from-paths"],
+	// 			}),
+	// 	);
+
+	// const edge_field_labels =
+	// 	options.fields ?? plugin.settings.edge_fields.map((f) => f.label);
+
+	// const get_tree = () => {
+	// 	if (source_path && plugin.graph.hasNode(source_path)) {
+	// 		const traversal = options["merge-fields"]
+	// 			? base_traversal({ $or_fields: options.fields })
+	// 			: edge_field_labels.flatMap((field) =>
+	// 					base_traversal({ field }),
+	// 				);
+
+	// 		// NOTE: The flattening is done here so that:
+	// 		// - We can use NestedEdgeList for both modes
+	// 		// - ListIndex builds from an EdgeTree[] as well
+	// 		return options.flat
+	// 			? Traverse.flatten_tree(traversal).map((item) => ({
+	// 					depth: 0,
+	// 					children: [],
+	// 					edge: item.edge,
+	// 				}))
+	// 			: traversal;
+	// 	} else {
+	// 		return [];
+	// 	}
+	// };
 
-	onMount(update);
+	// onMount(update);
 </script>
 
 <div class="BC-codeblock-tree">

src/graph/utils.ts

@@ -7,33 +7,34 @@ import { Paths } from "src/utils/paths";
 import type {
 	BCEdge,
 	BCEdgeAttributes,
-	BCGraph,
 	BCNodeAttributes,
 } from "./MyMultiGraph";
+import type { NodeData } from "wasm/pkg/breadcrumbs_graph_wasm";
 
 export const is_self_loop = (edge: Pick<BCEdge, "source_id" | "target_id">) =>
 	edge.source_id === edge.target_id;
 
 export const stringify_node = (
-	node_id: string,
-	node_attr: BCNodeAttributes,
+	node: NodeData,
 	options?: {
 		show_node_options?: ShowNodeOptions;
 		trim_basename_delimiter?: string;
 	},
 ) => {
-	if (options?.show_node_options?.alias && node_attr.aliases?.length) {
-		return node_attr.aliases.at(0)!;
+	if (options?.show_node_options?.alias && node.aliases?.length) {
+		return node.aliases.at(0)!;
 	} else if (options?.trim_basename_delimiter) {
-		return Paths.drop_ext(node_id)
+		return Paths.drop_ext(node.path)
 			.split("/")
 			.pop()!
 			.split(options.trim_basename_delimiter)
 			.last()!;
 	} else {
-		return Paths.show(node_id, options?.show_node_options);
+		return Paths.show(node.path, options?.show_node_options);
 	}
 };
+
+// UNUSED
 export const stringify_edge = (
 	edge: BCEdge,
 	options?: {