Caching design pattern กับ backend

/ 7 min read

Share on social media

cache-design-pattern สามารถดู video ของหัวข้อนี้ก่อนได้ ดู video

(เอกสารฉบับนี้เป็นเอกสารประกอบ video เรื่อง cache pattern)

Content นี้สนับสนุนโดย เหล่าผู้ตามของ Mikelopster (มีคนขอมาว่าอยากให้ express กับ cache) มันก็เลยเป็นหน้าที่ของผมที่จะต้องมาตอบสิ่งนี้ในช่องของเรา

Cache คืออะไร ?

Cache คือสถานที่เก็บข้อมูลชั่วคราวเพื่อให้สามารถ access ได้ไวขึ้น

  • ปกติมักจะใช้กับข้อมูล “ที่มีการเรียกใช้บ่อย” เช่น
    • content หน้าแรก
    • ข้อมูลสินค้าที่มีการเรียกใช้บ่อยๆ

ทีนี้ประเด็นสำคัญมันอยู่ที่ว่า

  • เราควร update cache ตอนไหน ? เพื่อให้ user สามารถเห็นข้อมูลได้เป็นปัจจุบันมากที่สุด
  • เราจะมาพูดถึง Caching design patterns ผ่าน code ของ express, mysql (ที่ใช้เพราะมีอยู่ใน course เผื่อใครงงจะได้ไปดู course ผมเอง) และ DB Redis กัน

Redis คือ DB ที่ใช้สำหรับเก็บ cache

  • ปกติการอ่าน cache จากแรมจะเร็วกว่าจาก disk อยู่แล้ว (พวกอ่านจาก disk ก็เช่น DB ทั่วๆไปนั่นแหละ) ดังนั้นเราก็จะ setup Redis เป็นแบบ in memory เป็น default ไป
  • เราจะใช้ docker-compose ในการสร้าง mysql, phpmyadmin และ redis
  • เพื่อให้ง่ายต่อการเล่า เราจะสมมุติว่า cache คือ container ก้อนเดียวไป

setup docker-compose

นี่คือ docker-compose.yml ที่เราจะใช้ในการทดลองนี้

  • mysql run ที่ 3306
  • phpmyadmin run ที่ 8080
  • redis run ที่ 6379
version: "3.7"
services:
db:
image: mysql:latest
container_name: mysql_db
command: --default-authentication-plugin=mysql_native_password
environment:
MYSQL_ROOT_PASSWORD: root
MYSQL_DATABASE: tutorial
ports:
- "3306:3306"
volumes:
- mysql_data:/var/lib/mysql
phpmyadmin:
image: phpmyadmin/phpmyadmin:latest
container_name: phpmyadmin
environment:
PMA_HOST: db
PMA_PORT: 3306
PMA_USER: root
PMA_PASSWORD: root
ports:
- "8080:80"
depends_on:
- db
redis:
image: redis:latest
container_name: redis-container
ports:
- "6379:6379"
volumes:
mysql_data:
driver: local

เริ่มต้น code เราจะ setup connect mysql, redis เอาไว้ทั้งหมด เราจะใช้ file เดียว index.js ในการทดลองจะมีข้อมูลประมาณนี้อยู่ใน index.js

const express = require("express");
const bodyparser = require("body-parser");
const mysql = require("mysql2/promise");
const redis = require("redis");
const cron = require("node-cron");
const app = express();
app.use(bodyparser.json());
const port = 8000;
let conn = null;
let redisConn = null;
// function init connection mysql
const initMySQL = async () => {
conn = await mysql.createConnection({
host: "localhost",
user: "root",
password: "root",
database: "tutorial",
});
};
// function init connection redis
const initRedis = async () => {
redisConn = redis.createClient();
redisConn.on("error", (err) => console.log("Redis Client Error", err));
await redisConn.connect();
};
// เคสแบบไม่ใช้ cache สำหรับดึง users ทั้งหมดออกมา
app.get("/users", async (req, res) => {
const results = await conn.query("SELECT * FROM users");
res.json(results[0]);
});
/*
เพื่อให้เอกสารอ่านง่ายขึ้น code ด้านล่างต่อจากนี้ เราจะเพิ่ม code เพียงแค่บริเวณนี้เท่านั้น สำหรับการทดลองนี้ เท่านั้น
*/
app.listen(port, async (req, res) => {
await initMySQL();
await initRedis();
console.log("http server run at " + port);
});

วิธีเข้า redis-cli ใช้งานโดยเข้าไปยัง container ของ redis

Terminal window
# ทำการ access เข้า redis container ใน docker
docker exec -it redis-container
# ใน container redis
$ redis-cli

Pattern ตัวที่ผมจะหยิบมาเล่าจะมีทั้งหมด 3 ตัว

