> ## Documentation Index
> Fetch the complete documentation index at: https://docs.kameleoon.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Flux d'execution du moteur

> Comprenez le fonctionnement du moteur d'experimentation Kameleoon, y compris une decomposition detaillee des phases de chargement, suivi et execution.

# Flux d'exécution du moteur

Apprenez comment le moteur d'expérimentation charge, suit et exécute les expériences.

## Vue d'ensemble du moteur d'expérimentation

Kameleoon offre une solution d'optimisation à plateforme unique pour l'expérimentation des applications web et full-stack. La plateforme prend en charge deux solutions principales :

* **Web Experimentation** : Effectuez des A/B tests et d'autres formes d'expérimentation pour les sites web et applications web.
* **Feature Experimentation** : Activez le feature flagging full-stack et l'expérimentation. Kameleoon fournit également des API et outils supplémentaires pour éliminer le clignotement dans les expériences A/B, intégrer vos outils existants et automatiser les tâches.

### Flux de code : chargement

```mermaid theme={null}
graph TD
    %% Main Flow Nodes
    EntryPoint(["Entry point"])
    JSFile(["Kameleoon.js"])
    
    LoadEngine(["Load the Kameleoon engine"])
    InitEngine(["Initialize the Kameleoon engine"])
    
    EventLoaded("Send the Kameleoon::Loaded event")
    CheckAbort(["Check abort conditions"])
    
    %% Branching Outcomes
    NoCond("No")
    YesCond("Yes")
    
    %% Yes Flow Nodes
    EventAborted("Send the Kameleoon::Aborted event")
    StopExecution("Stop the execution of Kameleoon<br>on the webpage")
    
    %% Side-Car/Optional Nodes
    DetailCmdQueue("Execute the Kameleoon CommandQueue code<br>with the level: IMMEDIATE argument")
    DetailFlicker("Optional: Remove the anti-flicker CSS rule.<br>Store the timestamp of the engine initialize completion step.")
    DetailDefer(["Optional: Defer all campaigns and configurations<br>(goals, segments, and so on) in a second call."])
    
    %% Continuation Placeholder
    NoDown("⬇")

    %% --- Connections ---
    
    %% Main Path
    EntryPoint --> JSFile
    JSFile --> LoadEngine
    LoadEngine --> InitEngine
    InitEngine --> EventLoaded
    EventLoaded --> CheckAbort
    
    %% Conditions
    CheckAbort --> NoCond
    CheckAbort --> YesCond
    
    %% Yes Path
    YesCond --> EventAborted
    EventAborted --> StopExecution
    
    %% No Path
    NoCond --> NoDown
    
    %% Side Actions
    LoadEngine --> DetailCmdQueue
    InitEngine --> DetailFlicker
    
    %% Connect the two Optional blocks
    DetailFlicker --> DetailDefer

    %% --- Styling ---
    classDef default fill:#F2F2FF,stroke:#8A8AC2,stroke-width:1px,color:#111;
    classDef whiteBox fill:#FFFFFF,stroke:#E2E2F2,stroke-width:1px,color:#111;
    classDef borderless fill:none,stroke:none,color:#111;
    
    class EventLoaded,EventAborted,StopExecution,DetailCmdQueue,DetailFlicker,NoCond,YesCond whiteBox;
    class NoDown borderless;
```

Le moteur Kameleoon exécute le tag `engine.js` (précédemment `kameleoon.js`). Invoquez ce tag JavaScript via le code source HTML des pages de votre application.

Au point d'entrée, le moteur :

1. **Activation** : Le tag `engine.js` invoque un appel à l'API d'activation via `Kameleoon.Analyst.load()`.

