57 lines
2.1 KiB
TypeScript
57 lines
2.1 KiB
TypeScript
import { Suspense } from "react";
|
||
import dynamic from "next/dynamic";
|
||
import { getDictionary } from "@/lib/dictionaries";
|
||
import { Hero } from "@/components/sections/Hero";
|
||
import { Features } from "@/components/sections/Features";
|
||
|
||
const SectionSkeleton = () => (
|
||
<div className="h-[500px] w-full animate-pulse bg-card/20 rounded-3xl my-10" />
|
||
);
|
||
|
||
// Тяжёлые интерактивные секции (framer-motion анимации, клиентские запросы к PocketBase,
|
||
// realtime-подписки) грузятся через next/dynamic, а не обычным import, чтобы не раздувать
|
||
// первый JS-бандл главной страницы: Hero и Features рендерятся сразу (статично, легче),
|
||
// а Pricing/FAQ/TerminalGuestbook/BlogPreview подгружаются отдельными чанками с плейсхолдером
|
||
// SectionSkeleton, пока грузится JS.
|
||
const Pricing = dynamic(
|
||
() => import("@/components/sections/Pricing").then((mod) => mod.Pricing),
|
||
{ loading: () => <SectionSkeleton /> },
|
||
);
|
||
const FAQ = dynamic(
|
||
() => import("@/components/sections/Faq").then((mod) => mod.FAQ),
|
||
{ loading: () => <SectionSkeleton /> },
|
||
);
|
||
const TerminalGuestbook = dynamic(
|
||
() =>
|
||
import("@/components/sections/TerminalGuestbook").then(
|
||
(mod) => mod.TerminalGuestbook,
|
||
),
|
||
{ loading: () => <SectionSkeleton /> },
|
||
);
|
||
const BlogPreview = dynamic(() =>
|
||
import("@/components/sections/BlogPreview").then((mod) => mod.BlogPreview),
|
||
);
|
||
|
||
export default async function Home({
|
||
params,
|
||
}: {
|
||
params: Promise<{ lang: string }>;
|
||
}) {
|
||
const { lang } = await params;
|
||
const dict = await getDictionary(lang);
|
||
|
||
return (
|
||
<>
|
||
<Hero dict={dict.hero} lang={lang} />
|
||
<Features dict={dict.features} />
|
||
<Pricing dict={dict.pricing} lang={lang} />
|
||
<FAQ dict={dict.faq} lang={lang} />
|
||
<TerminalGuestbook dict={dict.guestbook} />
|
||
|
||
<Suspense fallback={<SectionSkeleton />}>
|
||
<BlogPreview lang={lang} dict={dict.blog} />
|
||
</Suspense>
|
||
</>
|
||
);
|
||
}
|