Cache คืออะไร
โดย
ในยุคที่ผู้ใช้ต้องการความเร็ว "เว็บที่โหลดช้าเพียง 1 วินาที อาจทำให้คุณเสียลูกค้าไปถึง 7%" การใช้ Cache จึงกลายเป็นเทคนิคพื้นฐานที่ช่วยให้เว็บโหลดเร็วขึ้นแบบทันที โดยไม่ต้องอัปเกรดเซิร์ฟเวอร์ หรือ เปลี่ยนโค้ดทั้งระบบ
- ★Cache คืออะไร
Cache คือ "ที่เก็บข้อมูลชั่วคราว" ที่ช่วยให้เว็บไซต์สามารถดึงข้อมูลที่ถูกเรียกบ่อยๆ มาแสดงผลได้ทันที โดยไม่ต้องประมวลผลใหม่ทุกครั้ง
- ★Cache ทำงานอย่างไร
1. ผู้ใช้คนแรกเข้าถึงเว็บ → เซิร์ฟเวอร์ประมวลผล และ เก็บผลลัพธ์ไว้ใน Cache
2. ผู้ใช้คนถัดมาเข้าถึงหน้าเดิม → ดึงข้อมูลจาก Cache ทันที โดยไม่ต้องคำนวณใหม่
3. ข้อมูลใน Cache จะถูกอัปเดทตามระยะเวลาที่กำหนด
ตัวอย่างชีวิต : เหมือนการเตรียมอาหารสำเร็จไว้ในตู้เย็น (Cache) แทนที่จะทำใหม่ทุกครั้งที่มีคนสั่ง
- ★4 ประเภท Cache ที่ทำให้เว็บโหลดเร็วขึ้น
☆ 1. Browser Cache
- เก็บข้อมูลในเครื่องผู้ใช้ : รูปภาพ, CSS, JavaScript
- วิธีตั้งค่า : ผ่าน HTTP Headers เช่น `Cache-Control: max-age=31536000`
- ผลลัพธ์ : ผู้ใช้กลับมาเว็บครั้งที่ 2 โหลดเร็วขึ้น 50-80%
☆ 2. Server Cache
- ระดับการทำงาน :
○ Page Cache : เก็บทั้งหน้าเว็บ
○ Object Cache : เก็บผลลัพธ์ Database
- ตัวอย่างปลั๊กอิน : WP Rocket (WordPress), Varnish (เซิร์ฟเวอร์ระดับ)
☆ 3. CDN Cache
- เก็บข้อมูลในเซิร์ฟเวอร์กระจายตัวทั่วโลก
- เหมาะสำหรับ : รูปภาพ, วิดีโอ, ไฟล์สคริปต์
- บริการแนะนำ : Cloudflare, BunnyCDN
☆ 4. Database Cache
- เก็บผลลัพธ์ Query ที่ใช้บ่อย
- เทคโนโลยี : Redis, Memcached
- ลดเวลา Query : จาก 2 วินาที → 0.02 วินาที
- ★ผลลัพธ์ที่วัดได้หลังการใช้ Cache
☆ 1. เวลาโหลดหน้าแรก
- ก่อนใช้ Cache : 4.2 วินาที
- หลังใช้ Cache : 1.1 วินาที
- การปรับปรุง : ลดลง 73% (เร็วขึ้นกว่า 3 เท่า)
☆ 2. จำนวน Request
- ก่อนใช้ Cache : 150 ครั้ง
- หลังใช้ Cache : 40 ครั้ง
- การปรับปรุง : ลดลง 73% (ประหยัดทรัพยากรเครือข่าย)
☆ 3. การใช้งาน CPU เซิร์ฟเวอร์
- ก่อนใช้ Cache : 80%
- หลังใช้ Cache : 30%
- การปรับปรุง: ลดลง 50% (เซิร์ฟเวอร์ทำงานเบาลง)
☆ 4. ปริมาณ Bandwidth ที่ใช้
- ก่อนใช้ Cache : 2.5 GB/วัน
- หลังใช้ Cache : 1.2 GB/วัน
- การปรับปรุง : ลดลง 52% (ประหยัดค่าใช้จ่าย)
- ★วิธีตั้งค่า Cache สำหรับเว็บไซต์
☆ สำหรับ WordPress
1. ติดตั้งปลั๊กอิน Caching เช่น WP Rocket หรือ LiteSpeed Cache
2. เปิดใช้งาน Browser Caching และ Page Caching
3. ตั้งค่า Cache Lifespan ที่เหมาะสม (แนะนำ 1-30 วัน)
☆ สำหรับเว็บทั่วไป
เพิ่มโค้ดใน `.htaccess`:
```apache
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access 1 year"
ExpiresByType text/css "access 1 month"
ExpiresByType application/javascript "access 1 month"
</IfModule>
```
☆ สำหรับ Developer
```javascript
// Service Worker สำหรับ Caching แบบ PWA
self.addEventListener('install', function(event) {
event.waitUntil(
caches.open('v1').then(function(cache) {
return cache.addAll([
'/styles/main.css',
'/scripts/app.js'
]);
})
);
});
```
- ★ข้อควรระวังเมื่อใช้ Cache
1. อย่า Cache ข้อมูล Real-time เช่น จำนวนสต็อกสินค้า
2. ตั้งค่า Clear Cache อัตโนมัติ เมื่ออัปเดทเนื้อหา
3. แบ่งประเภทไฟล์ให้เหมาะสม :
- Cache นาน: รูปภาพ, ไฟล์ CSS/JS
- Cache สั้น: หน้าเพจทั่วไป
- ไม่ Cache: หน้าสมาชิก, ตะกร้าสินค้า
✏️ Shoper Gamer
Credit :
👇
- ●https://grappik.com/boost-website-speed-simple-tips/
- ●https://sennalabs.com/blog/why-websites-should-cache-correctly-cache-equals-consistent-speed
- ●https://xn--22ce0dhf8bc8b8fxa3j.com/advanced-caching-speed-up-website/
- 2
ดูเพิ่มเติมในซีรีส์
โฆษณา
- ดาวน์โหลดแอปพลิเคชัน
- © 2025 Blockdit
