diff --git a/app/web/src/nova/ed/logic/ed-init.ts b/app/web/src/nova/ed/logic/ed-init.ts
index 5dbd2f51..65dc435d 100644
--- a/app/web/src/nova/ed/logic/ed-init.ts
+++ b/app/web/src/nova/ed/logic/ed-init.ts
@@ -1,12 +1,38 @@
 import init from "wasm-gzip";
 import { PG } from "./ed-global";
 import { jscript } from "../../../utils/script/jscript";
+import { viLoadLegacy } from "../../vi/load/load-legacy";
 
 export const edInit = async (p: PG) => {
   p.status = "ready";
 
   await init();
   jscript.init(p.render);
+
+  await viLoadLegacy({
+    site: {
+      api_url: p.site.config.api_url,
+      id: p.site.id,
+      api: {
+        get() {
+          return p.script.api;
+        },
+        set(val) {
+          p.script.api = val;
+        },
+      },
+      db: {
+        get() {
+          return p.script.db;
+        },
+        set(val) {
+          p.script.db = val;
+        },
+      },
+    },
+    render: p.render,
+  });
+
   p.script.loaded = true;
   p.render();
 };
diff --git a/app/web/src/nova/ed/logic/tree/build.tsx b/app/web/src/nova/ed/logic/tree/build.tsx
index df207e09..114c9b79 100644
--- a/app/web/src/nova/ed/logic/tree/build.tsx
+++ b/app/web/src/nova/ed/logic/tree/build.tsx
@@ -1,5 +1,4 @@
 import { IItem, MItem } from "../../../../utils/types/item";
-import { viEvalScript } from "../../../vi/render/script";
 import { genMeta } from "../../../view/logic/meta/meta";
 import { IMeta, PG, active } from "../ed-global";
 import { pushTreeNode } from "./build/push-tree";
