feat(routes): fetch time

diff --git a/src/routes/index.svelte b/src/routes/index.svelte
index bbb1670bd86afdeba871d40be91c5a62f523be1f..a1a3a1cc6e769956c1665a1c6a0bdfe9962867cc 100644 (file)
--- 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 f9f1345c49a862947424b7040c2fd2ff8e2c14ba..bbad67bdae0ac0f5cd9c5e5c0525a95dfa045394 100644 (file)
--- 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 620d0cf0853a7013ae888383a3f66ca8cab19f3e..49d44d73b5f76058d5d375fa59291e5281e496c1 100644 (file)
--- 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>