We needed to scale the serving of responsive images for a large WordPress installation in an efficient and cost-effective way. This is the story of how we took advantage of technologies outside of WordPress itself, leaning on Amazon Web Services, to achieve that.

1. SERVERLESS ARCHITECTURE FOR
AUGMENTING WORDPRESS
A Case Study by Japh Thomson

2. SETTING
THE SCENE
Limitations of traditional
platforms and responsive images

3. RESPONSIVE CHALLENGES
➤ Many devices … many sizes
➤ Lots of storage space
➤ Lots of bandwidth
➤ Intensive processing

4. PROBLEM?
Many sites, lots of traffic,
many devices, lots of images

5. PROBLEM!
➤ Large blog networks
➤ Two with 8M+ page views
per month each
➤ Fashion / Foodie / Lifestyle
niche
➤ Many blogs, many bloggers,
many photos
➤ About 2TB of images and
growing
➤ Processing, storage,
bandwidth…

6. WORDPRESS
➤ Responsive image sizes
handled natively (since 4.4)
➤ Can handle creation of
multiple image files for sizes
➤ Can’t really solve the entire
problem at this level

7. SOLUTION(S)
A progression

8. TACHYON
➤ Deals with image resizing on-
the-fly
➤ “Faster than light image
processing.”
➤ Inspired by / Forked from
WordPress.com's Photon
➤ PHP-based
➤ Switched from Graphics Magic
to Image Magick
➤ Hosted on AWS
➤ Backed by S3
➤ Sits behind CloudFront

9. WORDPRESS PLUGIN
➤ Plugin rewrites URLs
➤ Images on S3 to Tachyon
URLs
➤ WordPress handles the
specific responsive image size
required

10. TACHYON IN NODE.JS
➤ Faster and better threading
➤ Uses Sharp for image
processing
➤ Can also be configured as a
proxy for the main process to
run in Lambda…

11. WHAT IS LAMBDA?
➤ AWS Service
➤ “Run code without having to
think about servers”
➤ Renting processing time on a
server, rather than the whole
server
➤ Can run Node.js, Python, or
Java

12. TACHYON ON LAMBDA
➤ Serverless! (Almost)
➤ Still need the proxy, until
AWS API Gateway can return
binary data from Lambda
functions
➤ Nginx proxy is very thin
and fast
➤ Inherently scalable

13. VISUALISE
An evolving infrastructure

20. RESULTS
Does the customer care?

21. PROOF IS IN THE PUDDING
➤ Saving money on storage, as
image sizes are generated on-
the-fly, stored in the CDN
➤ Faster for visitors as more
device sizes can be covered
➤ Saving money on processing,
as Lambda is only called when
needed, no EC2 instances
sitting around
➤ Fun to work on!

22. THANKS!
QUESTIONS?
@Japh
from @HumanMadeLtd