My slides from WordCamp Dhaka 2019 on WordPress Scaling. In this session I explained performance optimisation using HTTP/2, Caching and compressing resources. I also explained how to Dockerize WordPress to make it easier to scale.

1. Scaling WordPress
Handling the bittersweet pain of success
All the photos used are from Unsplash

2. Principal Software Engineer, Telenor Health
Anam Ahmed
@theanam

3. Efficient Use of existing
Resources
When and how
To increase resource

4. Finding points of improvement

5. Static Resources

6. HTTP/2

7. Decreases & Compresses
Headers
Decreases the amount
Of open connection.
Reduces to 1
Server can push
Necessary files
beforehand
Fully Backward
Compatible
You should really go HTTP/2 because

8. server {
listen 443 ssl http2;
listen [::]:443 ssl http2;
server_name example.com;
root /path/to/public;
ssl_certificate /path/to/certificate.crt;
ssl_certificate_key /path/to/private.key;
ssl_protocols TLSv1.2;
}
Enabling HTTP/2 in Nginx

9. Enabling HTTP/2 in Apache
Step 1 : Enable HTTP/2 Module in Apache
Sudo a2enmod http2
sudo apachectl restart
Step 2 : Configure The web server to use HTTP2
<VirtualHost *:443>
Protocols h2 http/1.1
ServerAdmin you@your-awesome-site.com
ServerName your-awesome-site.com
...
</VirtualHost>

10. Facts
• Most CDN and Specialized File cloud comes with HTTP/2 pre enabled
like, Amazon S3, google Cloud Storage and most others have option to
enable it.
• HTTP/2 must be served over HTTPS. Otherwise most browsers will ignore
it.
• HTTP/2 will not fix your bad code.

11. Compression

12. server {
listen 443 ssl http2;
listen [::]:443 ssl http2;
gzip on;
gzip_disable “msie6”;
gzip_proxied any;
server_name example.com;
root /path/to/public;
ssl_certificate /path/to/certificate.crt;
ssl_certificate_key /path/to/private.key;
ssl_protocols TLSv1.2;
}
Enabling gzip Compression in Nginx

13. Enabling gzip in Apache
Step 1 : Enable deflate Module in Apache
Sudo a2enmod deflate
sudo apachectl restart
Step 2 : Configure The web server to use gzip compression
<Directory /var/www/html/>
<IfModule mod_mime.c>
AddType application/x-javascript .js
AddType text/css .css
</IfModule>
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/css application/x-javascript text/x-component text/html text/plain text/xml application/
<IfModule mod_setenvif.c>
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4.0[678] no-gzip
BrowserMatch bMSIE !no-gzip !gzip-only-text/html
</IfModule>
</IfModule>
Header append Vary User-Agent env=!dont-vary
</Directory>
[Too Big for the slide]

14. Help your browser cache better
Send proper cache-control headers

15. Cache-Control on nginx
location ~* .(?:manifest|appcache|html?|xml|json)$ {
expires -1;
}
# Media: images, icons, video, audio, HTC
location ~* .(?:jpg|jpeg|gif|png|ico|cur|gz|svg|svgz|mp4|ogg|ogv|webm|htc)$ {
expires 1M;
add_header Cache-Control "public";
}
# CSS and Javascript
location ~* .(?:css|js)$ {
expires 1y;
add_header Cache-Control "public";
}

16. Apache?
You already know the drill

17. What else can we do?

18. Google PageSpeed module ✨

19. Small Things matter
• Use SVG for logo and icons (Avoid icon fonts if not needed)
• Use JPG images instead of png. JPG has a better compression
• Use a CSS processor to clean up your CSS file

20. Where to measure progress?

21. Google Pagespeed Insight

25. What does performance have to
do with Scaling?

26. If your web application is efficient
You’ll be able to serve more users
With the same resource.
- It’s true but nobody quoted it

27. Dynamic Contents

28. Let’s Dockerize 🐳

29. What’s the Advantage?
• Easy to spawn multiple instances
• Easy to shift
• Easy to update core
• Easy to develop
• Easy to deploy

30. Official WordPress Docker Image

31. Before we start, Let’s think like
Docker 🚀

32. • WordPress application
• PHP
• All required PHP extensions
• Web Server (In many cases)
• Default Plugins and themes
• A database
• A way to add own plugin and themes
• A way to back up/keep all the file changes
• A way to access WordPress from outside
• This point is here to fix alignment in slide.
What’s Available? What else do we need?

33. Introducing Docker Compose

34. Image with Tag
For Themes and plugins
Localhost:8080
Database Settings
Name of the database service
Service for the Database, Mysql
Persistent data in database

35. Docker-compose up -d
Grab a cup of ☕ while it finishes its work

36. http://localhost:8080

37. All the default themes
and plugins will be
automatically
populated in the
folders we created

38. http://bit.ly/wordcamp-compose

39. So, How do we scale with
Docker?

40. With These tools

41. Or simply by adding multiple
services with Compose

42. Things to remember
• Use cloud native solutions if possible, for example if you are using AWS or
GCP, use their database solution. That’s much easier to scale.
• Use Sticky Session (IP hash) for load balancers, Otherwise PHP session
will be lost
• It’s better to create many smaller instances rather than one gigantic
instance. It will be less prone to failure

43. There’s A lot to talk about
Scaling

44. But Maybe some other day.

45. Thank you.