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 ได้ง่ายขึ้น”
One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.