diff --git a/packages/frontend/src/components/MkAsUi.vue b/packages/frontend/src/components/MkAsUi.vue
index 18e8e7542e3..bb050e2c640 100644
--- a/packages/frontend/src/components/MkAsUi.vue
+++ b/packages/frontend/src/components/MkAsUi.vue
@@ -7,7 +7,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <div>
 	<div v-if="c.type === 'root'" :class="$style.root">
 		<template v-for="child in c.children" :key="child">
-			<MkAsUi v-if="!g(child).hidden" :component="g(child)" :components="props.components" :size="size"/>
+			<MkAsUi v-if="!g(child).hidden" :cid="child" :components="props.components" :size="size"/>
 		</template>
 	</div>
 	<span v-else-if="c.type === 'text'" :class="{ [$style.fontSerif]: c.font === 'serif', [$style.fontMonospace]: c.font === 'monospace' }" :style="{ fontSize: c.size ? `${c.size * 100}%` : undefined, fontWeight: c.bold ? 'bold' : undefined, color: c.color }">{{ c.text }}</span>
@@ -56,7 +56,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 	</MkFolder>
 	<div v-else-if="c.type === 'container'" :class="[$style.container, { [$style.fontSerif]: c.font === 'serif', [$style.fontMonospace]: c.font === 'monospace' }]" :style="{ textAlign: c.align, backgroundColor: c.bgColor, color: c.fgColor, borderWidth: c.borderWidth ? `${c.borderWidth}px` : 0, borderColor: c.borderColor ?? 'var(--divider)', padding: c.padding ? `${c.padding}px` : 0, borderRadius: c.rounded ? '8px' : 0 }">
 		<template v-for="child in c.children" :key="child">
-			<MkAsUi v-if="!g(child).hidden" :component="g(child)" :components="props.components" :size="size" :align="c.align"/>
+			<MkAsUi v-if="!g(child).hidden" :cid="child" :components="props.components" :size="size" :align="c.align"/>
 		</template>
 	</div>
 </div>
