perf: 优化前台页面性能、响应头缓存控制及文章摘要加载方式
continuous-integration/drone/push Build is passing

This commit is contained in:
seahi committed 2026-09-25 08:54:39 +08:00
1 parent ad101e15a8
commit 42da3849f5
6 files changed
+35 -10

No files matched your search

+8 -2
View File
@@ -3,7 +3,12 @@
import { createExcerpt } from '$lib/markdown/excerpt';
import type { PageServerLoad } from './$types';
export const load: PageServerLoad = async ({ platform }) => {
export const load: PageServerLoad = async ({ platform, setHeaders }) => {
// Enable CDN Edge caching for 1 hour, browser cache for 1 minute
setHeaders({
'Cache-Control': 'public, max-age=60, s-maxage=3600'
});
const db = platform?.env?.DB;
if (!db) {
@@ -33,9 +38,10 @@ export const load: PageServerLoad = async ({ platform }) => {
}
try {
// Optimization: Use substr to prevent fetching megabytes of content just for excerpts
const { results } = await db
.prepare(
`SELECT p.id, p.slug, p.title, p.content, p.cover, p.published_at as date
`SELECT p.id, p.slug, p.title, SUBSTR(p.content, 1, 2000) AS content, p.cover, p.published_at as date
FROM posts p
ORDER BY p.published_at DESC LIMIT 10`
)
+7 -2
View File
@@ -14,12 +14,17 @@
<section id="index-list">
<div class="post-list">
{#each data.posts as post (post.id || post)}
{#each data.posts as post, i (post.id || post)}
<a href={resolve('/posts/[slug]', { slug: post.slug })} class="card-link">
<article class="card article-content" class:has-cover={!!post.cover}>
{#if post.cover}
<div class="post-cover">
<img src={post.cover} alt={post.title} loading="lazy" />
<img
src={post.cover}
alt={post.title}
loading={i < 2 ? 'eager' : 'lazy'}
fetchpriority={i < 2 ? 'high' : 'auto'}
/>
</div>
{/if}
<div class="content-wrap">
+10 -2
View File
@@ -2,8 +2,12 @@
import { error } from '@sveltejs/kit';
import type { PageServerLoad } from './$types';
import { renderMarkdown } from '$lib/markdown/renderer';
export const load: PageServerLoad = async ({ params, platform, parent }) => {
export const load: PageServerLoad = async ({ params, platform, parent, setHeaders }) => {
setHeaders({
'Cache-Control': 'public, max-age=60, s-maxage=3600'
});
const db = platform?.env?.DB;
const slug = params.slug;
const { aliases } = await parent();
@@ -33,7 +37,11 @@ export const load: PageServerLoad = async ({ params, platform, parent }) => {
}
return {
page
page: {
...page,
content: undefined,
htmlContent: renderMarkdown(page.content)
}
};
} catch (err: unknown) {
if ((err as any)?.status === 404) throw err;
+1 -1
View File
@@ -17,7 +17,7 @@
<h1 class="post-title">{data.page.title}</h1>
</div>
<MarkdownRenderer content={data.page.content} />
<MarkdownRenderer htmlContent={data.page.htmlContent} />
</article>
</div>
</main>
+8 -2
View File
@@ -1,5 +1,6 @@
import type { PageServerLoad } from './$types';
import { error, isHttpError } from '@sveltejs/kit';
import { renderMarkdown } from '$lib/markdown/renderer';
interface PostRow {
id: number;
@@ -17,7 +18,10 @@ interface PostRow {
series_weight: number | null;
}
export const load: PageServerLoad = async ({ platform, params, parent }) => {
export const load: PageServerLoad = async ({ platform, params, parent, setHeaders }) => {
setHeaders({
'Cache-Control': 'public, max-age=60, s-maxage=3600'
});
const db = platform?.env?.DB;
const { slug } = params;
const { aliases } = await parent();
@@ -51,7 +55,7 @@ export const load: PageServerLoad = async ({ platform, params, parent }) => {
slug === 'hello-world'
? 'Hello, BlogFlare! (Fallback)'
: 'The Beauty of Typecho Theme VOID',
content: dummyMarkdown,
htmlContent: renderMarkdown(dummyMarkdown),
cover: null,
date: '2026-07-12',
author: 'Admin'
@@ -129,6 +133,8 @@ export const load: PageServerLoad = async ({ platform, params, parent }) => {
return {
post: {
...post,
content: undefined,
htmlContent: renderMarkdown(post.content),
date: new Date(post.date as string).toLocaleDateString()
},
tags,
+1 -1
View File
@@ -157,7 +157,7 @@
</div>
</div>
{/if}
<MarkdownRenderer content={data.post.content} />
<MarkdownRenderer htmlContent={data.post.htmlContent} />
{#if data.tags && data.tags.length > 0}
<section class="tags">