Techniques
Concrete techniques, visualised. Know what each one does, when to apply it, and what it costs.
Script & Loading
Third-Party Facades
Replace heavy embeds with static previews that load the real widget only on click.
Learn moreDelay JavaScript
Postpone non-critical scripts until after the visitor first interacts with the page.
Learn moreDefer JavaScript
Prevent render-blocking scripts from delaying page rendering.
Learn moreSpeculation Rules
Prerender the next page in the background so navigation feels instant.
Learn morePreload Critical Assets
Tell the browser about critical resources early so it fetches them in parallel with HTML parsing.
Learn moreVideo Optimization
Compress and format video files correctly so they load fast without sacrificing playback quality.
Learn moreUpgrade to HTTP/2
Enable HTTP/2 multiplexing so dozens of resources load in parallel over one connection.
Learn morePreload Links
Prefetch the next likely page in the background so navigation feels instant when the user clicks.
Learn moreSelf-Host Web Fonts
Host font files on your own server to eliminate the Google Fonts DNS and connection overhead.
Learn morePreload LCP Image
Hint the browser to fetch the hero image early — before it discovers it in CSS or late markup.
Learn moreJavaScript Concatenation
Merge multiple JavaScript files into one bundle to cut HTTP request overhead.
Learn moreThird-Party Scripts in Service Worker
Move third-party analytics and tracking scripts off the main thread by running them in a service worker.
Learn moreCritical CSS
Extract and inline above-the-fold CSS to eliminate render-blocking stylesheets.
Learn moreAsync JavaScript
Load independent scripts without blocking HTML parsing, executing them the moment they finish downloading.
Learn moreLocalize External Resources
Download and self-host third-party scripts, stylesheets, and images to eliminate external DNS and connection overhead.
Learn moreFont Subsetting
Remove unused Unicode character ranges from font files to reduce their transfer size.
Learn moreText Compression
Enable Brotli or Gzip on your server to shrink HTML, CSS, and JS by 60–80%.
Learn moreHTTP 103 Early Hints
Send preconnect and preload hints to the browser before the server has finished generating the HTML response.
Learn moreEarly Domain Connection
Warm up connections to critical third-party domains before their resources are requested.
Learn moreEliminate Redirect Chains
Cut unnecessary HTTP redirects that add a full network round-trip before the first byte of HTML.
Learn moreReplace Animated GIFs with Video
Convert animated GIFs to WebM or MP4 video to cut file size by 70–90%.
Learn moreMinify CSS and JavaScript
Strip comments, whitespace, and dead code from CSS and JS to reduce transfer and parse time.
Learn moreCSS Concatenation
Merge multiple CSS files into one to reduce HTTP request overhead.
Learn moreLazyload Images
Defer off-screen images until they near the viewport, reducing initial page weight and freeing bandwidth for critical resources.
Learn moreLazyload Iframes
Defer iFrame loading until the embed nears the viewport — either via loading="lazy" or IntersectionObserver.
Learn moreInline Small Assets
Eliminate HTTP requests for small CSS, JS, and images by embedding them directly into the HTML.
Learn moreWordPress Heartbeat Control
Reduce or disable the WordPress Heartbeat API to eliminate recurring AJAX polling overhead.
Learn moreWordPress Emoji Removal
Remove the WordPress emoji scripts and styles that load on every page for a feature most sites do not need.
Learn moreMinify HTML
Strip comments, collapse whitespace, and remove redundant attributes from HTML output to reduce file size.
Learn moreLazyload CSS Backgrounds
Defer CSS background image loading until the element nears the viewport using IntersectionObserver.
Learn moreCaching & Delivery
Edge Page Cache
Cache full HTML at CDN edge nodes — eliminating both PHP execution time and geographic network latency in one step.
Learn morePage Cache
Store fully rendered HTML on disk or in memory so repeat requests skip PHP and database entirely.
Learn moreContent Delivery Network
Serve static assets from servers geographically close to each visitor.
Learn moreService Worker Cache
Cache assets in the browser on first visit so every return visit loads from memory in milliseconds.
Learn moreObject Cache (Redis)
Cache WordPress database queries in RAM so repeated lookups take microseconds instead of milliseconds.
Learn moreCache Preloading (Cache Warming)
Populate the page cache proactively before visitors arrive so no one ever hits an empty cache.
Learn moreLogged-In User Cache
Cache pages for logged-in users instead of bypassing cache for every authenticated request.
Learn moreStale-While-Revalidate
Serve cached content immediately while refreshing it in the background, eliminating cache-expiry latency spikes.
Learn moreCache Query Strings
Extend page cache coverage to URLs with query string parameters instead of bypassing them.
Learn moreSeparate Mobile Cache
Serve a dedicated cached response for mobile visitors when the mobile experience differs from desktop.
Learn moreDatabase Optimization
Remove database bloat and optimize table structure to speed up every query WordPress executes.
Learn moreDatabase Query Cache
Cache the results of expensive or repeated database queries to avoid re-executing them on every request.
Learn moreREST API Cache
Cache WordPress REST API responses to serve repeated API requests without PHP or database execution.
Learn moreCache TTL
Control how long cached resources stay fresh before the browser or CDN must re-validate.
Learn moreBrowser Cache
Store static assets locally so repeat visits skip the network entirely.
Learn moreAutoload Data Optimization
Reduce the autoloaded wp_options data to cut the PHP bootstrap time on every page request.
Learn moreImages & Media
Responsive Images
Serve right-sized images per device so a phone never downloads a full desktop image.
Learn moreOptimize Critical Images
Eagerly load and prioritise the LCP image while lazy-loading everything below the fold.
Learn moreNext-Gen Image Formats
Serve WebP or AVIF images to cut transfer size 25–70% with no visible quality loss.
Learn moreImage Compression
Reduce image file sizes through lossy or lossless compression without visibly degrading quality.
Learn moreSVG Optimization
Compress SVG files by removing unused data, simplifying paths, and stripping metadata.
Learn moreExplicit Image Dimensions
Reserve layout space before images load by setting width and height attributes.
Learn moreImage Placeholders (LQIP / BlurHash)
Show a blurred or color-matched placeholder while full images load to eliminate jarring empty space.
Learn moreAsync Image Decoding
Decode images off the main thread with decoding="async" to reduce jank during image-heavy scrolling.
Learn moreRendering & Layout
Remove Unused JavaScript
Eliminate JavaScript that no page executes to cut parse, compile, and main-thread time.
Learn moreReduce DOM Complexity
Cut unnecessary DOM nodes to speed up style recalculation, layout, and long tasks.
Learn moreLazy Render Content
Use content-visibility: auto to skip rendering off-screen sections entirely until they near the viewport.
Learn moreRemove Unused CSS
Strip CSS rules that no page uses to shrink stylesheets and unblock rendering.
Learn moreFont Loading Strategy
Eliminate invisible text and layout shifts caused by web font loading.
Learn moreUse Composited Animations
Animate only transform and opacity so animations run on the GPU and never block the main thread.
Learn moreBreak Up Long Tasks
Split JavaScript tasks longer than 50ms into smaller chunks so the browser stays responsive.
Learn moreNetwork & Connections
Nothing matches that search.