The future of the web is in personalization. Web sites will always contain a lot of static assets like images, video / audio, CSS and JS, many of which can be cached in the browser, but the remaining challenge is generating the HTML for a given request. So the question becomes, how do we quickly create the HTML we need for a specific user? We already know all the best practices for the server level, application level and browser level to create an optimal user experience, but most of the tools and best practices are all oriented around static HTML content.
So there are various techniques like using edge side includes (ESI), using AJAX to replace elements dynamically and so on, but all of those solutions just move where the work is done and don’t necessarily address the core problem, scaling the application. I’ll focus on the WordPress CMS, but these concepts are worth investigating for any application that uses lots of personalization, e.g. e-commerce sites or any site in need of a reduced execution time. The three techniques that follow are part of what I call “optimizing for the cache miss.”
Partials & Fragments:
Creating cache files for layout elements or components of layouts like sidebars, headers, footers, content boxes etc can significantly reduce the execution time of pages. Fragments can be bits of actual code or they can be small portions of page that are typically expensive to generate. Partials are larger blocks of rendered HTML typically and when combined with fragments essentially either leave you with a template structure in your CMS that lends itself either to reduce execution time on your origin or on your content delivery network’s edge servers if your CDN supports ESI.
In WordPress, the object cache is the highest level of resource used to render a finalized HTML page. Moving this caching to a persistent data store normally unlocks quite a bit of performance in generating a dynamic page extremely quickly while also reducing the number of database calls a given template requires to render a page. This level of caching compliments partials and fragments because partials and fragments rely on objects WordPress creates to render HTML.
The lowest level cache opportunity in applications, the database cache often means that data that is typically in MySQL (for example) query cache (if we’re lucky) or otherwise need to be fetched from database tables directly. Some database queries simply cannot be optimized for fast response times, a typical use case is site search. As site search is essentially a “personalization” case, what remains is to:
- optimize all of the other database calls as far as possible, either by removing the need for them entirely,
- optimizing the result set so that can reside in the MySQL query cache,
- use a memory based store
Database caching can be tricky because the lifetime of the cache objects typically needs to be low; however the use of the cache allows your database to focus on expensive requests.
These are a few high-level ideas / techniques that will allow you to better scale a personalized or highly interactive site to optimize for a cache miss. The future of the web performance optimization movement lies in performant personalized user experiences.
Frederick Townes was the Founding Chief Technical Officer of Mashable, one of the top independent media sites worldwide and is currently the Senior Technical Advisor. As a search / social media marketer and WordPress consultant, Frederick’s projects typically include WordPress as a core element. One of his largest contributions to the WordPress community was his web performance optimization framework W3 Total Cache. Since 2003 his agency W3 EDGE has assisted startups and well-known brands like: ASOS, Adorama, AIGA, Brian Solis, Center for Disease Control, Constant Contact, CVS Pharmacy, Envato, Hyatt, Jonathan Snook, Kodak, Lord & Taylor, Mashable, Microsoft, Neil Patel, Pearsonified, R.E.I., Sanyo, Sherwin Williams, Smashing Magazine, Southwest Airlines, Staples, Sony, Weight Watchers, Yahoo, Yoast and others. He is also a serial web entrepreneur and technologist. One of his recent projects, W3 MARKUP, launched in 2007, was acquired after only 11 short months prior to his moving to Florence, Italy in 2008. Frederick currently splits time in Boston still where he focuses on his latest project Placester as a co-founder.