From ab0867d2df20f9b770b0c62659072b59feb249a7 Mon Sep 17 00:00:00 2001
From: Robert Kaussow <mail@geeklabor.de>
Date: Sat, 19 Sep 2020 12:23:14 +0200
Subject: [PATCH] add font and css preloading links

---
 .lighthouserc.yml             | 19 ++++++++++++-------
 CHANGELOG.md                  |  1 +
 exampleSite/content/_index.md | 15 ++++++++++-----
 layouts/partials/head.html    | 12 ++++++++++++
 src/sass/_utils.scss          |  5 +++++
 5 files changed, 40 insertions(+), 12 deletions(-)

diff --git a/.lighthouserc.yml b/.lighthouserc.yml
index 0304d7d..cb77031 100644
--- a/.lighthouserc.yml
+++ b/.lighthouserc.yml
@@ -1,7 +1,7 @@
 ---
 ci:
   collect:
-    numberOfRuns: 2
+    numberOfRuns: 3
     staticDistDir: exampleSite/public
     url:
       - http://localhost/
@@ -13,12 +13,17 @@ ci:
     preset: "lighthouse:no-pwa"
     assertions:
       uses-long-cache-ttl: off
-      render-blocking-resources: off
-      tap-targets: off
-      first-contentful-paint: off
-      first-meaningful-paint: off
-      largest-contentful-paint: off
-      unsized-images: off
+      tap-targets: warn
+      unsized-images: warn
+      categories:performance:
+        - error
+        - minScore: 0.95
+      categories:accessibility:
+        - error
+        - minScore: 1
+      categories:seo:
+        - error
+        - minScore: 0.95
   upload:
     target: filesystem
     outputDir: lhci_reports
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 9d7d0b7..656cc5e 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,2 +1,3 @@
 - ENHANCEMENT
   - improve and normalize microblog formatting
+  - add font and css preloading links
diff --git a/exampleSite/content/_index.md b/exampleSite/content/_index.md
index 324469b..ba93035 100644
--- a/exampleSite/content/_index.md
+++ b/exampleSite/content/_index.md
@@ -2,11 +2,16 @@
 title: Documentation
 ---
 
-[![Build Status](https://img.shields.io/drone/build/xoxys/hugo-geekdoc?logo=drone)](https://cloud.drone.io/xoxys/hugo-geekdoc)
-[![Hugo Version](https://img.shields.io/badge/hugo-0.65-blue.svg)](https://gohugo.io)
-[![GitHub release](https://img.shields.io/github/v/release/xoxys/hugo-geekdoc)](https://github.com/xoxys/hugo-geekdoc/releases/latest)
-[![GitHub contributors](https://img.shields.io/github/contributors/xoxys/hugo-geekdoc)](https://github.com/xoxys/hugo-geekdoc/graphs/contributors)
-[![License: MIT](https://img.shields.io/github/license/xoxys/hugo-geekdoc)](https://github.com/xoxys/hugo-geekdoc/blob/master/LICENSE)
+<!-- markdownlint-capture -->
+<!-- markdownlint-disable MD033 -->
+
+<span class="badge-placeholder">[![Build Status](https://img.shields.io/drone/build/xoxys/hugo-geekdoc?logo=drone)](https://cloud.drone.io/xoxys/hugo-geekdoc)</span>
+<span class="badge-placeholder">[![Hugo Version](https://img.shields.io/badge/hugo-0.65-blue.svg)](https://gohugo.io)</span>
+<span class="badge-placeholder">[![GitHub release](https://img.shields.io/github/v/release/xoxys/hugo-geekdoc)](https://github.com/xoxys/hugo-geekdoc/releases/latest)</span>
+<span class="badge-placeholder">[![GitHub contributors](https://img.shields.io/github/contributors/xoxys/hugo-geekdoc)](https://github.com/xoxys/hugo-geekdoc/graphs/contributors)</span>
+<span class="badge-placeholder">[![License: MIT](https://img.shields.io/github/license/xoxys/hugo-geekdoc)](https://github.com/xoxys/hugo-geekdoc/blob/master/LICENSE)</span>
+
+<!-- markdownlint-restore -->
 
 Geekdoc is a simple Hugo theme for documentations. It is intentionally designed as a fast and lean theme and may not fit the requirements of complex projects. If a more feature-complete theme is required there are a lot of got alternatives out there. You can find a demo and the full documentation at [https://geekdocs.de](https://geekdocs.de).
 
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index daa0c0b..2cd9f60 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -5,7 +5,19 @@
 <title>{{ partial "title" . }} | {{ .Site.Title -}}</title>
 
 <link rel="icon" href="{{ "favicon/favicon-32x32.png" | relURL }}" type="image/x-icon">
+
+<link rel="preload" as="font" href="/fonts/Metropolis.woff2" type="font/woff2" crossorigin="anonymous">
+<link rel="preload" as="font" href="/fonts/LiberationSans.woff2" type="font/woff2" crossorigin="anonymous">
+<link rel="preload" as="font" href="/fonts/LiberationSans-Bold.woff2" type="font/woff2" crossorigin="anonymous">
+<link rel="preload" as="font" href="/fonts/LiberationSans-BoldItalic.woff2" type="font/woff2" crossorigin="anonymous">
+<link rel="preload" as="font" href="/fonts/LiberationSans-Italic.woff2" type="font/woff2" crossorigin="anonymous">
+<link rel="preload" as="font" href="/fonts/LiberationMono.woff2" type="font/woff2" crossorigin="anonymous">
+<link rel="preload" as="font" href="/fonts/DroidSans.woff2" type="font/woff2" crossorigin="anonymous">
+
+<link rel="preload" href="{{ "main.min.css" | relURL }}" as="style">
 <link rel="stylesheet" href="{{ "main.min.css" | relURL }}" media="screen">
+
+<link rel="preload" href="{{ "custom.css" | relURL }}" as="style">
 <link rel="stylesheet" href="{{ "custom.css" | relURL }}" media="screen">
 
 {{ with .OutputFormats.Get "rss" -}}
diff --git a/src/sass/_utils.scss b/src/sass/_utils.scss
index 8d97508..67073a2 100644
--- a/src/sass/_utils.scss
+++ b/src/sass/_utils.scss
@@ -50,6 +50,11 @@
   display: none;
 }
 
+.badge-placeholder {
+  display: inline-block;
+  min-width: 4rem;
+}
+
 @mixin spin($duration) {
   animation: spin $duration ease infinite;
   @keyframes spin {