2. **Exécution de la file de commandes** : Après le chargement, le moteur vérifie le [tableau kameleoonQueue](../../apis/activation-api-js/api-reference/command-queue#syntax) et exécute les commandes dans l'ordre où vous les avez ajoutées. Utilisez ceci pour le code qui doit s'exécuter avant que Kameleoon n'instancie les fonctions.

<Note>
  Kameleoon n'exécute que les fonctions ajoutées à la file avec le paramètre `IMMEDIATE`.
</Note>

3. **Anti-flicker et variables globales** : Le **clignotement** se produit lorsque la page d'origine s'affiche brièvement avant l'apparition de la variation. Cet effet peut conduire à des résultats inexacts. Kameleoon utilise des techniques avancées pour éliminer le clignotement. Si vous configurez l'anti-flicker, le système charge le script Kameleoon de manière asynchrone avec le [code anti-flicker](../implementation-and-deployment/standard-implementation#tag-asynchrone-avec-anti-flicker).

Une fois que Kameleoon a fini de se charger, la variable `window.KameleoonEndLoadTime` stocke l'horodatage de fin.

<Note>
  Ajustez le timeout à l'aide de la variable `kameleoonLoadingTimeout` dans le snippet d'installation. Nous recommandons de conserver la valeur par défaut de 1000 millisecondes (ou 750 millisecondes pour les implémentations modernes). Cette variable détermine le temps maximal pendant lequel le tag d'installation peut retarder l'affichage de la page en attendant le fichier d'application.
</Note>

4. **Vérification des motifs de blocage** : Avant de terminer l'initialisation, le moteur vérifie ces motifs de blocage :

   * **Storage** : Si le stockage local ou de session est indisponible, le moteur s'arrête et renvoie l'événement `Kameleoon::Aborted` avec le code `STORAGE`.
   * **Timeout** : Si `engine.js` met plus de 750 ms à charger et que vous avez configuré le projet pour désactiver Kameleoon pour la page ou la visite, le moteur renvoie `TIMEOUT`.
   * **Prerender** : Kameleoon exige que le document soit prêt (`document.visibilityState == "prerender"`). Si ce n'est pas le cas, le script s'arrête et renvoie `PRERENDER`. Il recharge lorsque l'état de visibilité change.
   * **Custom script** : Si un script personnalisé annule la session, le moteur renvoie `SCRIPT`.
   * **Parameter** : Si l'URL contient `KameleoonDisabled == true`, le moteur renvoie `PARAMETER` et s'arrête.
   * **Disabled** : Si vous désactivez le projet dans le dashboard, le moteur renvoie `DISABLED`. Voir [cet article](/user-manual/project-management/manage-your-projects) pour plus de détails.

<Note>
  Seul un account manager technique Kameleoon peut configurer des scripts d'arrêt personnalisés.
</Note>

5. **Différés** : Le moteur reporte le code et les campagnes à un second appel si nécessaire. Dans ce cas, le moteur récupère la configuration et les campagnes en mode SYNC depuis `https://SITECODE.kameleoon.com/engine-configuration.js` (précédemment nommé `kameleoon-configuration.js`) et `https://SITECODE.kameleoon.com/engine-campaigns.js` (précédemment nommé `kameleoon-actions.js`), respectivement.

<Note>
  Seul un account manager technique Kameleoon peut configurer l'option de différer toutes les campagnes. Vous pouvez différer des expériences spécifiques en utilisant le tag "DELAYED".
</Note>

S'il n'y a pas de motifs de blocage, le moteur passe à l'étape de suivi des données du visiteur.

### Flux de code : suivi

```mermaid theme={null}
graph TD
    %% --- MAIN SPINE ---
    ParseBrowser(["Parse the browser and OS"])
    UnifySession("If the Unify session data across subdomains option is enabled:")
    RetrieveData["Send a message to the Kameleoon iframe to retrieve the data from the main domain's local storage.<br>Otherwise, retrieve it from the current local storage."]
    InitConsent(["Initialize consent management"])
    
    %% MERGED NODE: InitVisitor + its details
    InitVisitor["Initialize the Visitor object<br>---<br>1. Obtain all previous visits from local storage.<br>Optional: If the Real-Time Sync of visits option is enabled, an additional call retrieves visits stored on Kameleoon Data servers.<br><br>2. Generate a visitorCode ID if no existing one is found in the KameleoonVisitorCode cookie or local storage."]
    
    %% MERGED NODE: SendEvents + its detail
    SendEvents["Send events<br>---<br>Optional: Initialize the product recommendation history."]
    
    ExecGlobalScript(["Execute the project global custom script"])
    ExecQueue(["Execute the remaining code in the Kameleoon CommandQueue"])
    EventStarted(["Send the Kameleoon::Started event"])
    
    %% MERGED NODE: WaitDOM
    WaitDOM["Wait for the DOM to be ready.<br>---<br>Optional: If the Enable support for dynamic websites option is enabled, Kameleoon listens for URL changes to reload its engine."]
    
    InitCampaigns(["Initialize campaigns and actions"])
    FlowContinues("⬇")

    %% --- MAIN FLOW CONNECTIONS ---
    ParseBrowser --> UnifySession
    UnifySession --> RetrieveData
    RetrieveData --> InitConsent
    InitConsent --> InitVisitor
    InitVisitor --> SendEvents
    SendEvents --> ExecGlobalScript
    ExecGlobalScript --> ExecQueue
    ExecQueue --> EventStarted
    EventStarted --> WaitDOM
    WaitDOM --> InitCampaigns
    InitCampaigns --> FlowContinues

    %% --- BRANCHES (Now with plenty of room to fan out) ---
    
    %% Event Branches
    PageEvent("Page event<br>---<br>Page URL and title")
    StaticDataEvent("StaticData event<br>---<br>Data about the device, OS, window size, visit number, time since previous visit, timezone, and language")
    ActivityEvent("Activity event<br>---<br>Data about clicks and activity")

    SendEvents --> PageEvent
    SendEvents --> StaticDataEvent
    SendEvents --> ActivityEvent

    %% Campaign Branches
    Adblocker("Check Adblocker<br>---<br>Check if the visitor is using an adblocker, and send an Adblocker event if they are.")
    RunMutObs("Run MutationObserver<br>---<br>Run the optimization MutationObserver to fill all classes of elements and IDs present on the page for querySelector optimization.")
    GeoOpt("Optional: Geolocation / IP<br>---<br>IP: IP request to get the user IP address (https://data.kameleoon.io/ip).<br>Geolocation: Request to get user geolocation (Country, Region, City).")
    LiveUpdateOpt("Optional: Live Update<br>---<br>Load configuration from https://SITECODE.kameleoon.com/live-experiments/config.js.")

    InitCampaigns --> Adblocker
    InitCampaigns --> RunMutObs
    InitCampaigns --> GeoOpt
    InitCampaigns --> LiveUpdateOpt

    %% --- STYLING ---
    classDef default fill:#F2F2FF,stroke:#8A8AC2,stroke-width:1px,color:#111;
    classDef whiteBox fill:#FFFFFF,stroke:#E2E2F2,stroke-width:1px,color:#111;
    classDef detailBox fill:#FFFFFF,stroke:#8A8AC2,stroke-width:2px,color:#111;
    classDef borderless fill:none,stroke:none,color:#111;

    class UnifySession,RetrieveData,PageEvent,StaticDataEvent,ActivityEvent,Adblocker,RunMutObs,GeoOpt,LiveUpdateOpt whiteBox;
    
    %% Detail boxes get a slightly thicker border to denote they contain sub-steps
    class InitVisitor,SendEvents,WaitDOM detailBox;
    class FlowContinues borderless;
```

Après l'initialisation, Kameleoon récupère les données du visiteur :

1. Kameleoon collecte les données techniques telles que le navigateur et le système d'exploitation du visiteur.
2. Si vous activez [unifier les données de session entre sous-domaines](../technical-concepts/unify-session-data-storage-across-subdomains), Kameleoon récupère les données antérieures à l'aide d'une iFrame sur le domaine principal de stockage local.
3. Si vous activez la `synchronisation en temps réel des visites` ou l'option [`cross-device`](../../cross-device-experimentation), le moteur récupère l'historique d'usage depuis les serveurs Kameleoon.

<Note>
  La synchronisation en temps réel est active par défaut pour Kameleoon Feature Experimentation ou pour Safari afin de gérer les [impacts ITP](../technical-concepts/itp-management).
</Note>

4. Le moteur initialise un visiteur. S'il n'existe aucun code dans le cookie `kameleoonVisitorCode` ou dans le stockage local, le moteur assigne un nouveau code visiteur et analyse toutes les visites.
5. Le moteur analyse et stocke des données telles que l'URL de la page, l'appareil, le système d'exploitation, la géolocalisation et les objectifs.

<Note>
  Si vous utilisez le module complémentaire de recommandation produit, Kameleoon instancie le moteur de recommandation ici.
</Note>

6. Le script personnalisé global exécute tout JavaScript inséré avant d'initialiser les expériences.
7. Le script global d'expérience s'exécute après le script personnalisé global. Ce script s'exécute indépendamment du ciblage et s'arrête lorsque l'expérience est mise en pause. Consultez [ce guide](/user-manual/experimentation/web-experimentation/graphic-based-experiments/getting-started-with-the-graphic-editor#Experiment-specific_custom_script) pour plus de détails.
8. Le moteur exécute les commandes en attente de la `CommandQueue` qui n'utilisent pas le paramètre `IMMEDIATE`.
9. L'événement `Kameleoon::Started` se déclenche lorsque l'initialisation est terminée et le moteur stocke les données.
10. Si vous activez la [gestion SPA](/user-manual/experimentation/web-experimentation/advanced-experiment-types/set-up-experiment-single-page-app), Kameleoon surveille les changements d'URL. Lorsque l'URL change, le moteur recharge pour s'assurer que les campagnes fonctionnent correctement sur la nouvelle vue.
11. Avant d'initialiser les campagnes, Kameleoon :
    * Vérifie la présence d'un bloqueur de publicités.
    * Exécute `mutationObserver` pour optimiser les opérations `querySelector`.
    * Récupère les données de géolocalisation depuis `https://eu-data.kameleoon.io/ip` si le segment l'exige.
12. Pour charger la configuration des campagnes, Kameleoon récupère les données depuis `https://SITECODE.kameleoon.com/live-experiments/config.js` et les met en cache pendant 2 minutes.

<Note>
  La fonctionnalité Live Update Experiments rafraîchit les expériences taguées `LIVE-UPDATE` pour permettre des changements de configuration en temps réel sans retards de mise en cache du navigateur.
</Note>

### Flux de code : exécution

```mermaid theme={null}
graph TD
    %% Main Start Node
    StartNode(["Run all Experiments / Personalizations"])

    %% --- LEFT BRANCH: Holdout Control ---
    %% Check Node
    CheckHoldout(["Check if visitor is in an 'Holdout Control group'"])
    
    %% Outcomes
    OutcomeNo[No]
    OutcomeYes[Yes]

    %% No Flow Nodes
    HoldoutInclusionEvent(["Send holdout inclusion event"])
    IfTargetingTrue(["If targeting is 'true' for the visitor"])
    OptionalDelayedTag(["(Optional) If the campaign has a 'DELAYED' tag"])
    DownloadVariationData["<b>Download variation data</b><br>---<br>https://SITECODE.kameleoon.com/{personalizations/experiments}/$campaign_id/variations/$variation_id.js"]
    SendExpPersEvent(["Send Experiment / Personalization event"])
    
    %% Yes Flow Nodes
    HoldoutExclusionEvent(["Send holdout exclusion event"])

    %% Left Branch Connections
    StartNode --> CheckHoldout
    CheckHoldout --> OutcomeNo
    CheckHoldout --> OutcomeYes
    OutcomeNo --> HoldoutInclusionEvent
    HoldoutInclusionEvent --> IfTargetingTrue
    IfTargetingTrue --> OptionalDelayedTag
    OptionalDelayedTag --> DownloadVariationData
    DownloadVariationData --> SendExpPersEvent
    OutcomeYes --> HoldoutExclusionEvent

    %% --- RIGHT BRANCH: Targeting and Goals ---
    %% Split Point Node
    RunTargetingSegments(["Run all Targeting Segments"])
    
    %% Splitting Nodes
    %% Flow 1: Targeting Event
    IfSegmentConditions(["If the segment conditions are met for the visitor"])
    SendTargetingEvent(["Send Targeting event"])
    
    %% Flow 2: Goal Flow
    OptionalAIOpportunity(["(Optional) If the AI Opportunity Detection add-on is enabled"])
    DownloadOpportunitySegment["<b>Download opportunity segment and execute them</b><br>---<br>https://SITECODE.kameleoon.com/audiences/segments.js"]
    RunAllGoals(["Run all goals"])
    IfGoalConverted(["If the goal is converted for the visitor"])
    SendGoalEvent(["Send Goal event"])

    %% Right Branch Connections
    StartNode --> RunTargetingSegments
    
    %% Flow 1 Connections
    RunTargetingSegments --> IfSegmentConditions
    IfSegmentConditions --> SendTargetingEvent
    
    %% Flow 2 Connections
    RunTargetingSegments --> OptionalAIOpportunity
    OptionalAIOpportunity --> DownloadOpportunitySegment
    DownloadOpportunitySegment --> RunAllGoals
    RunAllGoals --> IfGoalConverted
    IfGoalConverted --> SendGoalEvent

    %% --- STYLING ---
    classDef mainStep fill:#F2F2FF,stroke:#8A8AC2,stroke-width:1px,rx:10,ry:10,color:#111;
    classDef whiteBox fill:#FFFFFF,stroke:#E2E2F2,stroke-width:1px,color:#111;
    classDef conditionalPill fill:#D0D0FF,stroke:#8A8AC2,stroke-width:1.5px,rx:10,ry:10,color:#111;
    classDef outcome fill:#ffffff,stroke:#8A8AC2,stroke-width:1px,rx:5,ry:5,color:#111;

    class StartNode,CheckHoldout,HoldoutInclusionEvent,HoldoutExclusionEvent,SendExpPersEvent,RunTargetingSegments,SendTargetingEvent,RunAllGoals,SendGoalEvent mainStep;
    class DownloadVariationData,DownloadOpportunitySegment whiteBox;
    class IfTargetingTrue,OptionalDelayedTag,IfSegmentConditions,OptionalAIOpportunity,IfGoalConverted conditionalPill;
    class OutcomeNo,OutcomeYes outcome;
```

Lorsque la boucle d'expérimentation s'exécute, le moteur :

1. Si le visiteur fait partie d'un groupe "holdout", le moteur envoie un événement d'inclusion holdout.
2. Le moteur déclenche un événement d'exposition contenant un `nonce`, un `experimentID` et un `variationId`. Par exemple : `eventType=experiment&nonce=5800F1BDD0667747&id=250830&variationId=978588`.
3. Si le visiteur n'est pas dans un groupe holdout, le moteur envoie un "événement d'exclusion holdout".

<Note>
  Les expériences holdout vous permettent de gérer et de bloquer d'autres expériences :

  * Le moteur vérifie d'abord les expériences holdout.
  * Si un utilisateur est dans un groupe holdout, le moteur l'assigne à un groupe et envoie un événement à des fins de reporting.
  * Si l'utilisateur est dans le groupe de référence, le moteur bloque toutes les autres expériences.
  * Si l'utilisateur est dans le groupe de variation, le moteur permet aux autres expériences de se dérouler.

  Pour en savoir plus, consultez le [guide de gestion des Holdouts](/user-manual/experiment-analytics/analyze-results/advanced-analysis/create-and-manage-holdouts).
</Note>

Le moteur démarre ensuite la collecte de données. Si une personnalisation se déclenche mais ne s'affiche pas, le moteur renvoie l'un des motifs de blocage suivants :

* **PERSONALIZATION\_CAPPING** : La personnalisation a atteint sa limite globale de visiteurs.
* **SCHEDULE** : La personnalisation est désactivée en fonction de son planning.
* **SCENARIO** : Certaines conditions de scénario ne sont pas remplies.
* **PRIORITY** : Une personnalisation de priorité supérieure existe.
* **VISITOR\_CAPPING** : Le visiteur a atteint une limite empêchant l'affichage.

Si vous associez un tag `DELAYED` à une expérience, le moteur la déclenche après le premier chargement de page. Le moteur télécharge les données de variation depuis `https://SITECODE.kameleoon.com/(personalizations)/$campaign_id/variations/$variation_id.js`.

<Note>
  Différer une expérience est utile pour les popups ou les modifications situées sous la ligne de flottaison, où le clignotement est minime.
</Note>

Pour le module complémentaire AI Opportunity Detection, Kameleoon télécharge les définitions de segments depuis `https://SITECODE.kameleoon.com/audiences/segments.js` pour détecter les opportunités.

<Note>
  Kameleoon vérifie les segments créés ou modifiés au cours des 90 derniers jours, à l'exclusion de ceux commençant par `[DEV]`, `[TEST]` ou `[QA]`.
</Note>

Analysez ces informations sur la page de résultats pour suivre les taux de conversion et la croissance potentielle du chiffre d'affaires.