Cette note technique confirme que l'architecture décrite est parfaitement alignée avec les spécifications de Circuy et les standards de l'industrie (Appcues, Pendo, Chameleon). En utilisant Shepherd.js comme moteur d'affichage et une couche SaaS pour la gestion dynamique, vous optimisez à la fois la performance et la flexibilité [1-3].

Note : Architecture du SDK et Optimisation de la Performance

Cette architecture repose sur le principe d'un SDK "interprète" plutôt que d'un bloc de code statique [2].

1. Avantages Majeurs du Modèle

• Taille de SDK minimale et fixe : Le SDK reste ultra-léger (objectif < 15 KB gzippé ) car il ne contient aucune donnée de parcours [4, 5]. Que vous ayez 1 ou 500 scénarios, le poids du script chargé par le client ne change pas [4].
• Mises à jour instantanées ("Zero Redeploy") : Lorsqu'un utilisateur publie un parcours depuis l' extension Chrome , le JSON est envoyé au backend et distribué via CDN [6, 7]. Les modifications sont actives immédiatement pour les utilisateurs finaux sans aucune modification du code source du site client [7, 8].
• Ciblage dynamique : Le backend (Targeting Engine) permet de filtrer les parcours en fonction de l'URL (window.location.pathname), du segment utilisateur (rôle, langue) ou de la fréquence d'affichage [8, 9].

2. Le Flux de Données Type

Le système interconnecte trois composants principaux pour assurer la fluidité de l'expérience [4] :

1. [Extension Navigateur] : Capture les sélecteurs et crée le scénario ➔ Sauvegarde vers le Backend [6, 7].
2. [API / Backend] : Stocke la structure JSON et la distribue via un CDN [9-11].
3. [Site Web Client] : Le SDK s'initialise ➔ Fetch asynchrone du JSON ➔ Exécution par le moteur Shepherd.js [5, 8].

3. Les 3 Règles d'Or pour la Performance

Pour garantir que le SDK n'impacte pas les Core Web Vitals du client, les principes suivants sont appliqués :

• Mise en cache via CDN (Crucial) : Les fichiers de configuration JSON doivent être servis par un CDN (ex: Scaleway Object Storage + CDN) pour garantir des temps de réponse inférieurs à 20ms grâce aux serveurs Edge [8, 11].
• Authentification par Clé Publique : Le SDK utilise une clé d'API publique (data-key) bridée par domaines autorisés (CORS / Whitelisting) pour sécuriser l'accès tout en simplifiant l'intégration [7, 12].
• Fetch Asynchrone Non-Bloquant : Le chargement du SDK et la récupération des parcours s'effectuent de manière différée et asynchrone , préservant ainsi l'interactivité globale de la page hôte [4, 8].

Cette structure garantit un produit scalable où l'effort de développement est concentré sur la valeur ajoutée : l'édition No-Code et la résilience du ciblage (Auto-healing) [3, 13].