@@ -75,8 +75,8 @@ import MkFolder from '@/components/MkFolder.vue';
 import MkPostForm from '@/components/MkPostForm.vue';
 
 const props = withDefaults(defineProps<{
-	component: AsUiComponent;
-	components: Ref<AsUiComponent>[];
+	cid: string;
+	components: Map<string, Ref<AsUiComponent>>;
 	size: 'small' | 'medium' | 'large';
 	align: 'left' | 'center' | 'right';
 }>(), {
@@ -84,10 +84,10 @@ const props = withDefaults(defineProps<{
 	align: 'left',
 });
 
-const c = props.component;
+const c = props.components.get(props.cid).value;
 
 function g(id) {
-	const v = props.components.find(x => x.value.id === id)?.value;
+	const v = props.components.get(id).value;
 	if (v) return v;
 
 	return {
diff --git a/packages/frontend/src/pages/flash/flash.vue b/packages/frontend/src/pages/flash/flash.vue
index a6a99ba6332..96c4446938e 100644
--- a/packages/frontend/src/pages/flash/flash.vue
+++ b/packages/frontend/src/pages/flash/flash.vue
@@ -12,7 +12,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 				<Transition :name="defaultStore.state.animation ? 'zoom' : ''" mode="out-in">
 					<div v-if="started" :class="$style.started">
 						<div class="main _panel">
-							<MkAsUi v-if="root" :component="root" :components="components"/>
+							<MkAsUi :cid="'___root___'" :components="components"/>
 						</div>
 						<div class="actions _panel">
 							<div class="items">
@@ -179,8 +179,7 @@ const parser = new Parser();
 
 const started = ref(false);
 const aiscript = shallowRef<Interpreter | null>(null);
-const root = ref<AsUiRoot>();
-const components = ref<Ref<AsUiComponent>[]>([]);
+const components = ref<Map<string, Ref<AsUiComponent>>>(new Map());
 
 function start() {
 	started.value = true;
@@ -190,14 +189,13 @@ function start() {
 async function run() {
 	if (aiscript.value) aiscript.value.abort();
 	if (!flash.value) return;
+	components.value.clear();
 
 	aiscript.value = new Interpreter({
 		...createAiScriptEnv({
 			storageKey: 'flash:' + flash.value.id,
 		}),
-		...registerAsUiLib(components.value, (_root) => {
-			root.value = _root.value;
-		}),
+		...registerAsUiLib(components.value),
 		THIS_ID: values.STR(flash.value.id),
 		THIS_URL: values.STR(`${url}/play/${flash.value.id}`),
 	}, {
diff --git a/packages/frontend/src/pages/scratchpad.vue b/packages/frontend/src/pages/scratchpad.vue
index 9aaa8ff9c63..c171b3d6664 100644
--- a/packages/frontend/src/pages/scratchpad.vue
+++ b/packages/frontend/src/pages/scratchpad.vue
@@ -19,7 +19,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			<MkContainer v-if="root && components.length > 1" :key="uiKey" :foldable="true">
 				<template #header>UI</template>
 				<div :class="$style.ui">
-					<MkAsUi :component="root" :components="components" size="small"/>
+					<MkAsUi :cid="'___root___'" :components="components" size="small"/>
 				</div>
 			</MkContainer>
 
@@ -58,8 +58,7 @@ const parser = new Parser();
 let aiscript: Interpreter;
 const code = ref('');
 const logs = ref<any[]>([]);
-const root = ref<AsUiRoot>();
-const components = ref<Ref<AsUiComponent>[]>([]);
+const components = ref<Map<string, Ref<AsUiComponent>>>(new Map());
 const uiKey = ref(0);
 
 const saved = miLocalStorage.getItem('scratchpad');
@@ -74,7 +73,7 @@ watch(code, () => {
 async function run() {
 	if (aiscript) aiscript.abort();
 	root.value = undefined;
-	components.value = [];
+	components.value.clear();
 	uiKey.value++;
 	logs.value = [];
 	aiscript = new Interpreter(({
@@ -82,9 +81,7 @@ async function run() {
 			storageKey: 'widget',
 			token: $i?.token,
 		}),
-		...registerAsUiLib(components.value, (_root) => {
-			root.value = _root.value;
-		}),
+		...registerAsUiLib(components.value),
 	}), {
 		in: aiScriptReadline,
 		out: (value) => {
diff --git a/packages/frontend/src/scripts/aiscript/ui.ts b/packages/frontend/src/scripts/aiscript/ui.ts
index fa3fcac2e79..7cd3d186654 100644
--- a/packages/frontend/src/scripts/aiscript/ui.ts
+++ b/packages/frontend/src/scripts/aiscript/ui.ts
@@ -502,8 +502,8 @@ function getPostFormOptions(def: values.Value | undefined, call: (fn: values.VFn
 	};
 }
 
-export function registerAsUiLib(components: Ref<AsUiComponent>[], done: (root: Ref<AsUiRoot>) => void) {
-	const instances = {};
+export function registerAsUiLib(components: Map<string, Ref<AsUiComponent>>, done?: (root: Ref<AsUiRoot>) => void) {
+	const instances = new Map<string, values.Value>();
 
 	function createComponentInstance(type: AsUiComponent['type'], def: values.Value | undefined, id: values.Value | undefined, getOptions: (def: values.Value | undefined, call: (fn: values.VFn, args: values.Value[]) => Promise<values.Value>) => any, call: (fn: values.VFn, args: values.Value[]) => Promise<values.Value>) {
 		if (id) utils.assertString(id);
@@ -513,7 +513,7 @@ export function registerAsUiLib(components: Ref<AsUiComponent>[], done: (root: R
 			type,
 			id: _id,
 		});
-		components.push(component);
+		components.set(_id, component);
 		const instance = values.OBJ(new Map([
 			['id', values.STR(_id)],
 			['update', values.FN_NATIVE(([def], opts) => {
@@ -525,12 +525,12 @@ export function registerAsUiLib(components: Ref<AsUiComponent>[], done: (root: R
 				}
 			})],
 		]));
-		instances[_id] = instance;
+		instances.set(_id, instance);
 		return instance;
 	}
 
 	const rootInstance = createComponentInstance('root', utils.jsToVal({ children: [] }), utils.jsToVal('___root___'), getRootOptions, () => {});
-	const rootComponent = components[0] as Ref<AsUiRoot>;
+	const rootComponent = components.get('___root___') as Ref<AsUiRoot>;
 	done(rootComponent);
 
 	return {
@@ -544,7 +544,7 @@ export function registerAsUiLib(components: Ref<AsUiComponent>[], done: (root: R
 
 		'Ui:get': values.FN_NATIVE(([id], opts) => {
 			utils.assertString(id);
-			const instance = instances[id.value];
+			const instance = instances.get(id.value);
 			if (instance) {
 				return instance;
 			} else {
diff --git a/packages/frontend/src/widgets/WidgetAiscriptApp.vue b/packages/frontend/src/widgets/WidgetAiscriptApp.vue
index fa79e4aeb73..3079d7bcf5c 100644
--- a/packages/frontend/src/widgets/WidgetAiscriptApp.vue
+++ b/packages/frontend/src/widgets/WidgetAiscriptApp.vue
@@ -7,7 +7,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <MkContainer :showHeader="widgetProps.showHeader" class="mkw-aiscriptApp">
 	<template #header>App</template>
 	<div :class="$style.root">
-		<MkAsUi v-if="root" :component="root" :components="components" size="small"/>
+		<MkAsUi :cid="'___root___'" :components="components" size="small"/>
 	</div>
 </MkContainer>
 </template>
@@ -51,18 +51,16 @@ const { widgetProps, configure } = useWidgetPropsManager(name,
 
 const parser = new Parser();
 
-const root = ref<AsUiRoot>();
-const components = ref<Ref<AsUiComponent>[]>([]);
+const components = ref<Map<string, Ref<AsUiComponent>>>(new Map());
 
 async function run() {
+	components.value.clear();
 	const aiscript = new Interpreter({
 		...createAiScriptEnv({
 			storageKey: 'widget',
 			token: $i?.token,
 		}),
-		...registerAsUiLib(components.value, (_root) => {
-			root.value = _root.value;
-		}),
+		...registerAsUiLib(components.value),
 	}, {
 		in: aiScriptReadline,
 		out: (value) => {