Vue.js นั้นดี แต่มันดีกว่า Angular หรือ React ยังไง?
แปลจาก : http://www.valuecoders.com/blog/technology-and-apps/vue-js-comparison-angular-react/
Vue.js เป็น JavaScript Library สำหรับการสร้างอินเตอร์เฟซเว็บ โดยผสมผสานกับเครื่องมืออื่นๆ จนมันกลายเป็น “Framework” ตอนนี้ จากบล็อกล่าสุดของเรา ที่คุณทราบอยู่แล้วว่า Vue.js เป็นหนึ่งใน Framework ของ JavaScript และมันจะแทนที่ Angular และ React ในหลายกรณี
ในกรณีที่คุณยังไม่เคยได้ยินหรือใช้ vue.js มาก่อน คุณอาจจะคิดว่า “ไม่เอาน่า! JavaScript Framework อื่นอีกแล้วหรือ เราเข้าใจแล้วก็ได้…” อย่างไรก็ตาม Vue.js ไม่ใช่เรื่องใหม่ มันเปิดตัวครั้งแรกในปี 2013 และตอนนี้ก็มี 38,706 ดาว บน Github และจำนวนดาวน์โหลดในปีนี้ ดูได้จากภาพด้านล่าง
ด้วยเหตุนี้ Vue.js จึงเป็นของใหม่และได้รับความนิยมไม่น้อยเมื่อเทียบกับ Framework ตัวอื่นๆ ตามอายุของมัน ตอนนี้เรามาดูสิ่งที่เป็นปัจจัยที่ Vue.js ชนะ
ทำไม Vue.js ถึงพิเศษ?
ประโยชน์ที่ยิ่งใหญ่ที่สุดของ Vue คือมันไม่มีการสืบสายเลือด มันมีความสดใหม่และมีความเบา มันได้เรียนรู้จากความผิดพลาดและความสำเร็จของ React และ Angular อย่างที่เราเห็น Vue มีน้ำหนักเบาและง่ายต่อการเรียนรู้
มีเอกสารที่ค่อนข้างพื้นฐาน แต่พวกเขาทำออกมาได้ดี และไม่จำเป็นต้องอาศัยการเรียนรู้มากเมื่อเทียบกับ Angular มันจึงเป็นสิ่งที่ดีและมีประสิทธิภาพที่สุดประทับใจ PageKit, Python China เป็นสองโครงการที่ใช้ Vue จำนวนมาก นอกจากนี้ มันยังมี two way data binding เพื่ออำนวยความสะดวกเหมือน Angular และ Virtual DOM ของ React
ตอนนี้ เราหวังว่าแนวคิดพื้นฐานเกี่ยวกับ vue.js ของคุณค่อนข้างชัดเจน ดังนั้น เรามาเปรียบเทียบกับ Angular และ React เราจะเริ่มด้วย Angular
Angularjs vs Vue.js
ในขณะที่กำลังเปรียบเทียบสองอย่างนี้ เราจะให้ Angular เป็นช้างแมมมอธ และ Vue เป็นเสือที่หิวกระหายมากพอที่สามารถจะเป็นใหญ่ได้ในไม่ช้า อย่างไรก็ตามก็มีหลายเหตุผลที่นักพัฒนาจะเปลี่ยนมาใช้ Vue คุณ Evan you ที่เป็นเจ้าของ Vue อธิบายเหตุผลไว้ชัดเจน
“Vue.js มีความยืดหยุ่นมาก มีการแก้ปัญหาการยึดตัวเองเป็นหลักน้อย (น้อยกว่า Angular) ที่ช่วยให้คุณสามารถสร้างโครงสร้างแอปของคุณในแบบที่คุณต้องการ แทนที่จะถูกบังคับให้ทำทุกอย่างแบบ Angular มันเป็นแค่ชั้นอินเตอร์เฟซเพื่อให้คุณสามารถใช้ Feature เบาๆในเพจ แทนที่จะใช้ SPA แบบเต็มๆ ”
ตอนนี้ให้ดู Code บางอย่างซึ่งจะให้ข้อมูลเชิงลึกพื้นฐานบางอย่าง (credits: fadeit.dk)
มีเครื่องมือมากมายใน Angularjs และ Syntax ที่ซับซ้อนมากมาย มันสามารถทำให้คุณสับสนได้ในบางครั้ง อีกด้านหนึ่ง Vue.js นั้นเรียบง่ายกว่า Angular และบางครั้งมันดีกว่า ถ้าคุณมีความกังวลเกี่ยวกับอนาคตของ Framework นี้ วางใจได้ มันอยู่มานาน และไม่ได้หายไปไหนเป็นเวลา 2 ปี
Reactjs vs Vue.js
React และ Vue.js มีคุณสมบัติที่คล้ายกัน
1. ใช้ประโยชน์จาก Virtual DOM
2. ให้ความตอบสนอง และสามารถเขียน Components ได้
3. ให้ความสำคัญกับ Core Library ด้วยความระมัดระวัง เช่น routing และมีการบริหารแบบ global state จัดการโดย companion libraries
ในที่นี้จะระบุว่า React และ Vue.js มีคุณลักษณะที่ชาญฉลาด ดังนั้นเราจะเปรียบเทียบทั้งสอง Framework จากมุมมองของนักพัฒนาด้วยวิธีการง่ายๆบางอย่างสำหรับแต่ละ Framework มาดูกันว่าจะเกิดอะไรขึ้นในการเปรียบเทียบระหว่าง Vue.js และ Reactjs
Hello World
วิธีการที่ React ทำ
วิธีการที่ Vue ทำ
Image: anyonecanlearntocode.com
มันง่ายมาก ด้วยการใช้ Tag เดียวและ Running นี่คือประโยชน์จากคุณสมบัติของ Vue โดยไม่ต้องเรียนรู้เทคโนโลยีใหม่ใดๆ
Two way Data Binding
วิธีการที่ React ทำ
วิธีการที่ Vue ทำ
Image: rlafranchi.github.io
Two way binding ใน Vue.js ค่อนข้างง่ายเมื่อคุณใช้ v-model ใน React มันต้องใช้ code ที่ยาวมาก
การวนซ้ำ
วิธีการที่ React ทำ
วิธีการที่ Vue ทำ
Image: rlafranchi.github.io
ในกรณีนี้ด้วย Vue ชนะด้วยบรรทัดและจำนวน code ที่น้อยกว่า
ตัวอย่างเหล่านี้หมายความว่า Vue.js นั้นง่ายในการเรียนรู้ และสามารถสร้างได้ทันที นอกจากนี้ยังมีเส้นทางที่เรียบง่าย ด้วยเครื่องมือใหม่ๆ และรูปแบบการจัดการ codebases ขนาดใหญ่ Vue.js สามารถเพิ่มพูนความรู้ของคุณ เพื่อให้คุณสามารถเริ่มต้นเรียนรู้ปรับปรุงเครื่องมือและวิธีปฏิบัติที่ดีที่สุด
Angularjs vs Vue.js vs Reactjs
นี่เป็นตารางที่จะให้คุณบางข้อมูลที่มีค่าเกี่ยวกับ Framework ทั้งสามตัว
สรุป
ในวันนี้ Vue ไม่เป็นที่นิยมเท่า React (ดูแลโดย Facebook) หรือ Angular 2 (สนับสนุนโดย Google) อย่างไรก็ตาม นักพัฒนาจำนวนมากกำลังจะสลับไปใช้ Vue กันมากขึ้น Laravel community ถือว่านี่เป็นหนึ่งใน Front-end Framework ที่แนะนำ
“โดยรวมแล้ว Vue ได้ให้คำตอบของปัญหาของ React และ Angular และจะช่วยให้คุณเขียน code ได้ง่ายขึ้น”
