[[Wordpress]] can be a blazing fast full stack framework to work in. However, excessive plugins, lack of caching, and a generally lower code quality can lead to horrible performance. WordPress performance typically suffers in time-to-first-byte (TTFB) benchmarks, as PHP code and the framework must run before the output starts to generate. Before every page load, a series of *hooks* is called at different stages of the process to handle authentication, tracking, loading, etc. WordPress runs this for each page load as WordPress has no caching by default. Adding more plugins slows down page generation in two ways: Database access, and code execution. There are 3 domains where optimization needs to occur: * Server-side optimization. Every WordPress page is generated, so optimizing the time it takes to generate that page speeds up loading * Client-side optimization. * CDN optimization -- improving TTFB by having servers serve pre-cached files from closer to the user. [[Cloudflare]] is really good for this. WordPress optimization strategy can be broken down into a priority list: 1. Caching. No code or database access is required if data is cached. 2. Database optimization: Optimizing plugins or queries to minimize database access is a good idea, though database access is generally not a problem with well written plugins. Care should be taken to look for [[N plus 1 Queries|N+1 issues]]. 3. Resource optimization: Resources generally take a long time to load, so optimizing their loading time is generally a big boon. But since they have to wait for TTFB to start loading in the user's browser. ## Server Optimizations WordPress tends to serve a lot of resources (around 200 or so on complex pages) per page. Using HTTP 1.1 this is 200 requests, but HTTP 2 or HTTP 3 multiplexing. ## Caching There are 3 types of caching to enable on a website: * Page content caching. By preventing the generation of HTML, you prevent all hooks from firing, all database queries from running, and simply are serving a pre-generated file. * Browser caching, with `HTTP Cache-Control` and `E-Tags` * Opcode caching, which is generally enabled by Zendcache Database caching typically has poor results with WordPress sites as DB access is already optimized. A plugin such as [[W3 Total Cache]] solves all 3 at once. ## Resource Optimization Resource optimization is nuanced. WordPress serves hundreds of [[JavaScript]] and [[CSS]] files for each plugin and page that's loaded. This is slow on *HTTP/1.1* but fast on *HTTP/2+* Not sending data is the best though! * Disable WP Emoji if possible. It runs a lot of [[jQuery]] ## Builder Optimizations ### Elementor * Enable "Element Caching" * Disable unused elements in the Element Manager # General Optimizations Largest Contentful Paint: * Try and pre-load these resources. TODO: Find a plugin for this. Critical CSS: #todo Preloading resources #todo