From cb210605da4f5f8fc2a88dd2c9340fa4ff2e1101 Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.me>
Date: Tue, 8 Mar 2022 18:25:38 -0800
Subject: feat: api fetch time

---
 src/routes/index.svelte     | 6 +++++-
 src/routes/language.svelte  | 5 ++++-
 src/routes/languages.svelte | 6 +++++-
 3 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/src/routes/index.svelte b/src/routes/index.svelte
index efa4d00..ce5a596 100644
--- a/src/routes/index.svelte
+++ b/src/routes/index.svelte
@@ -19,11 +19,14 @@ SPDX-License-Identifier: GPL-3.0-only -->
   import { onMount } from "svelte";
   import { fetchRandomImage } from "$lib/api";
 
-  let image;
+  let image, fetchTime;
   let complete = false;
 
   onMount(async () => {
+    fetchTime = performance.now();
     image = (await fetchRandomImage()).image;
+    fetchTime = performance.now() - fetchTime;
+
     complete = true;
   });
 </script>
@@ -46,6 +49,7 @@ SPDX-License-Identifier: GPL-3.0-only -->
         />
       </a>
     </div>
+    <small>Fetch time: {fetchTime}ms</small>
   {/if}
 
   <h2>Contributing</h2>
diff --git a/src/routes/language.svelte b/src/routes/language.svelte
index dacbf72..39f0c4c 100644
--- a/src/routes/language.svelte
+++ b/src/routes/language.svelte
@@ -21,11 +21,13 @@ SPDX-License-Identifier: GPL-3.0-only -->
   import { page } from "$app/stores";
 
   let language = $page.url.searchParams.get("language");
-  let images;
+  let images, fetchTime;
   let complete = false;
 
   onMount(async () => {
+    fetchTime = performance.now();
     images = await fetchImages(language);
+    fetchTime = performance.now() - fetchTime;
     complete = true;
   });
 </script>
@@ -54,5 +56,6 @@ SPDX-License-Identifier: GPL-3.0-only -->
         </li>
       {/each}
     </ul>
+    <small>Fetch time: {fetchTime}ms</small>
   {/if}
 </div>
diff --git a/src/routes/languages.svelte b/src/routes/languages.svelte
index 9f14e18..f8156ba 100644
--- a/src/routes/languages.svelte
+++ b/src/routes/languages.svelte
@@ -18,11 +18,14 @@ SPDX-License-Identifier: GPL-3.0-only -->
 <script>
   import { onMount } from "svelte";
   import { fetchLanguages } from "$lib/api";
-  let languages;
+
+  let languages, fetchTime;
   let complete = false;
 
   onMount(async () => {
+    fetchTime = performance.now();
     languages = await fetchLanguages();
+    fetchTime = performance.now() - fetchTime;
     complete = true;
   });
 </script>
@@ -50,5 +53,6 @@ SPDX-License-Identifier: GPL-3.0-only -->
         </li>
       {/each}
     </ul>
+    <small>Fetch time: {fetchTime}ms</small>
   {/if}
 </div>
-- 
cgit v1.2.3