From 4313d2388938d40052c283bdaacb2d1439c3abb8 Mon Sep 17 00:00:00 2001
From: yyh <92089059+lyzno1@users.noreply.github.com>
Date: Mon, 27 Jul 2026 15:48:35 +0800
Subject: [PATCH] perf(web): lazy-load Home creation modals (#39634)

---
 web/app/components/explore/app-list/index.tsx | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/web/app/components/explore/app-list/index.tsx b/web/app/components/explore/app-list/index.tsx
index b8ec1a132ce..ed564cef852 100644
--- a/web/app/components/explore/app-list/index.tsx
+++ b/web/app/components/explore/app-list/index.tsx
@@ -15,10 +15,8 @@ import { useQueryState } from 'nuqs'
 import * as React from 'react'
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import DSLConfirmModal from '@/app/components/app/create-from-dsl-modal/dsl-confirm-modal'
 import AppCard from '@/app/components/explore/app-card'
 import { Banner } from '@/app/components/explore/banner/banner'
-import CreateAppModal from '@/app/components/explore/create-app-modal'
 import {
   getStepByStepTourPermissionVariant,
   trackStepByStepTourEvent,
@@ -50,6 +48,11 @@ import { ExploreHomeSkeleton } from './loading-skeletons'
 import s from './style.module.css'
 
 const TryApp = dynamic(() => import('../try-app'), { ssr: false })
+const CreateAppModal = dynamic(() => import('../create-app-modal'), { ssr: false })
+const DSLConfirmModal = dynamic(
+  () => import('@/app/components/app/create-from-dsl-modal/dsl-confirm-modal'),
+  { ssr: false },
+)
 
 type ExploreAppListData = {
   categories: string[]