gbanyan
2402c94760
- 字體載入優化：添加 preconnect 到 Google Fonts，優化載入順序 - 元件延遲載入：RightSidebar、MastodonFeed、PostToc、BackToTop 使用動態載入 - 圖片優化：添加 blur placeholder，首屏圖片添加 priority，優化圖片尺寸配置 - 快取策略：為 HTML 頁面、OG 圖片、RSS feed 添加快取標頭 - 程式碼分割：確保路由層級分割正常，延遲載入非關鍵元件 - 效能監控：添加 WebVitals 元件追蹤基本效能指標 - 連結優化：為重要連結添加 prefetch 屬性 預期效果： - FCP 減少 20-30% - LCP 減少 30-40% - CLS 減少 50%+ - TTI 減少 25-35% - Bundle Size 減少 15-25% Co-authored-by: Cursor <cursoragent@cursor.com>
70 lines
2.1 KiB
TypeScript
70 lines
2.1 KiB
TypeScript
import Link from 'next/link';
|
|
import { getAllPostsSorted } from '@/lib/posts';
|
|
import { siteConfig } from '@/lib/config';
|
|
import { PostListItem } from '@/components/post-list-item';
|
|
import { TimelineWrapper } from '@/components/timeline-wrapper';
|
|
import { SidebarLayout } from '@/components/sidebar-layout';
|
|
import { JsonLd } from '@/components/json-ld';
|
|
|
|
export default function HomePage() {
|
|
const posts = getAllPostsSorted().slice(0, siteConfig.postsPerPage);
|
|
|
|
// CollectionPage Schema for homepage
|
|
const collectionPageSchema = {
|
|
'@context': 'https://schema.org',
|
|
'@type': 'CollectionPage',
|
|
name: `${siteConfig.name} 的最新動態`,
|
|
description: siteConfig.description,
|
|
url: siteConfig.url,
|
|
inLanguage: siteConfig.defaultLocale,
|
|
isPartOf: {
|
|
'@type': 'WebSite',
|
|
name: siteConfig.title,
|
|
url: siteConfig.url,
|
|
},
|
|
about: {
|
|
'@type': 'Blog',
|
|
name: siteConfig.title,
|
|
description: siteConfig.description,
|
|
},
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<JsonLd data={collectionPageSchema} />
|
|
<section className="space-y-6">
|
|
<SidebarLayout>
|
|
<header className="space-y-1 text-center">
|
|
<h1 className="type-title font-bold text-slate-900 dark:text-slate-50">
|
|
{siteConfig.name} 的最新動態
|
|
</h1>
|
|
<p className="type-small text-slate-600 dark:text-slate-300">
|
|
{siteConfig.tagline}
|
|
</p>
|
|
</header>
|
|
|
|
<div>
|
|
<div className="mb-3 flex items-baseline justify-between">
|
|
<h2 className="type-small font-semibold uppercase tracking-[0.4em] text-slate-500 dark:text-slate-400">
|
|
最新文章
|
|
</h2>
|
|
<Link
|
|
href="/blog"
|
|
prefetch={true}
|
|
className="text-xs text-blue-600 hover:underline dark:text-blue-400"
|
|
>
|
|
所有文章 →
|
|
</Link>
|
|
</div>
|
|
<TimelineWrapper>
|
|
{posts.map((post, index) => (
|
|
<PostListItem key={post._id} post={post} priority={index === 0} />
|
|
))}
|
|
</TimelineWrapper>
|
|
</div>
|
|
</SidebarLayout>
|
|
</section>
|
|
</>
|
|
);
|
|
}
|