From f2e8de1d1dd3831c5018468d15acbec36756d6eb Mon Sep 17 00:00:00 2001
From: Ilia Mashkov <hikkikomori7@gmail.com>
Date: Thu, 12 Feb 2026 12:19:11 +0300
Subject: [PATCH] feat(comparisonStore): add the check before loading

---
 .../model/stores/comparisonStore.svelte.ts    | 20 +++++++++++++++----
 1 file changed, 16 insertions(+), 4 deletions(-)

diff --git a/src/widgets/ComparisonSlider/model/stores/comparisonStore.svelte.ts b/src/widgets/ComparisonSlider/model/stores/comparisonStore.svelte.ts
index d277e5f..270bb96 100644
--- a/src/widgets/ComparisonSlider/model/stores/comparisonStore.svelte.ts
+++ b/src/widgets/ComparisonSlider/model/stores/comparisonStore.svelte.ts
@@ -78,8 +78,6 @@ class ComparisonStore {
             return;
         }
 
-        this.#fontsReady = false;
-
         const weight = this.#typography.weight;
         const size = this.#typography.renderedSize;
         const fontAName = this.#fontA?.name;
@@ -87,11 +85,25 @@ class ComparisonStore {
 
         if (!fontAName || !fontBName) return;
 
+        const fontAString = `${weight} ${size}px "${fontAName}"`;
+        const fontBString = `${weight} ${size}px "${fontBName}"`;
+
+        // Check if already loaded to avoid UI flash
+        const isALoaded = document.fonts.check(fontAString);
+        const isBLoaded = document.fonts.check(fontBString);
+
+        if (isALoaded && isBLoaded) {
+            this.#fontsReady = true;
+            return;
+        }
+
+        this.#fontsReady = false;
+
         try {
             // Step 1: Load fonts into memory
             await Promise.all([
-                document.fonts.load(`${weight} ${size}px "${fontAName}"`),
-                document.fonts.load(`${weight} ${size}px "${fontBName}"`),
+                document.fonts.load(fontAString),
+                document.fonts.load(fontBString),
             ]);
 
             // Step 2: Wait for browser to be ready to render