Caching API responses in Blazor WASM reduces network calls, speeds up the UI, and improves offline resilience.

Register and Inject

// Program.cs
builder.Services.AddMemoryCache();

// In a service:
@inject IMemoryCache Cache

Cache-Aside Pattern

private async Task<List<Product>> GetProductsAsync()
{
    const string key = "products_all";
    if (!Cache.TryGetValue(key, out List<Product> products))
    {
        products = await Http.GetFromJsonAsync<List<Product>>(
            "/api/products") ?? new();
        Cache.Set(key, products, TimeSpan.FromMinutes(5));
    }
    return products;
}

Cache Entry Options

var options = new MemoryCacheEntryOptions()
    .SetAbsoluteExpiration(TimeSpan.FromMinutes(10))
    .SetSlidingExpiration(TimeSpan.FromMinutes(2));

Invalidating Cache

Cache.Remove("products_all"); // Force refresh after mutation

Strategy Cheat Sheet

• Reference data (categories, countries) — cache aggressively, long TTL
• User-specific data — cache per-user key, short TTL
• Real-time data — do not cache or use very short sliding expiry
• After mutations — always invalidate affected cache keys

Reference:

Wikipedia: Cache (Computing)

https://en.wikipedia.org/wiki/Cache_(computing)