- Serverless ไม่ได้หมายความว่าไม่มีเซิร์ฟเวอร์อยู่จริง แต่หมายถึงการใช้เซิร์ฟเวอร์ของคนอื่น
- สถาปัตยกรรม ServerFree เสนอแนวคิดที่สามารถรันโค้ดได้โดยไม่ต้องมีแบ็กเอนด์เซิร์ฟเวอร์ คอนเทนเนอร์ หรือเครื่องเสมือน
- ในสถาปัตยกรรมนี้ โค้ดจะทำงานภายในเบราว์เซอร์ และต้องการเพียงเซิร์ฟเวอร์สำหรับให้บริการไฟล์แบบสแตติก
- สาธิตวิธีแพ็กเว็บแอปพลิเคชันเพื่อให้รันได้ในเบราว์เซอร์
- โค้ดฟรอนต์เอนด์ถูกบิลด์ตามปกติ ส่วนแบ็กเอนด์ถูกแพ็กให้ไปรันใน Web Worker และฐานข้อมูลใช้ SQLite ที่คอมไพล์เป็น WebAssembly
แนวคิด
- ตัดสินใจสร้างโปรเจ็กต์เดโมผ่านคอนเทนต์มาร์เก็ตติ้ง และได้รับแรงบันดาลใจจาก Hacker News ให้สร้างตัวติดตามการสมัครงานที่ได้รับความสนใจในด้านความเป็นส่วนตัว
- โปรเจ็กต์นี้พัฒนาไปสู่กระบวนการสร้างสถาปัตยกรรมใหม่ พร้อมกับการแก้ปัญหาอย่าง Web Worker, ความไม่สอดคล้องของเอกสาร, เอกสารที่ขาดหาย เป็นต้น
ลองครั้งแรกด้วยสถาปัตยกรรมแบบคลาสสิก (ส่วนที่ง่าย)
- ใช้ SubZero CLI เพื่อเปลี่ยนสคีมาฐานข้อมูลและตั้งค่าสิทธิ์สำหรับสร้างแอป
- มีฟังก์ชัน CRUD และการกรองข้อมูล แต่ปรับแต่ง UI ให้ใกล้เคียงผลิตภัณฑ์จริงมากกว่าเดโม
- ย้ายแถบด้านข้างขึ้นไปไว้ด้านบนเพื่อลดพื้นที่ว่างด้านซ้ายที่สูญเปล่า
- เพิ่มคอมโพเนนต์ Show, Create, Edit, List ในหน้า "Opportunities"
- ทำฟลูว์การกรองที่ซับซ้อนได้โดยไม่ต้องแตะโค้ดแบ็กเอนด์
- ปรับปรุงแดชบอร์ดให้แสดงข้อมูลที่เกี่ยวข้อง เช่น "โอกาสที่เปิดอยู่", "ความคืบหน้าเฉลี่ย / การสมัคร", "จำนวนวันเฉลี่ยหลังการสมัคร" เป็นต้น
- สำหรับการดีพลอยขึ้นโปรดักชัน ได้บิลด์ Docker image, seed ฐานข้อมูล และรันคอนเทนเนอร์
- เก็บไฟล์ฐานข้อมูล SQLite ไว้นอกคอนเทนเนอร์เพื่อรักษาข้อมูลให้คงอยู่ต่อเนื่อง
- ใช้ Turso DB เพื่อแก้ปัญหาเรื่องความคงอยู่และการสำรองข้อมูลของฐานข้อมูล SQLite
เปลี่ยนไปใช้สถาปัตยกรรม ServerFree (ส่วนที่สนุก)
- ใช้ SQLite ที่คอมไพล์เป็น WebAssembly เป็นฐานข้อมูล
- ใช้ OPFS (Origin-Private FileSystem) เพื่อจัดเก็บข้อมูล
- รันโค้ดแบ็กเอนด์ใน Web Worker เพื่อป้องกันการบล็อก UI thread
- แทนที่ Express ด้วย itty-router เพื่อให้รองรับการทำงานในเบราว์เซอร์
- ใช้ Service Worker เพื่อดักจับและจัดการคำขอระหว่าง UI กับแบ็กเอนด์
- ทำให้การสื่อสารระหว่าง Service Worker และ Web Worker ผ่าน main thread มีความเสถียร
- ลบโค้ดที่เกี่ยวข้องกับการยืนยันตัวตนออกจาก main thread (UI)
- จัดเก็บข้อมูลไว้ในคอมพิวเตอร์ของผู้ใช้ และจะไม่ถูกส่งไปยังเซิร์ฟเวอร์
บทสรุป
- สถาปัตยกรรมนี้มีประโยชน์อย่างยิ่งในกรณีที่ข้อมูลลูกค้าเป็นอิสระต่อกันและไม่จำเป็นต้องแชร์ระหว่างผู้ใช้
- เนื่องจากไม่มีแบ็กเอนด์เซิร์ฟเวอร์ จึงช่วยลดค่าโฮสติ้ง เสริมความเป็นส่วนตัวของข้อมูล และเพิ่มความปลอดภัย
- สามารถใช้เครื่องมืออย่าง Electric เพื่อซิงก์ฐานข้อมูลบางส่วนมายังไคลเอนต์ และจัดการคำขอ/คิวรีบางส่วนภายในเบราว์เซอร์ได้
1 ความคิดเห็น