1. Lazy loading (Cache-Aside)

  • จังหวะเขียน = ไม่เขียน cache (เขียน DB ปกติ)
  • จังหวะที่อ่าน
  • เช็คก่อนว่ามี cache ไหม ?
    • ถ้าไม่มี = อ่าน DB และเขียน cache
    • ถ้ามี = อ่านจาก cache แทน

DatabaseCacheClientDatabaseCacheClientalt[Cache Miss][Cache Hit]Check CacheCache Miss?Cache MissLoad DataDataUpdate CacheCache HitRetrieve Data

Backend code

app.get("/users/cache-1", async (req, res) => {
try {
const cachedData = await redisConn.get("users");
if (cachedData) {
// มี cache = ใช้ cache ก่อนไปเลย
res.json(JSON.parse(cachedData));
return;
}
// User data not found in cache, fetch from MySQL
const [results] = await conn.query("SELECT * FROM users");
// Store user data in Redis cache
await redisConn.set("users", JSON.stringify(results));
res.json(results);
} catch (error) {
console.error("Error:", error);
res.status(500).json({ error: "An error occurred" });
}
});

2. Write-through

  • จังหวะที่เขียน ทุกครั้งที่มีการเขียนข้อมูล = save cache ด้วยกันเสมอ (เพื่อให้ได้ข้อมูลสดใหม่ตลอดเวลา)
  • จังหวะที่อ่าน
    • ถ้าไม่มี = อ่าน DB
    • ถ้ามี = อ่านจาก cache แทน
    • จริงๆจะใช้แบบเดียวกับข้อที่ 1 ก็ได้ไม่ผิดเหมือนกัน ขึ้นอยู่กับว่าจะ handle เรื่อง cache ไปด้วยหรือไม่

DatabaseCacheClientDatabaseCacheClientWrite cacheRead dataalt[Cache Miss][Cache Hit]Write DataUpdate CacheUpdate DatabaseDatabase UpdatedWrite CompleteCheck CacheCache Miss?Cache MissLoad DataDataCache HitRetrieve Data

Express code

// api สำหรับ get
app.get("/users/cache-2", async (req, res) => {
try {
const cachedData = await redisConn.get("users-2");
if (cachedData) {
// มี cache = ใช้ cache ก่อนไปเลย
res.json(JSON.parse(cachedData));
return;
}
// User data not found in cache, fetch from MySQL
const [results] = await conn.query("SELECT * FROM users");
res.json(results);
} catch (error) {
console.error("Error:", error);
res.status(500).json({ error: "An error occurred" });
}
});
// api สำหรับเพิ่ม users + เขียนลง cache เพิ่ม
app.post("/users", async (req, res) => {
try {
let user = req.body;
// insert ข้อมูลใส่ database
const [results] = await conn.query("INSERT INTO users SET ?", user);
user.id = results.insertId;
// เขียน cache ใหม่ด้วย
let cachedData = await redisConn.get("users-2");
let newData = [];
if (cachedData) {
const loadDataCache = JSON.parse(cachedData);
newData = loadDataCache.concat(user);
await redisConn.set("users-2", JSON.stringify(newData));
} else {
const [results] = await conn.query("SELECT * FROM users");
await redisConn.set("users-2", JSON.stringify(results));
}
res.json({
message: "insert ok",
dataAdded: user,
});
} catch (error) {
console.error("Error:", error);
res.status(500).json({ error: "An error occurred" });
}
});

3. Write back

  • จังหวะที่เขียน เขียน Cache ก่อนเสมอ
  • scheduler มีตัวสำหรับ set เวลาเอาไว้ update กลับ DB หลัก (จาก cache) เพื่อให้ Database สามารถ update ข้อมูลจาก cache กลับมาได้
  • จังหวะที่อ่าน
    • ถ้าไม่มี = อ่าน DB
    • ถ้ามี = อ่านจาก cache แทน
    • จริงๆจะใช้แบบเดียวกับข้อที่ 1 ก็ได้ไม่ผิดเหมือนกัน ขึ้นอยู่กับว่าจะ handle เรื่อง cache ไปด้วยหรือไม่

DatabaseCacheClientDatabaseCacheClientWrite cache (update data)Write back to DatabaseRead dataalt[Cache Miss][Cache Hit]Write DataUpdate CacheWrite Complete (Ack)Update Database (Deferred)Database Updated (Ack)Check CacheCache Miss?Cache MissLoad DataDataCache HitRetrieve Data

Express code

