From d84a3a960b85dfa4cddee488052abaeea9553f00 Mon Sep 17 00:00:00 2001
From: Fuwn <fuwnzy@gmail.com>
Date: Wed, 9 Mar 2022 01:18:51 -0800
Subject: [PATCH] feat(routes): fetch time

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

diff --git a/src/routes/index.svelte b/src/routes/index.svelte
index bbb1670..a1a3a1c 100644
--- a/src/routes/index.svelte
+++ b/src/routes/index.svelte
@@ -19,11 +19,13 @@ 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 +48,7 @@ SPDX-License-Identifier: GPL-3.0-only -->
         />
       </a>
     </div>
+    <p>Fetch time: {fetchTime}ms</p>
   {/if}
 
   <h2>Contributing</h2>
diff --git a/src/routes/language.svelte b/src/routes/language.svelte
index f9f1345..bbad67b 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>
+    <p>Fetch time: {fetchTime}ms</p>
   {/if}
 </div>
diff --git a/src/routes/languages.svelte b/src/routes/languages.svelte
index 620d0cf..49d44d7 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>
+    <p>Fetch time: {fetchTime}ms</p>
   {/if}
 </div>
-- 
2.44.0