Fix fetchData

The fetchData function suffer from a race condition. If the function is called before the promise finishes, it will result in another pair of HTTP request. This does not only make the function useless but Actually, it makes it harmful as the data might be redownloaded twice. Now fetchData is not a function but rather the promise by itself. Previous callers are expected to await the variable instead, this should be not concern as awaiting a promise multiple time in JavaScript is completely safe.
Hsterts · Mar 4, 2022 · 7e0f2e4 · 7e0f2e4
1 parent 1313bd9
commit 7e0f2e4
Show file tree

Hide file tree

Showing 7 changed files with 16 additions and 26 deletions.
diff --git a/.github/workflows/deploy.yaml b/.github/workflows/deploy.yaml
@@ -16,7 +16,7 @@ jobs:
         with:
           index: true
           input: content
-          output: static
+          output: assets/indices
           root: .
 
       - name: Setup Hugo

diff --git a/.gitignore b/.gitignore
@@ -3,5 +3,5 @@ public
 resources
 .idea
 content/.obsidian
-static/linkIndex.json
-static/contentIndex.json
+assets/indices/linkIndex.json
+assets/indices/contentIndex.json
diff --git a/assets/js/graph.js b/assets/js/graph.js
@@ -1,5 +1,5 @@
 async function drawGraph(url, baseUrl, pathColors, depth, enableDrag, enableLegend, enableZoom) {
-    const { index, links, content } = await fetchData()
+    const { index, links, content } = await fetchData
     const curPage = url.replace(baseUrl, "")
 
     const parseIdsFromLinks = (links) => [...(new Set(links.flatMap(link => ([link.source, link.target]))))]

diff --git a/assets/js/popover.js b/assets/js/popover.js
@@ -8,7 +8,7 @@ function htmlToElement(html) {
 function initPopover(base) {
     const baseUrl = base.replace(window.location.origin, "") // is this useless?
     document.addEventListener("DOMContentLoaded", () => {
-        fetchData().then(({content}) => {
+        fetchData.then(({content}) => {
         const links = [...document.getElementsByClassName("internal-link")]
         links.forEach(li => {
             const linkDest = content[li.dataset.src.replace(baseUrl, "")]

diff --git a/assets/js/search.js b/assets/js/search.js
@@ -81,7 +81,7 @@ const removeMarkdown = (
     }
     })
 
-    const { content } = await fetchData()
+    const { content } = await fetchData
     for (const [key, value] of Object.entries(content)) {
     contentIndex.add({
     id: key,

diff --git a/layouts/partials/backlinks.html b/layouts/partials/backlinks.html
@@ -3,9 +3,9 @@ <h3>Backlinks</h3>
     {{$url := urls.Parse .Site.BaseURL }}
     {{$host := strings.TrimRight "/" $url.Path }}
     {{$curPage := strings.TrimPrefix $host (strings.TrimRight "/" .Page.RelPermalink) }}
-    {{$linkIndex := getJSON "/static/linkIndex.json"}}
+    {{$linkIndex := getJSON "/assets/indices/linkIndex.json"}}
     {{$inbound := index $linkIndex.index.backlinks $curPage}}
-    {{$contentTable := getJSON "/static/contentIndex.json"}}
+    {{$contentTable := getJSON "/assets/indices/contentIndex.json"}}
     {{if $inbound}}
     {{$cleanedInbound := apply (apply $inbound "index" "." "source") "replace" "." " " "-"}}
     {{- range $cleanedInbound | uniq -}}

diff --git a/layouts/partials/head.html b/layouts/partials/head.html
@@ -21,35 +21,25 @@
     <script src="{{$darkMode.Permalink}}"></script>
 
     <!--  Preload page vars  -->
+    {{$linkIndex := resources.Get "indices/linkIndex.json" | resources.Fingerprint "md5" | resources.Minify |  }}
+    {{$contentIndex := resources.Get "indices/contentIndex.json" | resources.Fingerprint "md5" | resources.Minify }}
     <script>
       const BASE_URL = {{.Site.BaseURL}}
-      let saved = false
-      const fetchData = async () => {
-        if (saved) {
-          return saved
-        } else {
-          const promises = [
-            fetch("{{ .Site.BaseURL }}/linkIndex.json")
+      const fetchData = Promise.all([
+            fetch("{{ $linkIndex.Permalink }}")
               .then(data => data.json())
               .then(data => ({
                 index: data.index,
                 links: data.links,
               })),
-            fetch("{{ .Site.BaseURL }}/contentIndex.json")
+            fetch("{{ $contentIndex.Permalink }}")
               .then(data => data.json()),
-          ]
-          const [{index, links}, content] = await Promise.all(promises)
-          const res = ({
+          ])
+          .then(([{index, links}, content]) => ({
             index,
             links,
             content,
-          })
-          saved = res
-          return res
-        }
-
-      }
-      fetchData()
+          }))
     </script>
 </head>
 {{ template "_internal/google_analytics.html" . }}