squid/blog
squid/blog
1
2
Fork 0
Code Issues 10 Pull Requests Actions Projects 1 Releases 7 Wiki Activity

BLOG-92 Fix improve google font loading efficiency #111

Merged
squid merged 2 commits from BLOG-92_improve_font_loading_efficiency into main 2025-08-02 15:26:49 +08:00
Conversation 3 Commits 2 Files Changed 2 +16
2 changed files with 16 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
frontend/src/app.html
View File

@ -18,9 +18,18 @@
<link rel="preconnect" href="https://fonts.googleapis.com" /> <link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin /> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link <link
id="google-fonts"
href="https://fonts.googleapis.com/css2?family=Noto+Sans+Mono&family=Noto+Sans+TC:wght@100..900&display=swap" href="https://fonts.googleapis.com/css2?family=Noto+Sans+Mono&family=Noto+Sans+TC:wght@100..900&display=swap"
rel="stylesheet" rel="stylesheet"
media="print"
/> />
<noscript>
<link
href="https://fonts.googleapis.com/css2?family=Noto+Sans+Mono&family=Noto+Sans+TC:wght@100..900&display=swap"
rel="stylesheet"
/>
</noscript>
<script src="%sveltekit.assets%/js/font-loader.js" defer></script>
%sveltekit.head% %sveltekit.head%
</head> </head>
<body data-sveltekit-preload-data="hover" class="antialiased"> <body data-sveltekit-preload-data="hover" class="antialiased">

7
frontend/static/js/font-loader.js Normal file
View File

@ -0,0 +1,7 @@
// Defer loading of fonts to improve performance
window.addEventListener('load', function() {
const fontLink = document.getElementById('google-fonts');
if (fontLink) {
fontLink.media = 'all';
}
});