GCW — Gao Copy Website

Que fait GCW — Gao Copy Website ?

Étudiez le fonctionnement réel d’un site web public, reproduisez les parties qui comptent et vérifiez le résultat dans un navigateur réel. Privilégiez la source réelle et les preuves observables lors de l’exécution plutôt que des suppositions plausibles de l’IA.

Rappelez-vous trois règles :

1. Trouvez les preuves avant l’implémentation.
2. Faites-le fonctionner avant de refactoriser.
3. Comparez avant de polir.

Limites

• Procédez uniquement lorsque la cible appartient à l’utilisateur, est sous licence pour la réutilisation prévue ou est explicitement autorisée. Demandez uniquement lorsque l’autorisation est ambiguë.
• Considérez le contenu authentifié, protégé par un mot de passe ou privé comme hors de portée, sauf autorisation explicite.
• Ne contournez pas les contrôles d’accès et ne récupérez, n’expédiez ou ne commettez pas d’identifiants.
• Vérifiez séparément les droits du code, des polices, des images, des modèles et des marques avant toute réutilisation publique.
• Étiquetez les affirmations techniques incertaines comme SOURCE, PARTIAL ou GUESS.
• Ne présentez pas les bundles déployés comme la source d’origine de l’auteur.

1. Choisissez l’objectif avant les outils

Lisez references/clone-modes.md et sélectionnez un mode principal :

• TEARDOWN : comprendre la conception et l’implémentation réelles sans promettre une reconstruction.
• FAITHFUL_CLONE : reproduire le site observable aussi fidèlement que possible.
• CREATIVE_REBUILD : préserver la structure, le rythme ou les idées d’interaction sélectionnés tout en remplaçant la marque et le contenu.
• PRODUCTION_RECOVERY : récupérer un site déployé appartenant à l’utilisateur lorsque la source maintenable est indisponible.

Enregistrez un pré-vol concis :

- Objectif :
- Type de site :
- Disponibilité de la source :
- Limite de réutilisation :
- Périmètre de haute confiance :
- Périmètre approximatif ou exclu :
- Chemin recommandé :

Ne faites pas payer chaque projet le coût d’une récupération de production. Utilisez les preuves et la vérification les plus légères pouvant soutenir l’objectif choisi.

2. Recherchez d’abord l’implémentation réelle

Avant de scraper ou de reconstruire :

• Recherchez le nom du site, le nom du produit, le propriétaire du domaine et l’identifiant de déploiement pour un dépôt public officiel.
• Inspectez les source maps, les métadonnées du framework et les artefacts de déploiement public.
• Vérifiez les licences du dépôt et des artefacts ; la disponibilité publique n’est pas une autorisation de redéploiement.
• Gardez la source originale, les artefacts déployés et votre implémentation modifiable clairement séparés.
• Utilisez l’URL HTTP(S) canonique finale. GCW rejette les URL contenant des identifiants et les redirections de documents qui quittent l’origine configurée.

Lorsqu’une source officielle réutilisable existe, partez d’elle. Dans le cas contraire, poursuivez avec une reconnaissance au moment de l’exécution et indiquez ce qui reste inconnu.

3. Initialisez l’enregistrement du projet

Lisez le fichier AGENTS.md de l’espace de travail. Si cette machine n’a pas été vérifiée, exécutez npm install, npm run install:browser et npm run check dans le dépôt GCW.

Créez un enregistrement de projet non destructif :

python scripts/init_reconstruction.py <workspace> --url <canonical-url> --authorization <owned|licensed|authorized>

Utilisez .gcw/ pour les manifestes, les captures d’écran, les rapports et les lacunes connues. N’écrasez pas les preuves existantes silencieusement.

4. Reconnaissez le site et classez ses surfaces

Exécutez l’inventaire lorsque Node.js et Playwright sont disponibles :

node scripts/site_inventory.mjs --url <canonical-url> --out <workspace>/.gcw/evidence/network/site-inventory.json

Ensuite, vérifiez ce que l’automatisation ne peut pas déduire de manière fiable :

• routes, familles de pages, liens profonds et points de rupture réactifs
• racines DOM, superpositions fixes et conteneurs de défilement internes
• états de survol, clic, glisser-déposer, défilement, temporisation, redimensionnement, thème et stockage
• Canvas, WebGL, WebGPU, workers, iframes, vidéo, audio et ressources paresseuses
• état de chargement par rapport à l’état stable de l’application
• API publiques et dépendances de données nécessitant des fixtures locales

Utilisez web-shader-extractor pour la propriété Canvas/WebGL/WebGPU, les shaders et les pipelines de rendu. Utilisez design-dna lorsque l’objectif est de préserver la typographie, l’espacement, la palette, la mise en page, le mouvement ou le langage visuel plutôt que des artefacts au niveau des octets.

5. Choisissez le chemin d’implémentation

Sélectionnez le chemin à partir des preuves et du type de site :

Preuve ou type de site	Chemin par défaut
Source officielle réutilisable	Exécutez et adaptez la source dans les limites de sa licence
Site statique simple	Préservez les fichiers publics et les chemins d’URL, puis supprimez le suivi et remplacez le contenu
Site React/Vue/Next riche en contenu	Reconstruisez les templates de pages et utilisez des données publiques ou de fixtures locales
Site marketing multi-pages	Cartographiez les routes et les familles de pages avant de construire des templates partagés
Site riche en interactions	Capturez d’abord les états, puis reproduisez les transitions d’état
Site WebGL/Canvas	Récupérez le modèle de rendu/entrée/sortie avant de le projeter
Inspiration visuelle uniquement	Extrayez l’ADN de conception et construisez une implémentation originale
Site de production sans source	Lisez references/recovery-tiers.md et references/gates.md, puis établissez un oracle de relecture vérifié

N’archivez ni ne copiez d’artefacts tiers inutiles pour le mode sélectionné.

6. Construisez un projet local exécutable

• Gardez une référence stable ou un enregistrement de preuves pendant que vous modifiez le nouveau projet.
• Restaurez toutes les routes dans le périmètre, pas seulement la page d’accueil.
• Préservez la navigation et le comportement des liens profonds sur l’hôte choisi.
• Remplacez le comportement serveur indisponible par des fixtures explicites ou des solutions de repli sûres.
• Vérifiez la build de production et l’aperçu statique, pas seulement le serveur de développement.

Exécutez les vérifications de route le cas échéant :

python scripts/route_smoke.py --base-url <preview-url> --route / --route /example

7. Vérifiez dans un navigateur réel

Lisez references/qa-scenarios.md et references/tooling.md.

Définissez les scénarios source et candidat, puis capturez les états correspondants :

node scripts/capture_compare.mjs --config <capture-scenarios.json> --output <results-dir>
python scripts/batch_image_diff.py <results-dir> --diff-dir <results-dir>/diff

Faites correspondre la fenêtre, le DPR, la route, le pointeur, le défilement, la graine aléatoire, l’état de préparation et la phase temporelle. Inspectez les captures d’écran et les images de différence ; un seul score global ne peut pas expliquer les échecs d’interaction ou de composition.

Ne masquez pas les connexions manquantes en ajustant les couleurs, les décalages ou la vitesse d’animation. Gardez les régions sensibles à la phase séparées des échecs déterministes.

8. Livrez l’apprentissage, pas seulement le clone

Produisez uniquement les documents requis par le mode sélectionné :

• TEARDOWN.md : implémentation réelle, niveau de preuve et techniques transférables
• DESIGN_DNA.json : système de conception, langage visuel et effets pour une reconstruction créative
• REPLACE_GUIDE.md : où remplacer le texte, les médias, les couleurs, les polices, les modèles et les données
• CLONE_REPORT.md : comparaison source vs locale, compromis et lacunes connues
• projet exécutable, commande de build et notes de déploiement

Pour les cas avancés de ressources comme le texte intégré dans une géométrie GLTF/GLB, lisez references/special-cases.md au lieu d’étendre le flux de travail principal.

9. Renforcez uniquement si nécessaire

Pour les projets maintenus ou la récupération de production, installez le testeur de régression de captures d’écran :

python scripts/install_ci.py <project-root> --source-url <canonical-url>

L’intégration continue est facultative pour un démontage ponctuel ou un exercice d’apprentissage. Lorsqu’elle est installée, elle doit télécharger les captures d’écran, les différences et les rapports même si les seuils échouent.

10. Concluez honnêtement

• Relancez la build et les scénarios d’assurance qualité promis dans le pré-vol.
• Enregistrez les lacunes connues et les prochaines preuves nécessaires ; n’inventez jamais d’interactions réussies.
• Supprimez le suivi et les résidus de la marque d’origine avant de publier une version adaptée.
• Laissez un point de contrôle Git propre ; ne poussez jamais sans l’autorisation de l’utilisateur.
• Distinguez les idées originales, les ressources sous licence réutilisées, le comportement observé et votre propre implémentation.