LazyLoading d'images stockées dans vuex

Bonjour,
J’ai un template avec 12 tags img:

    <img
        v-if="currentEntertainmentMode === 0"
        :src="item.logo"
        onerror="this.style.visibility='hidden'"
    />

Noter que le tag img est à l’interieur d’une boucle.

La valeur de item.logo est par exemple:

"data:image/svg+xml;base64,PHN2ZyBpZD0iRWJlbmVfMSIgZGF0YS1uYW1lPSJFYmVuZSAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNDIuNzYgNTYuODMiPjxkZWZzPjxzdHlsZT4uY2xzLTEsLmNscy0yLC5jbHMtM3tmaWxsOiNmZmY7fS5jbHMtMXtvcGFjaXR5OjAuNjt9LmNscy0ze29wYWNpdHk6MC41OTt9LmNscy00e2ZpbGw6I2EyMWMyNjt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPmxvZ28td25kLXR2LWluZm88L3RpdGxlPjxyZWN0IGNsYXNzPSJjbHMtMSIgeD0iMjYuODEiIHk9IjAuMTQiIHdpZHRoPSIxMTUuOTUiIGhlaWdodD0iNTYuNjkiLz48cGF0aCBjbGFzcz0iY2xzLTIiIGQ9Ik04Ni44OSw3OS40OWgtNS43VjU0LjQxaDUuN1oiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0zOS4wMSAtMzcuO"

J’ai coupé le contenu entier. C’est donc un SVG en base64. Les SVG s’affichent bien lors du rendu de la page.

Mon problème est que la page met longtemps à s’afficher, car le device sur lequel est rendue la page est TRES lent.
En revanche quand je mets une uri vers un SVG hébergé sur un serveur web, la page s’affiche sans les logos au début puis charge les logos tout en “laissant la main” à l’utilisateur qui peut interagir avec la page.

Ma question:
Est-il possible d’avoir une espèce de loading asynchrone des images dans le cas où les images sont stockées dans le store de vuex en base64? Ceci afin de ne pas avoir à attendre le rendu complet de la page avant de pouvoir commencer à naviguer et interagir avec la page?

une technique simple est créer un composant qui ne va loader l’image (= mettre le base64 dans l’attribut src) que lorsque tu le décides (callback mounted() / lorsqu’il apparait dans le viewport / …)

Merci,
Je vais essayer d’implémenter ça.