StillHammer
4f60de68d6
- Fix BatchProcessor constructor to avoid server blocking during startup - Add comprehensive integration tests for all modular combinations - Enhance CLAUDE.md documentation with new test commands - Update SelectiveLayers configuration for better LLM allocation - Add AutoReporter system for test automation - Include production workflow validation tests 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
445 lines
44 KiB
HTML
445 lines
44 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Auto-Rapport TI - 9/17/2025, 1:40:14 PM</title>
|
|
<style>
|
|
body { font-family: Arial, sans-serif; margin: 20px; background: #f5f5f5; }
|
|
.container { max-width: 1000px; margin: 0 auto; }
|
|
.header { background: white; padding: 20px; border-radius: 8px; margin-bottom: 20px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); }
|
|
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 15px; margin-bottom: 20px; }
|
|
.stat-card { background: white; padding: 15px; border-radius: 8px; text-align: center; box-shadow: 0 2px 4px rgba(0,0,0,0.1); }
|
|
.stat-value { font-size: 1.8em; font-weight: bold; color: #2196F3; }
|
|
.stat-label { color: #666; margin-top: 5px; font-size: 14px; }
|
|
.test-list { background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); }
|
|
.test-item { padding: 10px; border-bottom: 1px solid #eee; display: flex; justify-content: space-between; align-items: center; cursor: pointer; transition: background-color 0.2s; }
|
|
.test-item:hover { background: #f8f9fa; }
|
|
.test-item.clickable { border-left: 4px solid #4CAF50; }
|
|
.test-status { width: 12px; height: 12px; border-radius: 50%; margin-right: 10px; }
|
|
.status-passed { background: #4CAF50; }
|
|
.status-failed { background: #f44336; }
|
|
.llm-section { background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); margin-top: 20px; }
|
|
.llm-call { background: #f9f9f9; padding: 10px; margin: 5px 0; border-radius: 4px; display: flex; justify-content: space-between; cursor: pointer; transition: background-color 0.2s; }
|
|
.llm-call:hover { background: #e8f4f8; }
|
|
.llm-call.clickable { border-left: 4px solid #2196F3; }
|
|
|
|
/* Modal styles */
|
|
.modal { display: none; position: fixed; z-index: 1000; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); }
|
|
#llmModal { z-index: 1100; } /* LLM modal au-dessus du test modal */
|
|
.modal-content { background-color: white; margin: 5% auto; padding: 20px; border-radius: 8px; width: 90%; max-width: 800px; max-height: 80vh; overflow-y: auto; }
|
|
.close { color: #aaa; float: right; font-size: 28px; font-weight: bold; cursor: pointer; }
|
|
.close:hover { color: black; }
|
|
.prompt-section, .response-section { margin: 15px 0; }
|
|
.prompt-section h4, .response-section h4 { color: #333; border-bottom: 2px solid #2196F3; padding-bottom: 5px; }
|
|
.prompt-content, .response-content { background: #f5f5f5; padding: 15px; border-radius: 4px; white-space: pre-wrap; font-family: monospace; font-size: 14px; max-height: 300px; overflow-y: auto; }
|
|
.response-content { background: #f0f8ff; }
|
|
|
|
/* Test details modal styles */
|
|
.test-details-section { margin: 15px 0; }
|
|
.test-details-section h4 { color: #333; border-bottom: 2px solid #4CAF50; padding-bottom: 5px; }
|
|
.test-llm-list { background: #f8f9fa; padding: 10px; border-radius: 4px; margin-top: 10px; }
|
|
.test-llm-item { background: white; margin: 5px 0; padding: 8px; border-radius: 3px; display: flex; justify-content: space-between; cursor: pointer; border: 1px solid #ddd; }
|
|
.test-llm-item:hover { background: #e8f4f8; }
|
|
.test-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 10px; margin: 10px 0; }
|
|
.test-stat { background: #f0f0f0; padding: 8px; border-radius: 4px; text-align: center; }
|
|
.test-stat-value { font-weight: bold; color: #2196F3; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<div class="header">
|
|
<h1>📊 Auto-Rapport Tests d'Intégration</h1>
|
|
<p>Généré automatiquement le 9/17/2025, 1:40:14 PM</p>
|
|
</div>
|
|
|
|
<div class="stats">
|
|
<div class="stat-card">
|
|
<div class="stat-value">5</div>
|
|
<div class="stat-label">Tests</div>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="stat-value" style="color: #4CAF50">5</div>
|
|
<div class="stat-label">Réussis</div>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="stat-value" style="color: #f44336">0</div>
|
|
<div class="stat-label">Échoués</div>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="stat-value">7</div>
|
|
<div class="stat-label">LLM Calls</div>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="stat-value">87s</div>
|
|
<div class="stat-label">Durée</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="test-list">
|
|
<h3>Résultats des Tests</h3>
|
|
|
|
<div class="test-item clickable" onclick="openTestModal(0)">
|
|
<div style="display: flex; align-items: center;">
|
|
<span class="test-status status-passed"></span>
|
|
<div>
|
|
<div><strong>lightEnhancement (rapide)</strong></div>
|
|
<div style="font-size: 12px; color: #666;">
|
|
1 LLM calls • 9s durée LLM
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div style="text-align: right;">
|
|
<div style="color: #4CAF50; font-weight: bold;">
|
|
✓ RÉUSSI
|
|
</div>
|
|
<div style="font-size: 10px; color: #2196F3; margin-top: 2px;">
|
|
🔍 Cliquer pour détails
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="test-item clickable" onclick="openTestModal(1)">
|
|
<div style="display: flex; align-items: center;">
|
|
<span class="test-status status-passed"></span>
|
|
<div>
|
|
<div><strong>standardEnhancement (complet)</strong></div>
|
|
<div style="font-size: 12px; color: #666;">
|
|
2 LLM calls • 40s durée LLM
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div style="text-align: right;">
|
|
<div style="color: #4CAF50; font-weight: bold;">
|
|
✓ RÉUSSI
|
|
</div>
|
|
<div style="font-size: 10px; color: #2196F3; margin-top: 2px;">
|
|
🔍 Cliquer pour détails
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="test-item clickable" onclick="openTestModal(2)">
|
|
<div style="display: flex; align-items: center;">
|
|
<span class="test-status status-passed"></span>
|
|
<div>
|
|
<div><strong>fullEnhancement (maximum)</strong></div>
|
|
<div style="font-size: 12px; color: #666;">
|
|
1 LLM calls • 5s durée LLM
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div style="text-align: right;">
|
|
<div style="color: #4CAF50; font-weight: bold;">
|
|
✓ RÉUSSI
|
|
</div>
|
|
<div style="font-size: 10px; color: #2196F3; margin-top: 2px;">
|
|
🔍 Cliquer pour détails
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="test-item clickable" onclick="openTestModal(3)">
|
|
<div style="display: flex; align-items: center;">
|
|
<span class="test-status status-passed"></span>
|
|
<div>
|
|
<div><strong>Adversarial general</strong></div>
|
|
<div style="font-size: 12px; color: #666;">
|
|
1 LLM calls • 7s durée LLM
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div style="text-align: right;">
|
|
<div style="color: #4CAF50; font-weight: bold;">
|
|
✓ RÉUSSI
|
|
</div>
|
|
<div style="font-size: 10px; color: #2196F3; margin-top: 2px;">
|
|
🔍 Cliquer pour détails
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="test-item clickable" onclick="openTestModal(4)">
|
|
<div style="display: flex; align-items: center;">
|
|
<span class="test-status status-passed"></span>
|
|
<div>
|
|
<div><strong>Pipeline Standard → Adversarial</strong></div>
|
|
<div style="font-size: 12px; color: #666;">
|
|
2 LLM calls • 24s durée LLM
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div style="text-align: right;">
|
|
<div style="color: #4CAF50; font-weight: bold;">
|
|
✓ RÉUSSI
|
|
</div>
|
|
<div style="font-size: 10px; color: #2196F3; margin-top: 2px;">
|
|
🔍 Cliquer pour détails
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="llm-section">
|
|
<h3>Appels LLM (7)</h3>
|
|
|
|
<div class="llm-call clickable" onclick="openModal(0)">
|
|
<div>
|
|
<strong>openai</strong> (gpt-4o-mini)
|
|
<div style="font-size: 12px; color: #666; margin-top: 2px;">
|
|
Test: lightEnhancement (rapide)
|
|
</div>
|
|
</div>
|
|
<div style="text-align: right;">
|
|
<div>8967ms</div>
|
|
<div style="font-size: 12px; color: #666;">1835→1531 tokens</div>
|
|
<div style="font-size: 10px; color: #2196F3; margin-top: 2px;">📋 Cliquer pour voir détails</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="llm-call clickable" onclick="openModal(1)">
|
|
<div>
|
|
<strong>openai</strong> (gpt-4o-mini)
|
|
<div style="font-size: 12px; color: #666; margin-top: 2px;">
|
|
Test: standardEnhancement (complet)
|
|
</div>
|
|
</div>
|
|
<div style="text-align: right;">
|
|
<div>6280ms</div>
|
|
<div style="font-size: 12px; color: #666;">1835→1259 tokens</div>
|
|
<div style="font-size: 10px; color: #2196F3; margin-top: 2px;">📋 Cliquer pour voir détails</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="llm-call clickable" onclick="openModal(2)">
|
|
<div>
|
|
<strong>gemini</strong> (gemini-2.5-flash)
|
|
<div style="font-size: 12px; color: #666; margin-top: 2px;">
|
|
Test: standardEnhancement (complet)
|
|
</div>
|
|
</div>
|
|
<div style="text-align: right;">
|
|
<div>33758ms</div>
|
|
<div style="font-size: 12px; color: #666;">2262→47 tokens</div>
|
|
<div style="font-size: 10px; color: #2196F3; margin-top: 2px;">📋 Cliquer pour voir détails</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="llm-call clickable" onclick="openModal(3)">
|
|
<div>
|
|
<strong>openai</strong> (gpt-4o-mini)
|
|
<div style="font-size: 12px; color: #666; margin-top: 2px;">
|
|
Test: fullEnhancement (maximum)
|
|
</div>
|
|
</div>
|
|
<div style="text-align: right;">
|
|
<div>4532ms</div>
|
|
<div style="font-size: 12px; color: #666;">1833→1153 tokens</div>
|
|
<div style="font-size: 10px; color: #2196F3; margin-top: 2px;">📋 Cliquer pour voir détails</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="llm-call clickable" onclick="openModal(4)">
|
|
<div>
|
|
<strong>claude</strong> (claude-sonnet-4-20250514)
|
|
<div style="font-size: 12px; color: #666; margin-top: 2px;">
|
|
Test: Adversarial general
|
|
</div>
|
|
</div>
|
|
<div style="text-align: right;">
|
|
<div>6665ms</div>
|
|
<div style="font-size: 12px; color: #666;">1453→802 tokens</div>
|
|
<div style="font-size: 10px; color: #2196F3; margin-top: 2px;">📋 Cliquer pour voir détails</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="llm-call clickable" onclick="openModal(5)">
|
|
<div>
|
|
<strong>openai</strong> (gpt-4o-mini)
|
|
<div style="font-size: 12px; color: #666; margin-top: 2px;">
|
|
Test: Pipeline Standard → Adversarial
|
|
</div>
|
|
</div>
|
|
<div style="text-align: right;">
|
|
<div>5648ms</div>
|
|
<div style="font-size: 12px; color: #666;">1835→1557 tokens</div>
|
|
<div style="font-size: 10px; color: #2196F3; margin-top: 2px;">📋 Cliquer pour voir détails</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="llm-call clickable" onclick="openModal(6)">
|
|
<div>
|
|
<strong>gemini</strong> (gemini-2.5-flash)
|
|
<div style="font-size: 12px; color: #666; margin-top: 2px;">
|
|
Test: Pipeline Standard → Adversarial
|
|
</div>
|
|
</div>
|
|
<div style="text-align: right;">
|
|
<div>18302ms</div>
|
|
<div style="font-size: 12px; color: #666;">1739→472 tokens</div>
|
|
<div style="font-size: 10px; color: #2196F3; margin-top: 2px;">📋 Cliquer pour voir détails</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- Modal pour afficher les détails LLM -->
|
|
<div id="llmModal" class="modal">
|
|
<div class="modal-content">
|
|
<span class="close" onclick="closeModal()">×</span>
|
|
<h2 id="modalTitle">Détails de l'appel LLM</h2>
|
|
|
|
<div class="prompt-section">
|
|
<h4>🔍 Prompt envoyé</h4>
|
|
<div id="promptContent" class="prompt-content">Aucun prompt capturé</div>
|
|
</div>
|
|
|
|
<div class="response-section">
|
|
<h4>📥 Réponse reçue</h4>
|
|
<div id="responseContent" class="response-content">Aucune réponse capturée</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Modal pour afficher les détails de test -->
|
|
<div id="testModal" class="modal">
|
|
<div class="modal-content">
|
|
<span class="close" onclick="closeTestModal()">×</span>
|
|
<h2 id="testModalTitle">Détails du test</h2>
|
|
|
|
<div class="test-details-section">
|
|
<h4>📊 Statistiques</h4>
|
|
<div id="testStats" class="test-stats">
|
|
<!-- Stats will be populated here -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="test-details-section">
|
|
<h4>🚀 Appels LLM associés</h4>
|
|
<div id="testLLMCalls" class="test-llm-list">
|
|
<!-- LLM calls will be listed here -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
const llmCalls = [{"provider":"openai","model":"gpt-4o-mini","duration":8967,"tokens":{"prompt":1835,"response":1531},"timestamp":"2025-09-17T05:38:57.962Z","testContext":"lightEnhancement (rapide)","prompt":"MISSION: Améliore UNIQUEMENT la précision technique de ces contenus.\n\nCONTEXTE: plaque test intégration rapide - Secteur: impression/signalétique\nPERSONNALITÉ: Marc (technique)\nINTENSITÉ: 0.7 (0.5=léger, 1.0=standard, 1.5=intensif)\n\nÉLÉMENTS À AMÉLIORER TECHNIQUEMENT:\n\n[1] TAG: Titre_H1\nCONTENU: \"Test titre avec contenu générique nécessitant amélioration technique\"\nAMÉLIORATIONS: ajout_données_techniques, intégration_contexte_métier\n\n\n[2] TAG: Introduction\nCONTENU: \"Introduction générique avec vocabulaire basique à améliorer\"\nAMÉLIORATIONS: ajout_données_techniques, intégration_contexte_métier\n\n\n[3] TAG: Contenu_Principal\nCONTENU: \"Contenu principal avec termes génériques optimal et efficace nécessitant précision technique\"\nAMÉLIORATIONS: ajout_termes_techniques, ajout_données_techniques, intégration_contexte_métier\n\n\n[4] TAG: Conclusion\nCONTENU: \"Conclusion basique qui nécessite enhancement professionnel\"\nAMÉLIORATIONS: ajout_données_techniques, intégration_contexte_métier\n\n\nCONSIGNES TECHNIQUES:\n- GARDE exactement le même message et ton technique\n- AJOUTE précision technique naturelle et vocabulaire spécialisé\n- INTÈGRE termes métier : matériaux, procédés, normes, dimensions\n- REMPLACE vocabulaire générique par termes techniques appropriés\n- ÉVITE jargon incompréhensible, reste accessible\n- PRESERVE longueur approximative (±15%)\n\nVOCABULAIRE TECHNIQUE RECOMMANDÉ:\n- Matériaux: dibond, aluminium anodisé, PMMA coulé, PVC expansé\n- Procédés: impression UV, gravure laser, découpe numérique, fraisage CNC \n- Finitions: brossé, poli, texturé, laqué\n- Fixations: perçage, adhésif double face, vis inox, plots de fixation\n\nFORMAT RÉPONSE:\n[1] Contenu avec amélioration technique précise\n[2] Contenu avec amélioration technique précise\netc...\n\nIMPORTANT: Réponse DIRECTE par les contenus améliorés, pas d'explication.","response":"[1] TAG: Titre_H1 \nCONTENU: \"Évaluation technique des plaques de test pour l'intégration rapide en impression et signalétique\"\n\n[2] TAG: Introduction \nCONTENU: \"Cette introduction présente les enjeux techniques liés à l'utilisation de plaques de test pour l'intégration rapide dans le secteur de l'impression et de la signalétique. Les matériaux tels que le dibond et l'aluminium anodisé sont souvent utilisés pour garantir la durabilité et la qualité des impressions.\"\n\n[3] TAG: Contenu_Principal \nCONTENU: \"Le contenu principal se concentre sur les procédés d'impression UV et de gravure laser, qui sont essentiels pour obtenir des résultats optimaux. L'utilisation de matériaux comme le PMMA coulé et le PVC expansé permet de répondre aux normes de qualité exigées dans le secteur. Les dimensions des plaques doivent être adaptées aux spécificités du projet, et les finitions, qu'elles soient brossées ou laquées, jouent un rôle crucial dans l'esthétique finale. Les techniques de fixation, telles que le perçage ou l'utilisation d'adhésifs double face, doivent également être considérées pour assurer une installation efficace.\"\n\n[4] TAG: Conclusion \nCONTENU: \"En conclusion, l'intégration rapide des plaques de test dans le secteur de l'impression et de la signalétique repose sur une compréhension approfondie des matériaux, procédés et normes en vigueur. Pour garantir un résultat professionnel, il est essentiel de choisir les bonnes dimensions et finitions, ainsi que d'appliquer des méthodes de fixation appropriées.\""},{"provider":"openai","model":"gpt-4o-mini","duration":6280,"tokens":{"prompt":1835,"response":1259},"timestamp":"2025-09-17T05:39:04.256Z","testContext":"standardEnhancement (complet)","prompt":"MISSION: Améliore UNIQUEMENT la précision technique de ces contenus.\n\nCONTEXTE: plaque test intégration rapide - Secteur: impression/signalétique\nPERSONNALITÉ: Marc (technique)\nINTENSITÉ: 0.9 (0.5=léger, 1.0=standard, 1.5=intensif)\n\nÉLÉMENTS À AMÉLIORER TECHNIQUEMENT:\n\n[1] TAG: Titre_H1\nCONTENU: \"Test titre avec contenu générique nécessitant amélioration technique\"\nAMÉLIORATIONS: ajout_données_techniques, intégration_contexte_métier\n\n\n[2] TAG: Introduction\nCONTENU: \"Introduction générique avec vocabulaire basique à améliorer\"\nAMÉLIORATIONS: ajout_données_techniques, intégration_contexte_métier\n\n\n[3] TAG: Contenu_Principal\nCONTENU: \"Contenu principal avec termes génériques optimal et efficace nécessitant précision technique\"\nAMÉLIORATIONS: ajout_termes_techniques, ajout_données_techniques, intégration_contexte_métier\n\n\n[4] TAG: Conclusion\nCONTENU: \"Conclusion basique qui nécessite enhancement professionnel\"\nAMÉLIORATIONS: ajout_données_techniques, intégration_contexte_métier\n\n\nCONSIGNES TECHNIQUES:\n- GARDE exactement le même message et ton technique\n- AJOUTE précision technique naturelle et vocabulaire spécialisé\n- INTÈGRE termes métier : matériaux, procédés, normes, dimensions\n- REMPLACE vocabulaire générique par termes techniques appropriés\n- ÉVITE jargon incompréhensible, reste accessible\n- PRESERVE longueur approximative (±15%)\n\nVOCABULAIRE TECHNIQUE RECOMMANDÉ:\n- Matériaux: dibond, aluminium anodisé, PMMA coulé, PVC expansé\n- Procédés: impression UV, gravure laser, découpe numérique, fraisage CNC \n- Finitions: brossé, poli, texturé, laqué\n- Fixations: perçage, adhésif double face, vis inox, plots de fixation\n\nFORMAT RÉPONSE:\n[1] Contenu avec amélioration technique précise\n[2] Contenu avec amélioration technique précise\netc...\n\nIMPORTANT: Réponse DIRECTE par les contenus améliorés, pas d'explication.","response":"[1] TAG: Titre_H1 \nCONTENU: \"Test de plaque pour intégration rapide en impression et signalétique : optimisation technique requise\"\n\n[2] TAG: Introduction \nCONTENU: \"Cette introduction présente les enjeux techniques liés à l'utilisation de plaques pour l'intégration rapide dans le secteur de l'impression et de la signalétique, en mettant l'accent sur les matériaux et procédés adaptés.\"\n\n[3] TAG: Contenu_Principal \nCONTENU: \"Le contenu principal aborde les spécificités techniques des plaques utilisées pour l'impression et la signalétique, en se concentrant sur des matériaux tels que le dibond et le PVC expansé. Les procédés d'impression UV et de découpe numérique sont essentiels pour garantir une qualité optimale. Les dimensions standardisées et les finitions comme le brossé ou le poli influencent également la performance et l'esthétique des produits finaux.\"\n\n[4] TAG: Conclusion \nCONTENU: \"En conclusion, l'intégration rapide de plaques dans le domaine de l'impression et de la signalétique nécessite une compréhension approfondie des matériaux, procédés et normes en vigueur. L'utilisation de fixations appropriées, telles que les vis inox ou l'adhésif double face, est cruciale pour assurer la durabilité et l'efficacité des installations.\""},{"provider":"gemini","model":"gemini-2.5-flash","duration":33758,"tokens":{"prompt":2262,"response":47},"timestamp":"2025-09-17T05:39:38.030Z","testContext":"standardEnhancement (complet)","prompt":"MISSION: Améliore UNIQUEMENT les transitions et fluidité de ces contenus.\n\nCONTEXTE: Article SEO plaque test intégration rapide\nPERSONNALITÉ: Marc (technique web professionnel)\n\nINTENSITÉ: 0.8 (0.5=léger, 1.0=standard, 1.5=intensif)\n\nCONTENUS À FLUIDIFIER:\n\n[1] TAG: Contenu_Principal\nPROBLÈMES: abruptTransitions, formalityImbalance\nCONTENU: \"TAG: Contenu_Principal CONTENU: \"Le contenu principal aborde les spécificités techniques des plaques utilisées pour l'impression et la signalétique, en se concentrant sur des matériaux tels que le dibond et le PVC expansé. Les procédés d'impression UV et de découpe numérique sont essentiels pour garantir une qualité optimale. Les dimensions standardisées et les finitions comme le brossé ou le poli influencent également la performance et l'esthétique des produits finaux.\"\"\n\n[2] TAG: Conclusion\nPROBLÈMES: abruptTransitions, uniformSentences\nCONTENU: \"TAG: Conclusion CONTENU: \"En conclusion, l'intégration rapide de plaques dans le domaine de l'impression et de la signalétique nécessite une compréhension approfondie des matériaux, procédés et normes en vigueur. L'utilisation de fixations appropriées, telles que les vis inox ou l'adhésif double face, est cruciale pour assurer la durabilité et l'efficacité des installations.\"\"\n\nOBJECTIFS FLUIDITÉ:\n- Connecteurs plus naturels et variés\n- Transitions fluides entre idées et paragraphes\n- Variation naturelle longueurs phrases\n- ÉVITE répétitions excessives (\"du coup\", \"par ailleurs\", \"en effet\")\n- Style technique mais naturel web\n\nCONSIGNES STRICTES:\n- NE CHANGE PAS le fond du message ni les informations\n- GARDE même structure générale et longueur approximative (±20%)\n- Améliore SEULEMENT la fluidité et les enchaînements\n- RESPECTE le style Marc (technique)\n- ÉVITE sur-correction qui rendrait artificiel\n\nTECHNIQUES FLUIDITÉ:\n- Varier connecteurs logiques sans répétition\n- Alterner phrases courtes (8-12 mots) et moyennes (15-20 mots) \n- Utiliser pronoms et reprises pour cohésion\n- Ajouter transitions implicites par reformulation\n- Équilibrer registre soutenu/accessible\n\nFORMAT RÉPONSE:\n[1] Contenu avec transitions améliorées\n[2] Contenu avec transitions améliorées\netc...\n\nIMPORTANT: Réponse DIRECTE par les contenus fluidifiés, pas d'explication.","response":"[Gemini: pas de texte généré - problème modèle]"},{"provider":"openai","model":"gpt-4o-mini","duration":4532,"tokens":{"prompt":1833,"response":1153},"timestamp":"2025-09-17T05:39:42.575Z","testContext":"fullEnhancement (maximum)","prompt":"MISSION: Améliore UNIQUEMENT la précision technique de ces contenus.\n\nCONTEXTE: plaque test intégration rapide - Secteur: impression/signalétique\nPERSONNALITÉ: Marc (technique)\nINTENSITÉ: 1 (0.5=léger, 1.0=standard, 1.5=intensif)\n\nÉLÉMENTS À AMÉLIORER TECHNIQUEMENT:\n\n[1] TAG: Titre_H1\nCONTENU: \"Test titre avec contenu générique nécessitant amélioration technique\"\nAMÉLIORATIONS: ajout_données_techniques, intégration_contexte_métier\n\n\n[2] TAG: Introduction\nCONTENU: \"Introduction générique avec vocabulaire basique à améliorer\"\nAMÉLIORATIONS: ajout_données_techniques, intégration_contexte_métier\n\n\n[3] TAG: Contenu_Principal\nCONTENU: \"Contenu principal avec termes génériques optimal et efficace nécessitant précision technique\"\nAMÉLIORATIONS: ajout_termes_techniques, ajout_données_techniques, intégration_contexte_métier\n\n\n[4] TAG: Conclusion\nCONTENU: \"Conclusion basique qui nécessite enhancement professionnel\"\nAMÉLIORATIONS: ajout_données_techniques, intégration_contexte_métier\n\n\nCONSIGNES TECHNIQUES:\n- GARDE exactement le même message et ton technique\n- AJOUTE précision technique naturelle et vocabulaire spécialisé\n- INTÈGRE termes métier : matériaux, procédés, normes, dimensions\n- REMPLACE vocabulaire générique par termes techniques appropriés\n- ÉVITE jargon incompréhensible, reste accessible\n- PRESERVE longueur approximative (±15%)\n\nVOCABULAIRE TECHNIQUE RECOMMANDÉ:\n- Matériaux: dibond, aluminium anodisé, PMMA coulé, PVC expansé\n- Procédés: impression UV, gravure laser, découpe numérique, fraisage CNC \n- Finitions: brossé, poli, texturé, laqué\n- Fixations: perçage, adhésif double face, vis inox, plots de fixation\n\nFORMAT RÉPONSE:\n[1] Contenu avec amélioration technique précise\n[2] Contenu avec amélioration technique précise\netc...\n\nIMPORTANT: Réponse DIRECTE par les contenus améliorés, pas d'explication.","response":"[1] \"Test titre avec contenu générique nécessitant amélioration technique : Évaluation des plaques test pour l'intégration rapide en impression et signalétique\"\n\n[2] \"Introduction sur l'importance des plaques test pour l'intégration rapide dans le secteur de l'impression et de la signalétique, mettant en avant les matériaux tels que le dibond et l'aluminium anodisé, ainsi que les procédés d'impression UV et de découpe numérique.\"\n\n[3] \"Contenu principal sur les plaques test, abordant les spécifications techniques essentielles, y compris les dimensions standards, les finitions comme le poli et le texturé, ainsi que les normes de qualité requises pour garantir une efficacité optimale dans les applications de signalétique. L'importance des méthodes de fixation, telles que le perçage et l'utilisation d'adhésifs double face, est également discutée.\"\n\n[4] \"Conclusion sur l'impact des plaques test sur l'efficacité des processus d'impression et de signalétique, soulignant l'importance de choisir des matériaux appropriés et des procédés de fabrication conformes aux normes de l'industrie pour assurer une durabilité et une performance maximales.\""},{"provider":"claude","model":"claude-sonnet-4-20250514","duration":6665,"tokens":{"prompt":1453,"response":802},"timestamp":"2025-09-17T05:39:49.284Z","testContext":"Adversarial general","prompt":"MISSION: Réécris ces contenus pour éviter détection par general.\n\nTECHNIQUE ANTI-GENERAL:\nÉvite ces mots typiques IA : \"optimal\", \"comprehensive\", \"seamless\", \"robust\", \"leverage\"\nVarie longueurs phrases : mélange phrases courtes (5-10 mots) ET longues (20-30 mots)\nUtilise expressions françaises familières et tournures idiomatiques\nAjoute imperfections naturelles : répétitions légères, hésitations, reformulations\nChange angle ou perspective 1-2 fois dans le texte\nPréfère synonymes moins évidents : \"bon\" plutôt qu'excellent\", \"solide\" plutôt qu'optimisé\"\nIntègre connecteurs variés et naturels selon le contexte\nSimule variation naturelle d'humeur et d'énergie rédactionnelle\n\nCONTENUS À RÉÉCRIRE:\n\n[1] TAG: Titre_H1\nORIGINAL: \"Test titre avec contenu générique nécessitant amélioration technique\"\n\n[2] TAG: Introduction\nORIGINAL: \"Introduction générique avec vocabulaire basique à améliorer\"\n\n[3] TAG: Contenu_Principal\nORIGINAL: \"Contenu principal avec termes génériques optimal et efficace nécessitant précision technique\"\n\n[4] TAG: Conclusion\nORIGINAL: \"Conclusion basique qui nécessite enhancement professionnel\"\n\nCONSIGNES:\n- GARDE exactement le même message et informations factuelles\n- CHANGE structure, vocabulaire, style pour éviter détection general\n- Intensité adversariale: 0.80\n\n\nIMPORTANT: Réponse DIRECTE par les contenus réécrits, pas d'explication.\n\nFORMAT:\n[1] Contenu réécrit anti-general\n[2] Contenu réécrit anti-general\netc...","response":"[1] Test de titre - contenu standard qui mérite d'être retravaillé sur le plan technique\n\n[2] Cette introduction reste assez classique dans son approche. Le vocabulaire utilisé mériterait quelques ajustements, histoire de... comment dire... donner un peu plus de relief à l'ensemble.\n\n[3] Le contenu principal aborde des aspects intéressants, mais bon, les termes employés sonnent parfois un peu convenus. On pourrait creuser davantage les aspects techniques, apporter plus de précision dans certains passages. Après tout, c'est en affinant ces détails qu'on obtient quelque chose de vraiment solide.\n\n[4] Pour conclure, disons que cette partie finale reste dans les sentiers battus. Elle gagnerait à être étoffée, retravaillée avec un regard plus professionnel - enfin, vous voyez ce que je veux dire."},{"provider":"openai","model":"gpt-4o-mini","duration":5648,"tokens":{"prompt":1835,"response":1557},"timestamp":"2025-09-17T05:39:54.949Z","testContext":"Pipeline Standard → Adversarial","prompt":"MISSION: Améliore UNIQUEMENT la précision technique de ces contenus.\n\nCONTEXTE: plaque test intégration rapide - Secteur: impression/signalétique\nPERSONNALITÉ: Marc (technique)\nINTENSITÉ: 0.9 (0.5=léger, 1.0=standard, 1.5=intensif)\n\nÉLÉMENTS À AMÉLIORER TECHNIQUEMENT:\n\n[1] TAG: Titre_H1\nCONTENU: \"Test titre avec contenu générique nécessitant amélioration technique\"\nAMÉLIORATIONS: ajout_données_techniques, intégration_contexte_métier\n\n\n[2] TAG: Introduction\nCONTENU: \"Introduction générique avec vocabulaire basique à améliorer\"\nAMÉLIORATIONS: ajout_données_techniques, intégration_contexte_métier\n\n\n[3] TAG: Contenu_Principal\nCONTENU: \"Contenu principal avec termes génériques optimal et efficace nécessitant précision technique\"\nAMÉLIORATIONS: ajout_termes_techniques, ajout_données_techniques, intégration_contexte_métier\n\n\n[4] TAG: Conclusion\nCONTENU: \"Conclusion basique qui nécessite enhancement professionnel\"\nAMÉLIORATIONS: ajout_données_techniques, intégration_contexte_métier\n\n\nCONSIGNES TECHNIQUES:\n- GARDE exactement le même message et ton technique\n- AJOUTE précision technique naturelle et vocabulaire spécialisé\n- INTÈGRE termes métier : matériaux, procédés, normes, dimensions\n- REMPLACE vocabulaire générique par termes techniques appropriés\n- ÉVITE jargon incompréhensible, reste accessible\n- PRESERVE longueur approximative (±15%)\n\nVOCABULAIRE TECHNIQUE RECOMMANDÉ:\n- Matériaux: dibond, aluminium anodisé, PMMA coulé, PVC expansé\n- Procédés: impression UV, gravure laser, découpe numérique, fraisage CNC \n- Finitions: brossé, poli, texturé, laqué\n- Fixations: perçage, adhésif double face, vis inox, plots de fixation\n\nFORMAT RÉPONSE:\n[1] Contenu avec amélioration technique précise\n[2] Contenu avec amélioration technique précise\netc...\n\nIMPORTANT: Réponse DIRECTE par les contenus améliorés, pas d'explication.","response":"[1] TAG: Titre_H1 \nCONTENU: \"Optimisation des plaques de test pour l'impression et la signalétique : amélioration technique nécessaire\"\n\n[2] TAG: Introduction \nCONTENU: \"Cette introduction aborde les enjeux techniques liés à l'utilisation de plaques de test dans le secteur de l'impression et de la signalétique, en mettant l'accent sur les matériaux appropriés tels que le dibond et l'aluminium anodisé, ainsi que sur les procédés d'impression UV et de découpe numérique.\"\n\n[3] TAG: Contenu_Principal \nCONTENU: \"Le contenu principal se concentre sur l'importance de la précision technique dans le choix des matériaux et des procédés pour les plaques de test. Il est essentiel d'utiliser des matériaux comme le PMMA coulé pour sa clarté optique ou le PVC expansé pour sa légèreté. Les procédés tels que la gravure laser et le fraisage CNC permettent d'obtenir des finitions de haute qualité, comme le poli ou le texturé, garantissant ainsi une durabilité et une esthétisme optimaux. Il est également crucial de respecter les normes de dimensions spécifiques pour assurer une intégration parfaite dans les systèmes d'affichage.\"\n\n[4] TAG: Conclusion \nCONTENU: \"En conclusion, l'amélioration technique des plaques de test dans le secteur de l'impression et de la signalétique repose sur le choix judicieux des matériaux, des procédés et des finitions. En intégrant des solutions telles que le perçage pour les fixations ou l'utilisation d'adhésifs double face, les professionnels peuvent garantir des résultats optimaux conformes aux exigences du marché.\""},{"provider":"gemini","model":"gemini-2.5-flash","duration":18302,"tokens":{"prompt":1739,"response":472},"timestamp":"2025-09-17T05:40:13.253Z","testContext":"Pipeline Standard → Adversarial","prompt":"MISSION: Améliore UNIQUEMENT les transitions et fluidité de ces contenus.\n\nCONTEXTE: Article SEO plaque test intégration rapide\nPERSONNALITÉ: Marc (technique web professionnel)\n\nINTENSITÉ: 0.8 (0.5=léger, 1.0=standard, 1.5=intensif)\n\nCONTENUS À FLUIDIFIER:\n\n[1] TAG: Conclusion\nPROBLÈMES: abruptTransitions, uniformSentences\nCONTENU: \"TAG: Conclusion CONTENU: \"En conclusion, l'amélioration technique des plaques de test dans le secteur de l'impression et de la signalétique repose sur le choix judicieux des matériaux, des procédés et des finitions. En intégrant des solutions telles que le perçage pour les fixations ou l'utilisation d'adhésifs double face, les professionnels peuvent garantir des résultats optimaux conformes aux exigences du marché.\"\"\n\nOBJECTIFS FLUIDITÉ:\n- Connecteurs plus naturels et variés\n- Transitions fluides entre idées et paragraphes\n- Variation naturelle longueurs phrases\n- ÉVITE répétitions excessives (\"du coup\", \"par ailleurs\", \"en effet\")\n- Style technique mais naturel web\n\nCONSIGNES STRICTES:\n- NE CHANGE PAS le fond du message ni les informations\n- GARDE même structure générale et longueur approximative (±20%)\n- Améliore SEULEMENT la fluidité et les enchaînements\n- RESPECTE le style Marc (technique)\n- ÉVITE sur-correction qui rendrait artificiel\n\nTECHNIQUES FLUIDITÉ:\n- Varier connecteurs logiques sans répétition\n- Alterner phrases courtes (8-12 mots) et moyennes (15-20 mots) \n- Utiliser pronoms et reprises pour cohésion\n- Ajouter transitions implicites par reformulation\n- Équilibrer registre soutenu/accessible\n\nFORMAT RÉPONSE:\n[1] Contenu avec transitions améliorées\n[2] Contenu avec transitions améliorées\netc...\n\nIMPORTANT: Réponse DIRECTE par les contenus fluidifiés, pas d'explication.","response":"[1] En définitive, l'optimisation technique des plaques de test, cruciale pour l'impression et la signalétique, s'articule autour d'une sélection rigoureuse des matériaux, des procédés et des finitions. C'est en intégrant des solutions concrètes, telles que le perçage spécifique pour les fixations ou l'emploi d'adhésifs double face haute performance, que les professionnels peuvent garantir des résultats optimaux, pleinement conformes aux exigences actuelles du marché."}];
|
|
const testResults = [{"name":"lightEnhancement (rapide)","status":"passed","duration":0,"timestamp":1758087537962,"llmCallsCount":1},{"name":"standardEnhancement (complet)","status":"passed","duration":0,"timestamp":1758087544257,"llmCallsCount":2},{"name":"fullEnhancement (maximum)","status":"passed","duration":0,"timestamp":1758087582575,"llmCallsCount":1},{"name":"Adversarial general","status":"passed","duration":0,"timestamp":1758087589284,"llmCallsCount":1},{"name":"Pipeline Standard → Adversarial","status":"passed","duration":0,"timestamp":1758087594949,"llmCallsCount":2}];
|
|
|
|
function openModal(index) {
|
|
const call = llmCalls[index];
|
|
if (!call) return;
|
|
|
|
const modal = document.getElementById('llmModal');
|
|
const title = document.getElementById('modalTitle');
|
|
const promptContent = document.getElementById('promptContent');
|
|
const responseContent = document.getElementById('responseContent');
|
|
|
|
title.textContent = `${call.provider.toUpperCase()} (${call.model}) - ${call.testContext}`;
|
|
|
|
promptContent.textContent = call.prompt || 'Aucun prompt capturé';
|
|
responseContent.textContent = call.response || 'Aucune réponse capturée';
|
|
|
|
modal.style.display = 'block';
|
|
}
|
|
|
|
function closeModal() {
|
|
document.getElementById('llmModal').style.display = 'none';
|
|
}
|
|
|
|
function openTestModal(index) {
|
|
const test = testResults[index];
|
|
if (!test) return;
|
|
|
|
const modal = document.getElementById('testModal');
|
|
const title = document.getElementById('testModalTitle');
|
|
const statsDiv = document.getElementById('testStats');
|
|
const llmCallsDiv = document.getElementById('testLLMCalls');
|
|
|
|
title.textContent = `Test: ${test.name}`;
|
|
|
|
// Get LLM calls for this test
|
|
const testLLMCalls = llmCalls.filter(call => call.testContext === test.name);
|
|
const totalDuration = testLLMCalls.reduce((sum, call) => sum + call.duration, 0);
|
|
const totalTokensIn = testLLMCalls.reduce((sum, call) => sum + (call.tokens?.prompt || 0), 0);
|
|
const totalTokensOut = testLLMCalls.reduce((sum, call) => sum + (call.tokens?.response || 0), 0);
|
|
|
|
// Populate stats
|
|
statsDiv.innerHTML = `
|
|
<div class="test-stat">
|
|
<div class="test-stat-value">${test.status === 'passed' ? '✓' : '✗'}</div>
|
|
<div>Statut</div>
|
|
</div>
|
|
<div class="test-stat">
|
|
<div class="test-stat-value">${testLLMCalls.length}</div>
|
|
<div>LLM Calls</div>
|
|
</div>
|
|
<div class="test-stat">
|
|
<div class="test-stat-value">${Math.round(totalDuration/1000)}s</div>
|
|
<div>Durée LLM</div>
|
|
</div>
|
|
<div class="test-stat">
|
|
<div class="test-stat-value">${totalTokensIn}</div>
|
|
<div>Tokens Input</div>
|
|
</div>
|
|
<div class="test-stat">
|
|
<div class="test-stat-value">${totalTokensOut}</div>
|
|
<div>Tokens Output</div>
|
|
</div>
|
|
`;
|
|
|
|
// Populate LLM calls
|
|
if (testLLMCalls.length > 0) {
|
|
llmCallsDiv.innerHTML = testLLMCalls.map((call, callIndex) => {
|
|
const globalIndex = llmCalls.findIndex(c => c === call);
|
|
return `
|
|
<div class="test-llm-item" onclick="openModal(${globalIndex})">
|
|
<div>
|
|
<strong>${call.provider.toUpperCase()}</strong> (${call.model})
|
|
<div style="font-size: 11px; color: #666; margin-top: 2px;">
|
|
${new Date(call.timestamp).toLocaleTimeString()}
|
|
</div>
|
|
</div>
|
|
<div style="text-align: right;">
|
|
<div>${call.duration}ms</div>
|
|
<div style="font-size: 11px; color: #666;">
|
|
${call.tokens?.prompt || 0}→${call.tokens?.response || 0} tokens
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
}).join('');
|
|
} else {
|
|
llmCallsDiv.innerHTML = '<div style="color: #666; text-align: center; padding: 20px;">Aucun appel LLM pour ce test</div>';
|
|
}
|
|
|
|
modal.style.display = 'block';
|
|
}
|
|
|
|
function closeTestModal() {
|
|
document.getElementById('testModal').style.display = 'none';
|
|
}
|
|
|
|
// Fermer modal en cliquant à l'extérieur
|
|
window.onclick = function(event) {
|
|
const llmModal = document.getElementById('llmModal');
|
|
const testModal = document.getElementById('testModal');
|
|
if (event.target === llmModal) {
|
|
closeModal();
|
|
}
|
|
if (event.target === testModal) {
|
|
closeTestModal();
|
|
}
|
|
}
|
|
|
|
// Fermer modal avec Escape
|
|
document.addEventListener('keydown', function(event) {
|
|
if (event.key === 'Escape') {
|
|
closeModal();
|
|
closeTestModal();
|
|
}
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |