📖 Article original : GitHub Gist
Par Mohamed Amine Ben Mallessa — Lead Dev Sollea AI
Le défi
Nous devions générer des affiches personnalisées au format PDF vectoriel et PNG haute résolution, à la volée, côté serveur. Pas de client lourd, pas de navigateur, pas de SaaS externe.
La solution ? Playwright (Chromium headless) + un template HTML versionné.
Comment ça marche
Formulaire → Template HTML + postMessage → Playwright headless → PDF A4 vectoriel + PNG 300 dpi
Le template : un fichier HTML autonome avec son CSS inline et son SVG. Pas de dépendance externe, pas de polices à charger, pas de requêtes réseau.
Le rendu : Playwright ouvre le template, injecte les données via JavaScript, exporte en PDF (1 page, vectoriel, A4) et en PNG (300 dpi, 2480×3508px).
Le temps : ~3,5 secondes par document. Reproductible à l'identique.
Pourquoi c'est mieux que wkhtmltopdf ou Puppeteer
| Solution | Fiabilité | Vectoriel | Taille | Facilité |
|---|---|---|---|---|
| wkhtmltopdf | ⚠️ CSS capricieux | ✅ | ❌ Obsolète | |
| Puppeteer | ✅ | ✅ | ✅ | ⚠️ Lourd |
| Playwright | ✅✅ | ✅✅ | ✅✅ | ✅✅ |
Playwright gère nativement les polices, le viewport, le mode headless, et s'intègre parfaitement avec FastAPI via un simple subprocess.
L'astuce
Un seul template HTML = aperçu live dans le navigateur + rendu final PDF/PNG. Pas de code en double, pas de divergence preview/production.
postMessage({ type: "setState", state: formData }) → le template se met à jour. Que ce soit dans l'iframe du frontend ou dans Chromium headless.
Ce qu'on a gagné
- 0 abonnement (ni Canva, ni Adobe)
- 3,5s de temps de génération
- PDF vectoriel parfait (pas de pixelisation)
- PNG prêt à imprimer
- Templates versionnés dans Git
- Ajout d'un nouveau format = 1 dossier
Le client économise des milliers d'euros par an et gagne en autonomie.
Article initialement publié sur GitHub Gist.
Mohamed Amine Ben Mallessa — Lead Dev chez Sollea AI
🔗 Sollea AI · GitHub · LinkedIn
playwright #fastapi #pdfgeneration #htmltemplates #opensource #python #webdev
💻 Vous avez un projet similaire ?
Sollea AI — Développement full-stack, automatisation IA, solutions sur mesure.
🔗 Sollea AI · GitHub · LinkedIn
Équipe dirigée par **Mohamed Amine Ben Mallessa* — Lead Dev Sollea AI*
Top comments (0)