[repo] Improve performance of font loading

andrewnicols · andrewnicols · commit 4f4bf717a180 · 2022-06-07T19:45:49.000+08:00
This is based on advice from Lighthouse reports: https://web.dev/font-display/?utm_source=lighthouse&utm_medium=cli
diff --git a/src/css/custom.css b/src/css/custom.css
@@ -66,6 +66,7 @@ html {
 @font-face {
   font-family: "Open Sans";
   src: url("/static/font/OpenSans-VariableFont_wdth,wght.woff2") format("woff2");
+  font-display: swap;
 }
 
 .navbar__logo {
diff --git a/src/pages/index.module.css b/src/pages/index.module.css
@@ -61,6 +61,7 @@
 @font-face {
   font-family: "DM Sans Serif";
   src: url("/static/font/DMSerifDisplay-Regular.woff2") format("woff2");
+  font-display: swap;
 }
 
 h1 {

Original file line number	Diff line number	Diff line change
`@@ -66,6 +66,7 @@ html {`
`66`	`66`	`@font-face {`
`67`	`67`	`font-family: "Open Sans";`
`68`	`68`	`src: url("/static/font/OpenSans-VariableFont_wdth,wght.woff2") format("woff2");`
	`69`	`+ font-display: swap;`
`69`	`70`	`}`
`70`	`71`
`71`	`72`	`.navbar__logo {`
Original file line number	Diff line number	Diff line change
`@@ -61,6 +61,7 @@`
`61`	`61`	`@font-face {`
`62`	`62`	`font-family: "DM Sans Serif";`
`63`	`63`	`src: url("/static/font/DMSerifDisplay-Regular.woff2") format("woff2");`
	`64`	`+ font-display: swap;`
`64`	`65`	`}`
`65`	`66`
`66`	`67`	`h1 {`