Only use placeholder if image doesn't load in 100ms

src/components/Cards/CardImage.vue

@@ -17,16 +17,23 @@ export default class CardImage extends Vue {
 
   private loaded!: boolean;
   private loadedURL!: string;
+  private loadedTimeout!: boolean;
 
   private data() {
     return {
       loaded: false,
-      loadedURL: ""
+      loadedURL: "",
+      loadedTimeout: false
     };
   }
 
   private mounted() {
     this.fetchImage();
+    setTimeout(() => {
+      if (!this.loaded) {
+        this.loadedTimeout = true;
+      }
+    }, 100);
     this.$watch("id", () => {
       this.loaded = false;
       this.fetchImage();
@@ -43,7 +50,10 @@ export default class CardImage extends Vue {
     if (this.loaded) {
       return this.loadedURL;
     }
+    if (this.loadedTimeout) {
       return require("@/assets/images/cardback.webp");
     }
+    return "";
+  }
 }
 </script>