feat: better cache some stuff

components/Card.tsx

@@ -12,7 +12,7 @@ export function Card(
   const backgroundStyle = {
     backgroundImage: `url(${image})`,
     backgroundSize: "cover",
-    boxShadow: "0px -60px 90px black inset, 0px 10px 20px #fff3 inset",
+    boxShadow: "0px -60px 90px black inset, 0px 10px 20px #fff1 inset",
   };
 
   if (backgroundSize !== 100) {
@@ -30,11 +30,14 @@ export function Card(
   sm:w-48 sm:h-48
   w-[37vw] h-[37vw]"
     >
-      <img
-        class="absolute opacity-30 top-0 left-0 object-cover w-full h-full -z-10"
-        src={image}
-        style={{ filter: "blur(30px)" }}
-      />
+      {!image?.includes("placeholder.svg") &&
+        (
+          <img
+            class="absolute opacity-30 top-0 left-0 object-cover w-full h-full -z-10"
+            src={image}
+            style={{ filter: "blur(30px)" }}
+          />
+        )}
       <div class="h-full flex flex-col justify-between relative z-10">
         <div>
           {/* Recipe Card content */}