ทำความรู้จักกับ MPA & SPA Website

ทำความรู้จักกับ MPA & SPA Website

สวัสดีครับวันนี้เราจะมาทบทวนบทเรียนเก่ากันซักหน่อย สำหรับใครหลายๆ คนที่ยังไม่รู้จักกันก็อาจจะได้ความรู้ใหม่ๆ กลับไปครับ แต่สำหรับใครหลายๆ คนที่รู้จักกันไปแล้วถือว่ามาอ่านแก้เบื่อกันไปนะครับ เราจะเริ่มจากตัวที่เราคุ้นเคยกันมากที่สุดก่อนนะครับ

MPA ( Multi Page Application ) คืออะไร ?

MPA คือ การออกแบบโครงสร้าง website ออกเป็นส่วนๆ แยกตามหน้าที่ของแต่ละหน้า เช่น index , login , dashboard เป็นต้น เมื่อมีการเปลี่ยน path ไป server จะทำการ rander ข้อมูลใหม่ และแสดงผล

ในการส่ง request เพื่อ render แต่ละครั้ง Client จะส่งข้อมูลเข้าไปให้ server ประมวลผล และ server จะส่งกลับและทำการ rander ต่อไปเป็นลำดับ

ภาษาที่ใช้ส่วนใหญ่ PHP, ASP, Ruby

ข้อดีของ MPA

• ในการออกแบบระบบที่มีขนาดใหญ่ MPA จะออกแบบได้ง่ายกว่า เพราะการจัดการแบ่งออกเป็นส่วนๆ

• สามารถปรับแต่งความเหมาะสมของ SEO ได้อย่างมีประสิทธิภาพ

• การจัดการที่เกี่ยวข้องกับ Security สามารถทำการ Validate ที่ Server ได้ง่าย

• ไม่ต้องจำเป็นต้องแยก Back-end และ Front-end เพราะสามารถ Select ข้อมูลจาก database มา rander ใน HTML ได้เลย

ข้อเสียของ MPA

• ทำเป็น Cross platform ได้ยากลำบาก ซึ่งไปเขียน SPA จะดีกว่า

• MPA โดยทั่วไปจะใช้งบประมาณไม่สูงเพราะมี technology ที่รองรับอยู่แล้ว รวมไปถึงนักพัฒนาที่คุ้นเคย ก็มีเยอะอยู่แล้ว (แล้วแต่กรณี)

SPA ( Single Page Application ) คืออะไร ?

SPA คือ การออกแบบโครงสร้าง website ให้มี pages ที่เป็นตัวกลางหนึ่งตัวที่สามารถเรียกส่วนต่างๆ เข้ามาใช้งานได้ การทำงานลักษณะนี้ทำไปเพื่อลด process ในการ rander หน้า website ยกตัวอย่าง หน้า default เรียกหน้า index เมื่อมีการเปลี่ยน path จะเรียกหน้า dashboard โดยไม่ทำการ rander ใหม่ (refresh) เป็นต้น เพื่อให้เกิดความเข้าใจดูภาพตัวอย่างกันครับ (ส่วนมากใช้ภาษา JavaScript)

ข้อดีของ SPA

• มี User Experience ที่ดีกว่า

• การตอบสนองของ website มีความรวดเร็ว

• สามารถพัฒนาฟีเจอร์ได้หลากหลาย เพราะการจัดการของข้อมูลเรียกใช้งานด้วย API ที่แยกออกจากตัวแสดงผล

• ใช้ bandwidth น้อย เพราะ ทำการเรียก API เพื่อให้ได้ผลลัพธ์ที่เพียงพอต่อการแสดงผลบนหน้าเว็บ

ข้อเสียของ SPA

• ผู้ใช้ต้องทำการเปิดใช้งาน Javascript ที่ฝั่ง client เท่านั้นจึงจะใช้งานได้อย่างเต็มประสิทธิภาพ

• ถ้าพัฒนาได้ไม่ดี อาจจะเกิด Memory leaks ใน JavaScript ได้และจะทำให้ performance ของ application drop หรือ crash

• เนื่องจากการทำ SPA เป็นการทำงานเพียงหน้าเดียว เราจะต้องควบคุม Security ให้ดี ซึ่งจะแตกต่างกับการเขียนเว็บแบบ MPA ที่เราสามารถพึ่งพา server ได้

สรุป

การจะเลือกใช้ SPA หรือ MPA ในการพัฒนานั้นควรคำนึงถึงส่วนประกอบต่างๆ ตามความเหมาะสม ถึงแม้ SPA จะมี User Experience ที่ดีและหลากหลายมาก แต่ก็มีข้อจำกัดอีกหลายอย่าง ที่การพัฒนาแบบ MPA โดดเด่นกว่า ที่สำคัญประสบการณ์ในการพัฒนาจะบอกเราเองว่าเราควรเลือกใช้อะไร และเมื่อไหร่

แหล่งอ้างอิง

เว็บแบบ SPA คืออะไร ? - 8columns ปัจจุบัน เรามักได้ยิน คำว่า เว็บแบบ SPA บ่อยขึ้น แต่เชื่อว่า ยังมีอีกหลายคน ที่ยังไม่รู้ ว่ามันคืออะไร คำว่า SPA…8columns.com

MPA (Multi Page Application) คืออะไร | ITTHIPAT MPA คือการที่เรามีเว็บไซต์หลายๆหน้าและแยกไฟล์กัน เป็นที่มาของคำว่า Multi Page ซึ่งต่างจาก SPA ที่มีแค่หน้าเดียว MPA…itthipat.me

ใช้ SPA หรือ MPA กับ project ดี? เวลาที่มี Project ใหม่เข้ามา การเลือกใช้ Technology stack ก็มีความสำคัญมาก บางครั้งนักพัฒนาอย่าง เรา ๆ…medium.com