app.get("/users/cache-3", async (req, res) => {
try {
const cachedData = await redisConn.get("users-3");
if (cachedData) {
// มี cache = ใช้ cache ก่อนไปเลย
res.json(JSON.parse(cachedData));
return;
}
// User data not found in cache, fetch from MySQL
const [results] = await conn.query("SELECT * FROM users");
res.json(results);
} catch (error) {
console.error("Error:", error);
res.status(500).json({ error: "An error occurred" });
}
});
app.put("/users/:id", async (req, res) => {
try {
let user = req.body;
let id = parseInt(req.params.id);
user.id = id;
// เขียน cache ใหม่ด้วย
let cachedData = await redisConn.get("users-3");
let updateIndexList = (await redisConn.get("update-users-3")) || [];
let updateData = "";
if (cachedData) {
const loadDataCache = JSON.parse(cachedData);
let selectedIndex = loadDataCache.findIndex((user) => user.id === id);
loadDataCache[selectedIndex] = user;
updateIndexList.push(selectedIndex);
updateData = loadDataCache;
} else {
const [results] = await conn.query("SELECT * FROM users");
let selectedIndex = results.findIndex((user) => user.id === id);
results[selectedIndex] = user;
updateIndexList.push(selectedIndex);
updateData = results;
}
await redisConn.set("users-3", JSON.stringify(updateData));
await redisConn.set("update-users-3", JSON.stringify(updateIndexList));
res.json({
message: "update ok",
dataAdded: user,
});
} catch (error) {
console.error("Error:", error);
res.status(500).json({ error: "An error occurred" });
}
});
let waiting = false;
cron.schedule("*/10 * * * * *", async () => {
console.log("running every 10 seconds", waiting);
try {
if (waiting) {
return;
}
const cachedData = await redisConn.get("users-3");
const updateIndexListCached = await redisConn.get("update-users-3");
if (updateIndexListCached) {
waiting = true;
const updateIndexList = JSON.parse(updateIndexListCached);
const userData = JSON.parse(cachedData);
for (let i = 0; i < updateIndexList.length; i++) {
const index = updateIndexList[i];
const selectedUser = userData[index];
const id = selectedUser.id;
const updateUser = {
name: selectedUser.name,
age: selectedUser.age,
description: selectedUser.description,
};
const [results] = await conn.query("UPDATE users SET ? WHERE id = ?", [updateUser, id]);
console.log("=== update complete !", results);
}
await redisConn.del("update-users-3");
waiting = false;
}
} catch (error) {
console.error("Error:", error);
res.status(500).json({ error: "An error occurred" });
}
});

Scenario ที่เหมาะสม (ตามประสบการณ์ผมด้วย)

1. Lazy loading (Cache-Aside)

  • เหมาะสำหรับเคสที่มีโหลดที่มีการเรียกใช้่บ่อยๆ เช่น load campaign, load สินค้าหน้าแรก ที่่คนดูจะเข้ามาดูบ่อยมากๆ

2. Write-through

  • ใช้ได้กับเคสเหมือนกับวิธีแรก แต่เหมาะกับกรณีที่มีการ write ไม่บ่อย (update วันละไม่กี่ครั้ง) เนื่องจากมี write latency (เพิ่มระยะเวลาช่วง write เข้ามา)

3. Write back

  • ใช้ได้กับเคสที่ต้องการแยก performance ระหว่าง Load ด้านหน้า กับการจัดการ Database (hit database จะเกิดขึ้นแบบ async ทำให้ฝั่งหน้าเว็บ ไม่เสียเวลารอในการจัดการกับ database)
  • (ส่วนตัว) ยังไม่เคยใช้วิธีนี้

สิ่งที่เวลาใช้ cache ควรทำเพิ่มเติมอื่นๆ

  • set Time to live: เพื่อบอกว่า cache หมดเวลาเท่าไหร่
  • Replacement strategy, eviction policy (การแทนที่ cache เมื่อ cache เต็ม)

Code ทั้งหมด (github)

Reference

Related Post
  • LLM Local and API
    มี Video
    แนะนำพื้นฐาน LLM การใช้งานบน Local ด้วย LM Studio และ Ollama พร้อมตัวอย่างการสร้าง API ด้วย FastAPI และการใช้งานร่วมกับ Continue AI
  • Code Quality & Security with SonarQube
    มี Video
    แนะนำพื้นฐานการทำ Sonarqube Code พร้อม Code Quality & Security
  • สรุปเนื้อหา Exploring the Power of Gemini (I/O Extend 24)
    มี Github มี Slide
    สรุปเนื้อหา use case Gemini ทั้ง 3 ประเภท Chat, API และ RAG คืออะไรและมี use case ประมาณไหนบ้าง
  • Random บน Computer สุ่มแบบไหนเราถึงเรียกว่าสุ่ม ?
    มี Video
    เคยสงสัยกันไหมครับ เวลาที่เราทอยลูกเต๋า สุ่มหยิบการ์ดออกจากกอง หรือแม้แต่สุ่มโดยการทอยเหรียญ สิ่งนี้เมื่อย้ายเข้าไปทำงานอยู่บนคอมพิวเตอร์มันทำงานยังไง

Share on social media