Enterprise WordPress - Performance, Scalability and Redundancy
- 1. Enterprise WordPress Performance, Scalability & Redundancy @JohnGiaconia Senior Manager, Technology The Walt Disney Company
- 2. Focus Areas Architecture Caching Optimizing Testing
- 3. Part 1 Architecture Caching Optimizing Testing
- 4. Server Architecture • Dedicated server for Admin Traffic • Not affected by load on the front end • Can be secured more tightly • 3 front end servers • Redundancy even if one is out of rotation • Monitors
- 5. Specialized Servers • Dedicated servers for Database • Offload the processing from Web Servers • Memcache servers • Load balancer • Handle SSL offloading • Restrict admin requests to whitelist source traffic
- 7. Why is this important? By distributing the work to specialized servers, the servers can be more tuned & optimized for a certain task. Bottlenecks can be addressed at a more granular level.
- 8. This sounds like a lot of servers Multiple web applications can share specialized servers. Plan ahead when architecting a new site. Will additional specialized servers need to be added into rotation?
- 9. Part 2 Architecture Caching Optimizing Testing
- 10. Types of Caching Object Proxy Assets • Stores objects as a key-value pair • Managed at the code level • Development tasks • Stores HTML • Managed at the system level • Config and development tasks • ESI - Edge Side Includes • CDN
- 13. CDN - Approaches • Approach 1: FTP Ingest assets manually • I want to upload specific files to an FTP server • Approach 2: Origin Source assets from my site • CDN will lazy load the assets from your website as they are requested and host a copy of them • The CDN doesn’t have the image until someone on the internet requests it
- 14. CDN - FTP Ingest • Manual file management via FTP • Methods for refresh: • TTL (configurable at the path level) • Cache busting query string parameter • Alternate URL • Forced expiration (manual or API) • Key Feature: Great for very large assets or documents
- 15. CDN - Origin Source Content Request CDN Source
- 16. CDN - Origin Source • Automatic replication to CDN • Can use programmatically generated cache busting query string params to get latest content • /wp-content/uploads/foo.jpg?ts=20140607 • Key Feature: Can be made to work with WordPress’ provided media library with path adjustment • Also CSS and JavaScript
- 17. you can reference that same image at http://cdn.example.com/wp-content/uploads/mickey.jpg Path adjustment…? and you have an image at http://example.com/wp-content/uploads/mickey.jpg and your CDN is set to use your site as its source If your site is http://example.com and your CDN is http://cdn.example.com
- 18. Additional Caching • Browser Caching: • Expires: Date that the content expires and should be refreshed by the browser • Cache-Control: Maximum age of the content — somewhat redundant with the Expires tag • Last-Modified: date that the content was last modified • Warning: If set too high, browser caching will cause stale content to appear on your sites and you will not have a server side “trigger” to clear the cached content. • WordPress Plugins
- 19. Part 3 Architecture Caching Optimizing Testing
- 21. Optimizing Tools Techniques Concepts Browser Tools YSlow Page Speed Firebug External Tools webpagetest.org Xenu / Integrity
- 23. Waterfall View
- 24. Optimizing Tools Techniques Concepts JavaScript JSLint Minify “Smash” CSS Minify “Smash” SASS & LESS Images Optimize for web Standard Formats: png, gif, jpeg, etc Vector based: svg
- 25. Optimizing Tools Techniques Concepts Images CSS Sprites Progressive vs baseline JPEGs Progressive “enhances” Icon Font Library Common re-usable icons Scalable Screen reader compatible FontAwesome
- 26. Optimizing - Sprites • Reduces number of requests • Group similar “size” images • Items that change very infrequently • Applications: • Borders, Gradients, Flourishes, etc. • Common items across multiple pages • NOT recommended for contextual images • Usability issue (“alt” tag)
- 27. Part 4 Architecture Caching Optimizing Testing
- 28. Load Testing • Never on production • Never before notifying everyone • Always for sites that will have potential high load or DDoS target Never Never
- 29. Performance Testing • WebPageTest.org • Automated testing tools • Behavior Driven Development frameworks • Browser automation tools
- 30. Behavior Driven Development • Takes Test Driven Development one step further to include Business Analysis. • Automatic performance test can be executed periodically and tracked • Trends and outliers will help identify changes the impact performance • Can be integrated into build process • Encourages simpler, cleaner code via TDD engineering process • Example: Jasmine Behavior Driven Development Framework
- 31. Jasmine BDD Framework describe("A spec", function() { it("is just a function, so it can contain any code", function() { var foo = 0; foo += 1; expect(foo).toEqual(1); }); it("can have more than one expectation", function() { var foo = 0; foo += 1; expect(foo).toEqual(1); expect(true).toEqual(true); }); }); A spec is just a function, so it can contain any code can have more than one expectation
- 32. Browser Automation • Time can be tracked for test runtime • Initial QA can be performed before any manual testing • Example: Selenium
- 33. Focus Areas Architecture Caching Optimizing Testing
- 34. Questions? @JohnGiaconia Senior Manager, Technology The Walt Disney Company
- 35. Thank you! @JohnGiaconia Senior Manager, Technology The Walt Disney Company