π Original article: GitHub Gist
By Mohamed Amine Ben Mallessa β Lead Dev at Sollea AI
The technical context
The application generates customized posters from a web form. Tech stack: Next.js 15 (frontend by Nassim Tarkhani) + FastAPI (backend by Nassim Tarkhani). Document rendering was the weak link β that's where I stepped in.
The trap of "free" solutions
Photopea looked ideal initially. In production, it became a maintenance sink:
Issue #1: CORS restrictions
PSD files needed Access-Control-Allow-Origin: * β impossible on the client's infrastructure.
Issue #2: Ghost exports
Network latency could silently truncate exports.
Issue #3: No server-side rendering
Everything went through the client's browser. No automated generation possible.
My solution in 3 decisions
Decision 1: HTML template = poster
Open, versioned HTML files instead of closed PSD. Full control of layout and rendering.
Decision 2: Playwright for server-side render
Headless Chromium via Playwright produces vector PDF + high-res PNG. ~3.5 seconds per poster.
Decision 3: Single source of truth
Same HTML template for live preview AND final render. Zero preview/production divergence.
The numbers
| Metric | Before (Photopea) | After (HTML Engine) |
|---|---|---|
| External dependencies | 2 (Canva, Photopea) | 1 (Playwright) |
| License cost | $$$$ (Canva Enterprise) | $0 |
| Render time | 30-60s | ~3.5s |
| Server-side render | Impossible | PDF + PNG |
Mohamed Amine Ben Mallessa β Lead Dev at Sollea AI
π GitHub | LinkedIn
Thanks to **Nassim Tarkhani* for the frontend and FastAPI backend development.*
playwright #html #pdfgeneration #fastapi #nextjs #engineering #architecture
π» Have a similar project?
Sollea AI β Full-stack development, AI automation, custom solutions.
π Sollea AI Β· GitHub Β· LinkedIn
Team led by **Mohamed Amine Ben Mallessa* β Lead Dev at Sollea AI*
Top comments (0)