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 +9 -1
2 changed files with 9 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 1e1bae0812 - Show all commits

3
frontend/src/app.html
View File

@ -18,10 +18,10 @@
<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" media="print"
onload="this.media='all'"
/> />
<noscript> <noscript>
<link <link
@ -29,6 +29,7 @@
rel="stylesheet" rel="stylesheet"
/> />
</noscript> </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';
}
});