How We Run Decoupled Websites with 110 Million Hits per Month
better sit on the left side of the room, there is gonna be a lot of goodies on the screen :)
Michael Schmid
@Schnitzel
CTO Amazee Group
This is not your standard session
Please ask questions right away
The Projects
- Ringier Axel Springer
- Started end 2016
- Multiple Frontends, single Backend
- beobachter.ch
- handelszeitung.ch
- bilanz.ch
- schweizer-illustrierte.ch
- gaultmillau.ch
- Swiss Paraplegic Center
- 2018
- Single Frontend
- paraplegie.ch
- Infrastructure
- Platform
- Code
- People
- Learnings
Infrastructure
- AWS, could be anywhere:
- Azure
- Google Cloud
- Custom
- Autoscaled
- Multi AZ
Platform
- Completely Dockerized
- Lagoon, Kubernetes, OpenShift
- Fully Autoscaled
First: Drupal only
Decoupled Drupal
Multi Decouple Drupal
- Single Drupal Backend
- Multiple Frontends (Monorepo)
- All using the same GraphQL API
Multi Decoupled Drupal
Code
- Monorepo
- Drupal Backend
- GraphQL
- nothing more
- React Frontend
- React & Apollo (Next.js)
- Server Side Rendering
CI/CD
- Individual Environments for every
- Branch
- Pull Request
- Frontend can point to any Backend
- PRs Targets
- Customized
- TravisCI/CircleCI for Unit Tests, Behat, etc.
People
- Strict PR based deployments
- Pagerduty Schedule with Developers
- 1. Developers
- 2. amazee.io 24/7 Engineers
- Chat Communication ChatOps
Learnings
NodeJS as a WebServer is hard
- Developers coming from a Drupal World
- Concept of NodeJS as a Webserver is not fully understood
- Issues with Image Cache Headers, Redirects, Basic Auth
- Implement small nginx container with nodejs container
Learnings
Persistent GraphQL
- Allow POST GraphQL queries in PR and DEV environments
- Ensure to have tests for them :)
Learnings
Crisis Communication is Key
- Dedicated communication engineer during incidents
- Chat & ChatOps helps tremendous
- Internal Statuspage for Stakeholders
Questions?
Caching GraphQL
- GraphQL Requests sometimes too big for GET
- POST is by standard cacheable! 😱
- Many CDN & Cache Systems can't cache POST
- Solution: Persistent GraphQL
Persistent GraphQL
- Frontend creates Query Map
- JSON file of all possible GraphQL queries
- Each Query has an ID in the JSON file
- Frontend sends QueryMap to Backend
- Requests are sent via GET and just the Query ID instead of whole Query
This also makes your GraphQL endpoint secure! 🎉
How We Run Decoupled Websites with 110 Million Hits per Month - DrupaCon Seattle 2019
By Michael Schmid
