Please use this identifier to cite or link to this item: https://cuir.car.chula.ac.th/handle/123456789/77241
Title: การประยุกต์ใช้ไมโครฟรอนต์เอนส์กับการปรับโครงสร้างใหม่ซิงเกิลเพจแอปพลิเคชัน
Other Titles: Application of microfrontends to reengineering single page application
Authors: ณัฐพร นพปฎล
Advisors: ญาใจ ลิ่มปิยะกรณ์
Other author: จุฬาลงกรณ์มหาวิทยาลัย. คณะวิศวกรรมศาสตร์
Issue Date: 2563
Publisher: จุฬาลงกรณ์มหาวิทยาลัย
Abstract: สถาปัตยกรรมระบบซอฟต์แวร์ปกติมักแบ่งแยกเป็นส่วนหน้าและส่วนหลัง โดยที่แบ็กเอนด์มีหน้าที่ในการประมวลผลข้อมูลทางฝั่งเซิร์ฟเวอร์ ในขณะที่ฟรอนต์เอนด์รับผิดชอบการโต้ตอบระหว่างไคลเอนต์และระบบ บรรดาแนวทางสถาปัตยกรรมแบ็กเอนด์ในปัจจุบัน ไมโครเซอร์วิสเป็นทางเลือกหนึ่งที่เหมาะสมที่สุดสำหรับระบบที่สามารถขยายได้ ในขณะเดียวกัน แอปพลิเคชันฝั่งไคลเอนต์ก็เติบโตขึ้นตามขนาดและความซับซ้อนเช่นกัน แนวคิดไมโครฟรอนต์เอนส์ได้ปรากฏขึ้นเป็นวิวัฒนาการทางตรรกของสถาปัตยกรรมฝั่งฟรอนต์เอนด์ของเว็บแอปพลิเคชัน คล้ายคลึงกับไมโครเซอร์วิส แนวคิดทั้งสองมีประโยชน์ต่อการพัฒนาระบบพร้อมกัน นอกเหนือจากสมรรถนะที่เพิ่มขึ้นอันเป็นผลมาจากการแบ่งแยกแอปพลิเคชันขนาดใหญ่ออกเป็นส่วนเล็กๆ วิทยานิพนธ์นี้นำเสนอการประยุกต์ใช้ไมโครฟรอนต์เอนส์สำหรับการพัฒนาเว็บไซต์โปรแกรมสืบค้นทางกฎหมายเป็นกรณีศึกษา เนื่องจากโปรแกรมสืบค้นโดยปกติทั่วไปจัดเป็นโครงการซอฟต์แวร์ขนาดใหญ่ การพัฒนาเป็นซิงเกิลเพจแอปพลิเคชันจึงมีแนวโน้มที่จะไม่สามารถรองรับงานที่มีปริมาณมากขึ้น ระบบขยายตัวไม่ได้ดี และค่าใช้จ่ายบำรุงรักษาสูง การออกแบบฝั่งไคลแอนต์บนพื้นฐานไมโครฟรอนต์เอนด์ผนวกกับเทคโนโลยีแบ็กเอนด์แบบไมโครเซอร์วิสได้ถูกนำเสนอในงานวิจัยนี้ สำหรับการประเมินผล ความต้องการใหม่ของหน้าเว็บ รายละเอียดเอกสาร ได้ถูกพัฒนาขึ้นด้วยแองกูลาร์และเพิ่มเข้าไปในระบบปัจจุบันที่เป็นซิงเกิลเพจแอปพลิเคชัน เพื่อเปรียบเทียบกับการพัฒนาฟีเจอร์ดังกล่าวด้วยไมโครฟรอนต์เอนด์ ตัววัดทั้งสามที่ถูกเลือกสำหรับการประเมินสมรรถนะประกอบด้วย ความขึ้นต่อกันของคอมโพเนนต์ เวลาการพัฒนา และเวลาการทดสอบ ผลลัพธ์ค่าการวัดรายงานค่าตัววัดทั้งสามตัวที่ลดลงเมื่อพัฒนาด้วยไมโครฟรอนต์เอนด์ อย่างไรก็ตาม ทีมงานมีความรู้สึกว่าต้องใช้ความพยายามมากขึ้นกับการพัฒนาแบบใหม่ด้วยไมโครฟรอนต์เอนด์
Other Abstract: Software systems are traditionally separated into front and rear architecture. The backend is responsible for data processing on server side, while the frontend accounts for interaction between clients and a system. Among several today backend architectural approaches, Microservices is an alternative most suitable for scalable systems. Meanwhile, the client-side applications are also growing with size and complexity. The concept of Micro-frontends has recently emerged as logical evolution of architecture for frontend side of web applications. Similar to Microservices, both concepts benefit concurrent development in addition to greater performance that result from partitioning large applications into smaller parts. This thesis presents an application of Micro-frontends to Thai legal search engine web development as a case study. Since search engines are typically large-scale software projects, single page applications tend to bloat up, not well-scaled, and costly maintain. A design of the client-side based on Micro-frontends combined with the backend technology, Microservices, is introduced in this research. For evaluation, the new requirement of Document Detail webpage is implemented with Angular and added to the current system considered as single page application. The new feature is also implemented with Micro-frontends for comparison. The three measures: component dependency, development time, and test time are selected for performance evaluation. The results report that the measurement values of component dependency, development time, and test time all decrease with Micro-frontends implementation. However, the team feel that they spent more effort with the novel Micro-frontend development.
Description: วิทยานิพนธ์ (วท.ม.)--จุฬาลงกรณ์มหาวิทยาลัย, 2563
Degree Name: วิทยาศาสตรมหาบัณฑิต
Degree Level: ปริญญาโท
Degree Discipline: วิศวกรรมซอฟต์แวร์
URI: http://cuir.car.chula.ac.th/handle/123456789/77241
URI: http://doi.org/10.58837/CHULA.THE.2020.1136
metadata.dc.identifier.DOI: 10.58837/CHULA.THE.2020.1136
Type: Thesis
Appears in Collections:Eng - Theses

Files in This Item:
File Description SizeFormat 
6270085221.pdf1.92 MBAdobe PDFView/Open


Items in DSpace are protected by copyright, with all rights reserved, unless otherwise indicated.