@@ -31,7 +30,6 @@ export const treeRebuild = async (p: PG, arg?: { note?: string }) => {
   for (const mitem of mitems) {
     const item = mitem.toJSON() as IItem;
     if (item) {
-      p.page;
       genMeta(
         {
           comps: p.comp.loaded,
@@ -43,9 +41,9 @@ export const treeRebuild = async (p: PG, arg?: { note?: string }) => {
                 pushTreeNode(p, m, meta);
               }
 
-              if (m.item.adv?.jsBuilt) {
-                viEvalScript({ meta: p.page.meta }, m);
-              }
+              // if (m.item.adv?.jsBuilt) {
+              //   viEvalScript({ meta: p.page.meta }, m);
+              // }
             },
           },
         },
diff --git a/app/web/src/nova/ed/logic/tree/build/push-tree.tsx b/app/web/src/nova/ed/logic/tree/build/push-tree.tsx
index b39dccf4..b31434f2 100644
--- a/app/web/src/nova/ed/logic/tree/build/push-tree.tsx
+++ b/app/web/src/nova/ed/logic/tree/build/push-tree.tsx
@@ -26,19 +26,23 @@ export const pushTreeNode = (
     }
   }
 
-  if (!meta.parent?.comp_id) {
-    p.page.tree.push({
-      id: meta.item.id,
-      parent: meta.parent?.id || "root",
-      text: meta.item.name,
-      data: meta,
-    });
-  } else if (meta.jsx_prop) {
-    p.page.tree.push({
-      id: meta.item.id,
-      parent: meta.parent?.instance_id || "root",
-      text: meta.item.name,
-      data: meta,
-    });
+  if (p.page.tree.find((t) => t.id === meta.item.id)) {
+    console.log(meta.item.id, meta.item.name);
+  } else {
+    if (!meta.parent?.comp_id) {
+      p.page.tree.push({
+        id: meta.item.id,
+        parent: meta.parent?.id || "root",
+        text: meta.item.name,
+        data: meta,
+      });
+    } else if (meta.jsx_prop) {
+      p.page.tree.push({
+        id: meta.item.id,
+        parent: meta.parent?.instance_id || "root",
+        text: meta.item.name,
+        data: meta,
+      });
+    }
   }
 };
diff --git a/app/web/src/nova/ed/panel/main/main.tsx b/app/web/src/nova/ed/panel/main/main.tsx
index 9382b4ea..0b6160c4 100644
--- a/app/web/src/nova/ed/panel/main/main.tsx
+++ b/app/web/src/nova/ed/panel/main/main.tsx
@@ -1,7 +1,6 @@
 import { useGlobal } from "web-utils";
 import { Vi } from "../../../vi/vi";
 import { EDGlobal } from "../../logic/ed-global";
-import { ViGlobal } from "../../../vi/render/global";
 
 export const EdMain = () => {
   const p = useGlobal(EDGlobal, "EDITOR");
@@ -12,6 +11,8 @@ export const EdMain = () => {
       api_url={p.site.config.api_url}
       site_id={p.site.id}
       entry={p.page.entry}
+      api={p.script.api}
+      db={p.script.db}
     />
   );
 
diff --git a/app/web/src/nova/vi/load/load-legacy.tsx b/app/web/src/nova/vi/load/load-legacy.tsx
index 57ef9494..5fe6511d 100644
--- a/app/web/src/nova/vi/load/load-legacy.tsx
+++ b/app/web/src/nova/vi/load/load-legacy.tsx
@@ -1,8 +1,27 @@
 import importModule from "../../../render/editor/tools/dynamic-import";
 import { createAPI, createDB, initApi } from "../../../utils/script/init-api";
-import { VG } from "../render/global";
 
-export const viLoadLegacy = async (vi: VG) => {
+export const viLoadLegacy = async (vi: {
+  site: {
+    id: string;
+    api_url: string;
+    api: {
+      get: () => any;
+      set: (val: any) => void;
+    };
+    db: {
+      get: () => any;
+      set: (val: any) => void;
+    };
+  };
+  render: any;
+}) => {
+  const w = window as any;
+
+  if (!w.exports) {
+    w.exports = {};
+  }
+
   const site = await db.site.findFirst({
     where: { id: vi.site.id },
     include: { component_site: true },
@@ -20,16 +39,20 @@ export const viLoadLegacy = async (vi: VG) => {
 
     const path = `/npm/site/${vi.site.id}/site.js`;
     await importModule(path);
-    vi.site.db = createDB(vi.site.api_url);
-    vi.site.api = createAPI(vi.site.api_url);
+    if (!vi.site.db.get()) {
+      vi.site.db.set(createDB(vi.site.api_url));
+    }
+    if (!vi.site.api.get()) {
+      vi.site.api.set(createAPI(vi.site.api_url));
+    }
 
     const w = window as any;
     if (site.js_compiled) {
       const config = site.config as any;
       const exec = (fn: string, scopes: any) => {
         if (config.api_url && !scopes["api"]) {
-          scopes["api"] = vi.site.api;
-          scopes["db"] = vi.site.db;
+          scopes["api"] = vi.site.api.get();
+          scopes["db"] = vi.site.db.get();
         }
         scopes.params = w.params;
         scopes.module = {};
diff --git a/app/web/src/nova/vi/load/load.tsx b/app/web/src/nova/vi/load/load.tsx
index 582023eb..ccf5266c 100644
--- a/app/web/src/nova/vi/load/load.tsx
+++ b/app/web/src/nova/vi/load/load.tsx
@@ -1,19 +1,40 @@
 import { VG } from "../render/global";
 import { viLoadLegacy } from "./load-legacy";
 
-const w = window as any;
-
 export const viLoad = (vi: VG, arg: { site_id: string; api_url: string }) => {
   vi.status = "loading";
   vi.site.id = arg.site_id;
   vi.site.api_url = arg.api_url;
 
-  if (!w.exports) {
-    w.exports = {};
-  }
-
-  viLoadLegacy(vi).then(() => {
+  if (!vi.site.api && !vi.site.db) {
+    viLoadLegacy({
+      site: {
+        id: vi.site.id,
+        api_url: vi.site.api_url,
+        api: {
+          get() {
+            return vi.site.api;
+          },
+          set(val) {
+            vi.site.api = val;
+          },
+        },
+        db: {
+          get() {
+            return vi.site.db;
+          },
+          set(val) {
+            vi.site.db = val;
+          },
+        },
+      },
+      render: vi.render,
+    }).then(() => {
+      vi.status = "ready";
+      vi.render();
+    });
+  } else {
     vi.status = "ready";
     vi.render();
-  });
+  }
 };
diff --git a/app/web/src/nova/vi/render/script/scope-meta.ts b/app/web/src/nova/vi/render/script/scope-meta.ts
index 25fa4286..816f5413 100644
--- a/app/web/src/nova/vi/render/script/scope-meta.ts
+++ b/app/web/src/nova/vi/render/script/scope-meta.ts
@@ -39,16 +39,10 @@ const getScopeMeta = (vi: { meta: VG["meta"] }, meta: IMeta) => {
   return scope_meta;
 };
 
-const getScopeValue = (
-  scope_meta: ReturnType<typeof getScopeMeta>,
-  meta: IMeta
-) => {
+const getScopeValue = (scope_meta: ReturnType<typeof getScopeMeta>) => {
   const scope: any = {};
 
   for (const [varname, s] of Object.entries(scope_meta)) {
-    if (meta.item.name === "section") {
-      console.log(varname, s.meta.scope);
-    }
     if (s.meta.scope.val) {
       scope[varname] = s.meta.scope.val[varname];
     }
@@ -60,5 +54,5 @@ const getScopeValue = (
 export const getScope = (vi: { meta: VG["meta"] }, meta: IMeta) => {
   const scope_meta = getScopeMeta(vi, meta);
 
-  return getScopeValue(scope_meta, meta);
+  return getScopeValue(scope_meta);
 };
diff --git a/app/web/src/nova/vi/vi.tsx b/app/web/src/nova/vi/vi.tsx
index 46d6531c..e3dfbc76 100644
--- a/app/web/src/nova/vi/vi.tsx
+++ b/app/web/src/nova/vi/vi.tsx
@@ -11,13 +11,17 @@ export const Vi: FC<{
   entry: string[];
   api_url: string;
   site_id: string;
-}> = ({ meta, entry, api_url, site_id }) => {
+  api?: any;
+  db?: any;
+}> = ({ meta, entry, api_url, site_id, api, db }) => {
   const vi = useGlobal(ViGlobal, "VI");
   if (vi.meta !== meta) {
     vi.meta = meta;
   }
 
   if (vi.status === "init") {
+    vi.site.db = db;
+    vi.site.api = api;
     viLoad(vi, { api_url, site_id });
   }
 
diff --git a/app/web/src/nova/view/logic/meta/comp.tsx b/app/web/src/nova/view/logic/meta/comp.tsx
index b3a17fab..b9480745 100644
--- a/app/web/src/nova/view/logic/meta/comp.tsx
+++ b/app/web/src/nova/view/logic/meta/comp.tsx
@@ -1,4 +1,4 @@
-import { instantiate } from "./comp/instantiate";
+import { instantiate, walkChild } from "./comp/instantiate";
 import { walkProp } from "./comp/walk-prop";
 import { genMeta } from "./meta";
 import { simplifyItemChild } from "./simplify";
@@ -53,6 +53,12 @@ export const genComp = (p: GenMetaP, arg: GenMetaArg) => {
         scope: {},
       };
 
+      if (item.id) {
+        if (p.set_meta !== false) {
+          p.meta[item.id] = meta;
+        }
+      }
+
       walkProp({
         item,
         pcomp,
@@ -63,6 +69,8 @@ export const genComp = (p: GenMetaP, arg: GenMetaArg) => {
             prop.content &&
             comp_id
           ) {
+            walkChild(prop.content, instance);
+
             genMeta(p, {
               item: prop.content,
               is_root: false,
@@ -73,6 +81,7 @@ export const genComp = (p: GenMetaP, arg: GenMetaArg) => {
               },
               parent: {
                 item,
+                instance_id: item.id,
                 comp: pcomp.comp,
               },
             });
@@ -88,17 +97,12 @@ export const genComp = (p: GenMetaP, arg: GenMetaArg) => {
         }
       }
 
-      if (item.id) {
-        if (p.set_meta !== false) {
-          p.meta[item.id] = meta;
-        }
-      }
-
       if (p.on?.visit) {
         p.on.visit(meta);
       }
 
       for (const child of Object.values(item.childs)) {
+        if (child.name.startsWith('jsx:')) continue;
         genMeta(p, {
           item: child,
           is_root: false,
diff --git a/app/web/src/nova/view/logic/meta/comp/instantiate.tsx b/app/web/src/nova/view/logic/meta/comp/instantiate.tsx
index 8a098e0c..80262328 100644
--- a/app/web/src/nova/view/logic/meta/comp/instantiate.tsx
+++ b/app/web/src/nova/view/logic/meta/comp/instantiate.tsx
@@ -30,7 +30,7 @@ export const instantiate = (arg: {
   }
 };
 
-const walkChild = (
+export const walkChild = (
   item: IItem,
   ids: Exclude<FNComponent["ref_ids"], undefined>
 ) => {
diff --git a/app/web/src/nova/view/logic/meta/meta.tsx b/app/web/src/nova/view/logic/meta/meta.tsx
index 3ba07660..aa8cdc01 100644
--- a/app/web/src/nova/view/logic/meta/meta.tsx
+++ b/app/web/src/nova/view/logic/meta/meta.tsx
@@ -4,65 +4,65 @@ import { simplifyItemChild } from "./simplify";
 import { GenMetaArg, GenMetaP, IMeta } from "./types";
 
 export const genMeta = (p: GenMetaP, arg: GenMetaArg) => {
-  let wrapper = (fn: any) => {
-    fn();
+  // let wrapper = (fn: any) => {
+  //   fn();
+  // };
+
+  // wrapper(() => {
+  const item = arg.item as IItem;
+
+  if (item.type === "item" && item.component?.id) {
+    genComp(p, arg);
+    return;
+  }
+
+  let scope: IMeta["scope"] = {};
+  if (p.smeta) {
+    if (p.smeta[item.id] && p.smeta[item.id].scope) {
+      scope.def = p.smeta[item.id].scope;
+    }
+  }
+
+  const meta: IMeta = {
+    item: simplifyItemChild(item),
+    jsx_prop: arg.jsx_prop,
+    parent: {
+      id: arg.parent?.item.id || "root",
+      instance_id: arg.parent?.instance_id,
+      comp_id: arg.parent?.comp?.id,
+    },
+    scope,
   };
 
-  wrapper(() => {
-    const item = arg.item as IItem;
+  if (p.on?.visit) {
+    p.on.visit(meta);
+  }
 
-    if (item.type === "item" && item.component?.id) {
-      genComp(p, arg);
-      return;
+  if (p.on) {
+    if (p.on.item_exists && p.meta[item.id]) {
+      p.on.item_exists({ old: p.meta[item.id], new: meta });
+    } else if (p.on.item_new && !p.meta[item.id]) {
+      p.on.item_new({ new: meta });
     }
+  }
+  if (item.id) {
+    if (p.set_meta !== false) {
+      p.meta[item.id] = meta;
+    }
+  }
 
-    let scope: IMeta["scope"] = {};
-    if (p.smeta) {
-      if (p.smeta[item.id] && p.smeta[item.id].scope) {
-        scope.def = p.smeta[item.id].scope;
-      }
+  if (item.childs) {
+    for (const [_, v] of Object.entries(item.childs)) {
+      genMeta(p, {
+        item: v,
+        is_root: false,
+        parent: {
+          item,
+          instance_id: arg.parent?.instance_id,
+          comp: arg.parent?.comp,
+        },
+      });
     }
-
-    const meta: IMeta = {
-      item: simplifyItemChild(item),
-      jsx_prop: arg.jsx_prop,
-      parent: {
-        id: arg.parent?.item.id || "root",
-        instance_id: arg.parent?.instance_id,
-        comp_id: arg.parent?.comp?.id,
-      },
-      scope,
-    };
-
-    if (p.on?.visit) {
-      p.on.visit(meta);
-    }
-
-    if (p.on) {
-      if (p.on.item_exists && p.meta[item.id]) {
-        p.on.item_exists({ old: p.meta[item.id], new: meta });
-      } else if (p.on.item_new && !p.meta[item.id]) {
-        p.on.item_new({ new: meta });
-      }
-    }
-    if (item.id) {
-      if (p.set_meta !== false) {
-        p.meta[item.id] = meta;
-      }
-    }
-
-    if (item.childs) {
-      for (const [_, v] of Object.entries(item.childs)) {
-        genMeta(p, {
-          item: v,
-          is_root: false,
-          parent: {
-            item,
-            instance_id: arg.parent?.instance_id,
-            comp: arg.parent?.comp,
-          },
-        });
-      }
-    }
-  });
+  }
+  // });
 };
diff --git a/pkgs/web-utils/src/use-global.ts b/pkgs/web-utils/src/use-global.ts
index 78865d12..d8538fd4 100644
--- a/pkgs/web-utils/src/use-global.ts
+++ b/pkgs/web-utils/src/use-global.ts
@@ -7,10 +7,6 @@ import {
   useState,
 } from "react";
 
-const w = window as unknown as {
-  globalValueID: WeakMap<any, string>;
-};
-
 export const GlobalContext = createContext({
   global: {},
   render: () => {},
@@ -25,8 +21,12 @@ export const useGlobal = <T extends object>(
   effectOrID?:
     | (() => Promise<void | (() => void)> | void | (() => void))
     | string,
-  id?: string
+  id?: string 
 ): T & { render: (reset?: boolean) => void } => {
+  const w = window as unknown as {
+    globalValueID: WeakMap<any, string>;
+  };
+
   if (!w.globalValueID) w.globalValueID = new WeakMap();
 
   let _id = (typeof effectOrID === "string" ? effectOrID : id) as string;