feat: performance optimizations and ui improvements (#26)

* test: remove astro-compress

* test: remove astro-compress

* perf: add astro-compress, optimize resource preloading

* perf: moving photoswipe styles to head with non-blocking preload strategy

* test: disable astro-compress

* test: enable astro-compress

* fix: typescript hints

* chore: adjust toc style and gsap animation

* style: optimize gsap animation logic, adjust toc style

* chore: adjust toc style

* fix: photoswipe transition position offset caused by scrollbar-gutter
This commit is contained in:
radishzz 2025-05-26 20:21:38 +01:00 committed by GitHub
parent 054aa85509
commit 47e1df9b3d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
10 changed files with 64 additions and 69 deletions

View file

@ -1,6 +1,7 @@
---
import { ClientRouter } from 'astro:transitions'
import katexCSS from 'katex/dist/katex.min.css?url'
import photoSwipeCSS from 'photoswipe/style.css?url'
import { allLocales, defaultLocale, themeConfig } from '@/config'
import { ui } from '@/i18n/ui'
import { getPageInfo } from '@/utils/page'
@ -57,8 +58,12 @@ const pageImage = postSlug
<link rel="preload" href="/fonts/Snell-Bold-SF.woff2" as="font" type="font/woff2" crossorigin />
<link rel="preload" href="/fonts/STIX-VF.woff2" as="font" type="font/woff2" crossorigin />
<link rel="preload" href="/fonts/STIX-Italic-VF.woff2" as="font" type="font/woff2" crossorigin />
{commentEnabled && walineServerURL && <link rel="stylesheet" href="/assets/waline/waline.css" />}
{katexEnabled && <link rel="stylesheet" href={katexCSS} />}
<link rel="preload" href={photoSwipeCSS} as="style" />
{katexEnabled && <link rel="preload" href={katexCSS} as="style" />}
{commentEnabled && walineServerURL && <link rel="preload" href="/assets/waline/waline.css" as="style" />}
<link rel="stylesheet" href={photoSwipeCSS} media="print" onload={`this.media='all'`} />
{katexEnabled && <link rel="stylesheet" href={katexCSS} media="print" onload={`this.media='all'`} />}
{commentEnabled && walineServerURL && <link rel="stylesheet" href="/assets/waline/waline.css" media="print" onload={`this.media='all'`} />}
<link rel="alternate" href="/rss.xml" type="application/rss+xml" title="RSS Feed" />
<link rel="alternate" href="/atom.xml" type="application/atom+xml" title="Atom Feed" />
<link rel="sitemap" href="/sitemap-index.xml" />

View file

@ -44,7 +44,7 @@ const MarginBottom = isPost && themeConfig.comment?.enabled
<div
class="mx-auto max-w-205.848 min-h-vh w-full min-h-dvh"
p="x-[min(7.25vw,3.731rem)] y-10"
lg="mx-[max(5rem,calc(50vw-35rem))] my-20 max-w-[min(calc(75vw-16rem),44rem)] min-h-full p-0"
lg="mx-[max(5.75rem,calc(50vw-34.25rem))] my-20 max-w-[min(calc(75vw-16rem),44rem)] min-h-full p-0"
>
<Header />
<Navbar />