Caching Strategies: Dari Browser sampai Database
Multi-layer caching untuk performa maksimal
Tujuan Pembelajaran
- Mengerti berbagai layer caching dalam arsitektur web
- Bisa memilih caching strategy yang tepat
- Mengerti cache invalidation dan eviction policies
Analogi
Caching Layers (CDN -> Browser -> App -> Database):
1. CDN Cache (CloudFlare) -> Static assets, TTL 1h
2. Browser Cache -> Cache-Control headers
3. Application Cache (Redis) -> Computed data, TTL 5m
4. Database Cache (Query Cache) -> Frequent queries
5. ORM Cache -> Entity cache
Caching adalah salah satu teknik paling efektif untuk meningkatkan performa — tapi juga sumber bug paling umum
Penjelasan Konsep
Caching adalah teknik menyimpan data di lokasi yang lebih dekat ke consumer sehingga akses lebih cepat.
Tapi caching juga membuat sistem lebih kompleks — cache invalidation adalah salah satu dari dua hal tersulit dalam computer science (bersama naming things dan off-by-one errors).
CDN Cache (Layer 1)
CDN (Content Delivery Network) menyimpan static assets (gambar, CSS, JS, video) di edge servers di seluruh dunia.
User mengakses dari edge terdekat — latency jauh lebih rendah.
TTL (Time To Live) menentukan berapa lama asset di-cache.
Browser Cache (Layer 2)
Browser menyimpan asset berdasarkan HTTP cache headers — Cache-Control (max-age, no-cache,
No-store), ETag (content hash untuk conditional request), Last-Modified.
Application Cache (Layer 3)
Redis/Memcached menyimpan computed data, session, rate limit counters.
Patterns: Cache-aside (app cek cache → miss → fetch DB → store cache), Write-through (tulis ke cache dan DB bersamaan), Write-behind (tulis ke cache, async ke DB).
Cache Invalidation
Cache warming (pre-populate saat startup),
TTL-based (expire otomatis), Event-based (invalidate saat data berubah), Version-based (cache key include version number).
Eviction Policies
LRU (Least Recently Used — paling umum), LFU (Least Frequently Used), FIFO (First In First Out), Random.
Inti yang Perlu Dipahami
Bagian ini berfokus pada mengerti berbagai layer caching dalam arsitektur web., bisa memilih caching strategy yang tepat., dan mengerti cache invalidation dan eviction policies. Jangan terburu-buru menghafal istilahnya. Lebih penting untuk memahami peran setiap konsep dan kapan konsep itu muncul dalam pekerjaan web development.
Saat membaca Caching Strategies, gunakan tujuan belajar sebagai penanda arah. Kalau kamu sudah bisa menjelaskan tujuan itu dengan kata-katamu sendiri, berarti fondasinya mulai terbentuk.
Cara Membayangkannya
Caching adalah salah satu teknik paling efektif untuk meningkatkan performa — tapi juga sumber bug paling umum. Analogi ini dipakai supaya konsep teknis tidak terasa melayang. Hubungkan setiap istilah dengan perannya: siapa yang meminta, siapa yang memproses, data apa yang berpindah, dan hasil apa yang diharapkan.
Kalau analoginya sudah terasa masuk akal, barulah lihat istilah teknisnya. Cara ini membuat materi lebih mudah dipahami daripada langsung menghafal definisi.
Saat Melihat Contoh Kode
Contoh kode pada chapter ini memakai bahasa typescript. Bacalah contoh kode sebagai ilustrasi alur, bukan sebagai bagian yang harus langsung dihafal. Cache-aside: app bertanggung jawab mengelola cache. Setex untuk store dengan TTL. Del untuk invalidate saat data berubah. Pattern ini paling flexible tapi ada race condition window antara DB write dan cache invalidation.
Perhatikan nama fungsi, urutan langkah, dan data yang berpindah. Biasanya tiga hal itu sudah cukup untuk memahami hubungan antara teori dan praktik.
Konteks dalam Perjalanan Belajar
Setiap konsep di platform ini dipilih karena dipakai di industri. Fokus pada pemahaman, bukan hafalan.
Kamu sudah di bagian lanjutan. Mulai pikirkan bagaimana konsep ini dipakai di dunia kerja — bukan hanya untuk belajar, tapi untuk membangun produk nyata.
Gunakan pertanyaan reflektif dan prompt AI di akhir chapter sebagai latihan aktif. Membaca saja tidak cukup — kamu perlu menjelaskan ulang dengan kata-katamu sendiri.
Contoh Kode
// Cache-aside pattern dengan Redis
import { Redis } from 'ioredis';
const redis = new Redis(process.env.REDIS_URL);
async function getUserWithCache(userId: string) {
const cacheKey = `user:${userId}`;
// 1. Cek cache dulu
const cached = await redis.get(cacheKey);
if (cached) {
console.log('[CACHE] Cache hit');
return JSON.parse(cached);
}
// 2. Cache miss → fetch dari database
console.log('[CACHE] Cache miss → querying DB');
const user = await db.select().from(users).where(eq(users.id, userId)).limit(1);
if (user.length) {
// 3. Store ke cache untuk request berikutnya
await redis.setex(cacheKey, 300, JSON.stringify(user[0])); // TTL 5 menit
}
return user[0] ?? null;
}
// Cache invalidation saat data berubah
async function updateUser(userId: string, data: Partial<User>) {
// Update database
await db.update(users).set(data).where(eq(users.id, userId));
// Invalidate cache
await redis.del(`user:${userId}`);
// Jika ada cache list yang include user ini, invalidate juga
await redis.del('users:list');
}Penjelasan Kode
Prompt AI
Implementasikan write-through caching pattern untuk product catalog. Bandingkan latency dan consistency dengan cache-aside pattern.
Pertanyaan Reflektif
Caching bisa meningkatkan performa 10-100x, tapi selalu pertimbangkan: apa yang terjadi kalau cache down? Sistem harus tetap berfungsi (graceful degradation).