feat(website): loading time optimize

packages/website/src/pages/Home.tsx

@@ -1,15 +1,27 @@
-import FeaturesSection from './home/FeaturesSection'
+import { Suspense, lazy } from 'react'
+
 import HeroSection from './home/HeroSection'
-import OneMoreThingSection from './home/OneMoreThingSection'
-import ScenariosSection from './home/ScenariosSection'
+
+const FeaturesSection = lazy(() => import('./home/FeaturesSection'))
+const ScenariosSection = lazy(() => import('./home/ScenariosSection'))
+const OneMoreThingSection = lazy(() => import('./home/OneMoreThingSection'))
 
 export default function HomePage() {
 	return (
 		<>
 			<HeroSection />
-			<FeaturesSection />
-			<ScenariosSection />
-			<OneMoreThingSection />
+			<Suspense
+				fallback={
+					<div className="flex items-center justify-center gap-3 py-20 text-gray-400">
+						<div className="w-4 h-4 border-2 border-blue-500 border-t-transparent rounded-full animate-spin" />
+						Loading...
+					</div>
+				}
+			>
+				<FeaturesSection />
+				<ScenariosSection />
+				<OneMoreThingSection />
+			</Suspense>
 		</>
 	)
 }

packages/website/src/pages/home/HeroSection.tsx

@@ -16,7 +16,7 @@ import {
 } from '../../constants'
 import { useLanguage } from '../../i18n/context'
 
-const pageAgentModule = import('page-agent')
+let pageAgentModule: Promise<typeof import('page-agent')> | null = null
 
 function getInjection(useCN?: boolean) {
 	const cdn = useCN ? CDN_DEMO_CN_URL : CDN_DEMO_URL
@@ -59,11 +59,12 @@ export default function HeroSection() {
 
 	const [ready, setReady] = useState(false)
 	useEffect(() => {
+		pageAgentModule ??= import('page-agent')
 		pageAgentModule.then(() => setReady(true))
 	}, [])
 
 	const handleExecute = async () => {
-		if (!task.trim() || !ready) return
+		if (!task.trim() || !ready || !pageAgentModule) return
 
 		const { PageAgent } = await pageAgentModule
 		const win = window as any