Flutter Framework เครื่องมือที่ประสิทธิภาพในการสร้าง native app แบบหลาย platform

Flutter Framework เครื่องมือที่ประสิทธิภาพในการสร้าง native app แบบหลาย platform

เมื่อเราต้องการจะสร้าง UI ที่มีคุณภาพดีในมือถือ เราจำป็นต้องเลือกเครื่องมือที่ตอบโจทย์เพื่อทำให้ process นั้นง่ายขึ้น ในทางตรงกันข้าม ถ้าเราเลือกผิดจะทำให้สถานการณ์แย่ลงและอาจกลายเป็นสาเหตุของความล้มเหลวได้เลย ผู้เขียนพนันได้เลยว่าไม่มีใครอยากเริ่มทำใหม่ตั้งแต่แรกอยู่แล้ว นี่จึงเป็นเหตุผลที่คุณควรใส่ใจกับ UI framework ที่มีความ advanced ในการพัฒนาแอพอย่าง Flutter

เรามาลองดูกันว่า ทำไม framework ตัวนี้ถึงมีความคุ้มค่าในการใช้พัฒนาแอพ และ ประสิทธิภาพของมันเป็นอย่างไร

Flutter คืออะไร?

เมื่อเปลายเดือนกุมภาพันธ์ ปี 2018  google เปิดตัว flutter framework แบบ beta เวอร์ชันแรก นี่เป็น เครื่องมือ การสร้าง native interface สำหรับ android และ iOS และในเดือนสิงหาคม ปี 2019 ก็ได้ออกเวอร์ชัน 1.7.8 เป็นเวอร์ชันล่าสุด ณ ตอนนี้

อะไรทำให้ Flutter เป็น Framework ที่วิเศษมากขนาดนั้น  เพราะว่า framework สามารถพัฒนา native app แบบ cross-platform ได้ การรวบรวมข้อมูล Native ให้ตัวประมวลผล ARM นั้น ช่วยให้การพัฒนาง่ายขึ้น มีการ render ที่ง่ายขึ้น พวกชุดเครื่องมือ, widgets, และ features ก็มีส่วนช่วยให้ process นั้นง่ายขึ้นเช่นกัน แล้วมีอะไรเพิ่มเติมอีกล่ะ นอกจากการเป็น Framework แบบ open source ก็อย่างที่บอกไปที่ว่ามันเป็นแบบ open source  Developer ที่ไหนก็สามารถ แก้ไขงานใน Frame work ที่ GitHub ได้แบบ real-time  ดังนั้น Developer จึงมีส่วนช่วยพัฒนาให้ Flutter นั้นดีขึ้น

flutter app design

ในด้านของ features นั้น หนึ่งใน feature ที่น่าสนใจทีสุดเลยก็คือ ปุ่ม Hot reload ถ้าคุณกดปุ่มนี้ การเปลี่ยนแปลงทั้งหมดที่เขียนภายใน code จะปรากฎขึ้นที่หน้าจอทันที เราจึงสามารถปรับแต่ง ตัว UI ได้อย่างง่ายดาย แต่มันก็มี surprise อย่างหนึ่งที่ไม่เหมือน framework อื่นๆของ google คือ framework ตัวนี้ใช้ Dart ในการพัฒนาแอพ

Flutter เวอร์ชันล่าสุดมีอะไรดีบ้าง?

  • DevTools เป็นเครื่องมือที่ใช้แก้ bug ได้ดีใน Flutter และ Dart  ผู้พัฒนาสามารถ วิเคราะห์ layout และ state ในแอพได้ สามารถแก้ปัญหาเกี่ยวกับความจำ ใน Flutter appได้ หรือว่าปัญหา command line ใน Dart  และแก้ไข bug อื่นๆอีกมากมาย
  • Widget ใหม่ google ให้ความสนใจกับ widget อย่างมาก เพื่อให้ผู้ใช้ ใช้งานได้อย่างมีประสิทธิภาพ Flutter เวอร์ชันล่าสุด ได้สร้าง Slider ตัวใหม่มา เพื่อสร้าง range ที่ดูดี ตัวอย่างเช่นเมื่อผู้ใช้ต้องการจะเปลี่ยนช่วงราคาในแอพ mCommerce พวกเขาจึงต้องใช้ widget ที่ดึงความสนใจได้
  • plugin ที่สามารถซื้อในแอพได้เลย ตอนนี้ มีการเพิ่ม plugin ใหม่ใน Flutter ที่สามารถใช้ซื้อสิ่งต่างๆได้ใน แอพ
  • รองรับ AndroidX google ได้มีการ support Android มากขึ้น โดยการนำ Android x เข้ามาใช้ ทำให้การสร้างแอพมีประสิทธิภาพมากขึ้น
  • รองรับ Android bundles ในเดือนสิงหาคม ปี 2019 แอพทั้งหมดที่สร้างสำหรับ Android pie ต้องรองรับในทั้งเวอร์ชัน 32-bit and 64-bit ใน Google play store
  • Fonts ใหม่ UI ในเวอร์ชั่นล่าสุดนั้น มีการออกแบบตัวพิมพ์ใหม่ทีเพิ่มตัวเลขและตัวอักษร ใหม่ๆหลาย style ขึ้นมา การ Interaction กับ fonts ใน iOS ก็ได้รับการพัฒนาเช่นกัน

ทำไมถึงต้องใช้ Flutter ถ้าคุณต้องการจะสร้างแอพแบบ cross-platform

Flutter สามารถจัดการไฟล์ที่ไม่เป็นระเบียบได้ในโหมด Development การรวบรวม Jit ช่วยให้การพัฒนาและการแก้ bug นั้นเร็วขึ้น นอกจากนั้น Framework ตัวนี้ยังรองรับ plugins หลายๆอย่างๆ เช่น Firebase หรือ SQLite   Pub.dev จะช่วยหา plugins ที่คุณต้องการ  Flutter ยังมีความคล้ายคลึงกับองค์ประกอบของภาษาในการเขียนโปรแกรมมาตรฐานอีกด้วย

อีกเหตุผลหนึ่งที่ควรใช้ Flutter ก็คือ Developer จะสามารถทำงานได้ทั้งใน Web และ Desktop แค่ลองคิดภาพดูว่าทีมของเราจะสร้าง app ที่สามารถรันได้ทั้งใน Android, iOS, Web, MacOS, Linux, และ Windows ฟังเหมือนฝันไปเลยใช่ไหมล่ะ

อย่างไรก็ตาม google กำลังสร้างระบบปฏิบัติการใหม่ ชื่อว่า Fuchsia  UI ของมัน ถูกสร้างจาก Flutter แต่ผู้เขียนคิดว่าระบบปฏิบัติการใหม่ควรเป็นหัวข้อในบทความใหม่ แต่ถ้าอยากรู้เกี่ยวกับ Fuchsia OS มากขึ้นก็ไปดูได้ที่เว็บไซต์หลักเลย

Flutter ทำงานอย่างไร?

อย่างที่ได้บอกไว้ว่า แอพที่ใช้ Flutter สร้างสามารถใช้ได้ใน iOS, Android, พร้อมกับ Desktop และใน Website ได้ แต่ tool ที่ใช้ทำมีลักษณะที่แตกต่างจาก UI framework ทั่วๆไปสำหร้บระบบปฏิบัติการทั้งสอง ในความเป็นจริงแล้ว แอพใน Web และ Desktop ยังเร็วเกินไปที่นำมาใช้ ดังนั้น Flutter ก็ยังคงได้รับการพัฒนาต่อไป

ui flutter

Guide ในการเปลี่ยนจากแอพ iOS เป็น Android ดูได้ที่นี่

Flutter ไม่ได้ compiled โดยตรงไปที่ Android หรือ iOS เลย แอพจะเปิดขึ้นได้ด้วยการทำงานร่วมกันของ rendering engine สร้างจาก C++ และ ใช้ Flutter Design UI  ที่สร้างจาก Dart ไฟล์ทั้งหมดที่ถูกสร้างด้วยวิธีนี้ก็จะอยู่ในแอพแต่ละแอพ และในแต่ละแอพก็จะมี SDK assemblies สำหรับ platform โดยเฉพาะ

นี่อาจส่งผลต่อขนาดของแอพที่สร้างจาก Flutter โดยที่มันอาจจะกินพื้นที่เยอะกว่าแอพปกติ อย่างไรก็ตามประสิทธิภาพของแอพดังกล่าวนั้นดีกว่าแอพทั่วไป การ render อาจจะทำให้เร็วขึ้นสูงถึง 120 FPS เลยทีเดียว

สิ่งใหม่ๆที่คาดหวังจาก Flutter ในอนาคต

  • แอพพลิเคชันที่มีอยู่แล้วจะมีการเพิ่ม Flutter screens เข้าไปด้วย
  • APIs ตัวใหม่จะไม่ซับซ้อนใน Navigation และการกำหนัดเส้นทางต่างๆ
  • แพลตฟอร์ม Firebase จะกลายเป็นแพลตฟอร์มที่จะได้รับการพัฒนาและแก้ไขเพิ่มเติม
  • Engine หลักจะมีขนาดลดลง

ข้อดีของ Flutter

benefits of flutter

Hot Reload

Feature นี้นอกจากจะช่วยให้ Developer ทำงานเร็วขึ้น มันเป็นเครื่องมือที่ฉลาด ถ้าคุณต้องการจะเปลี่ยนบางอย่างใน Data ของคุณในการสร้าง app interface คุณสามารถเปลี่ยนแปลงภายใน code ขณะที่ Software กำลังดำเนินการอยู่ การเปลี่ยนแปลงทุกอย่างก็จะปรากฎให้เห็นในแอพเลย ราวกับว่าคุณกำลังสร้าง website ในการเปิดใช้งาน เพียงแค่กดปุ่ม Hot reload

กรพัฒนาที่รวดเร็ว

นอกจากจากปุ่ม Hot reload แล้วยังมี widgets, ตัวควบคุม และ libraries จำนวนมากที่คุณสามารถปรับแต่งได้เองตามที่คุณต้องการ และกระบวนการการพัฒนา UI ของมันยังมีความรวดเร็วมากๆอีกด้วย

Screen reader

เป็น Software ชนิดหนึ่งสำหรับ Developer ที่มีปัญหาเกี่ยวกับตาหรือว่าการมองเห็น มันช่วยโดยการบอกด้วยเสียงหรือว่าใช้ signals

การ REnder ที่รวดเร็ว

เนื่องจากมีการ Render ที่เร็ว จึงสามารถสร้าง รูปและ โมเดล 2D ได้เร็วขึ้น

Cross-platform

Flutter ทำให้เราสามารถสร้าง UI ที่ใช้ได้ใน iOS และ Android ด้วยความช่วยเหลือของหลายๆเครื่องมือ อย่างเช่น intelliJ, Android Studio และ Visual Studio Code

Open source และฟรี

สิ่งเดียวที่ Developers ควรมีคือ ความต้องการในการพัฒนาแอพ เพราะ Flutter นั้นไม่มีข้อจำกัดในการใช้ ไม่มีค่าใช้จ่ายเพิ่มเติม ทุกคนสามารถใช้งานได้เลย

Themes

Themes และ Flutter UI ที่หลากหลาย ทำให้ Developers สามารถสร้างทีมที่ไเม่เหมือนกันให้กับ Android และ iOS

 

แล้วข้อเสียของ Flutter ล่ะ?

flutter drawbacks

รองรับแค่ใน Mobile

ตอนนี้ Flutter ทำงานได้แค่ในแอพมือถือเท่านั้น ยังไม่มี web browser ที่รองรับ แต่มันก็เป็นเรื่องของเวลา เดี๋ยวข้อเสียนี้จะหายไปในไม่ช้า แต่ก็ยังต้องรอต่อไป

ไม่ค่อยมีคนนิยมใช้ Dart

ไม่เหมือนกับพวก Java หรือ Kotlin ซึ่งเป็นภาษาส่วนใหญ่ที่คนนิยมใช้พัฒนาแอพกัน Dart ยังไม่มีความนิยมเท่าไร นั่นคือเหตุผลที่ Developers ส่วนใหญ่ภาษาใหม่ๆ เพราะมีคนที่ใช้ Java เป็นประจำอยู่แล้ว และ UI Frame ที่มีอยู่หลายหลายก็เพียงพอสำหรับพวกเขาอยู่แล้ว อย่างไรก็ตาม Dart นั้นมีข้อดีมากกว่า Java ในการพัฒนาแอพ แต่ก็ยังน้อยกว่า Kotlin ในขณะเดียวกัน ฟังก์ชัน ของ Flutter เช่น Ho Reload จะไม่ทำงานถ้าหากไม่มี Dart

ขั้นตอนในการจ้างผู้พัฒนา Android สำหรับ Project ของคุณ ดูขั้นตอนได้ที่นี่

ไม่รองรับอุปกรณ์ทั้งหมด

ตัวอย่าเช่น แอพที่สร้างไม่สามารถใช้ได้ใน 32-bit iOS ดังนั้น iOS รุ่นแรกๆทั้งหมดเช่น iPhone 5 ลงไป จึงไม่ใช่กลุ่มที่ตลาดที่เป็นเป้าหมายในการสร้างแอพขึ้นมา

มี libraries ที่จำกัด

เนื่องจาก Flutter เป็น Framework ที่ยังใหม่อยู่ จึงยังไม่ค่อยมี libraries ที่เป็นประโยชน์อย่างเช่นภาษาอื่นๆ นั้นจึงเป็นเหตุผลว่าทำไม Developers จำเป็นต้องสร้าง libraries ส่วนใหญ่ด้วยตัวเอง มันก็เลยต้องเสียเวลาไปมากกว่าเดิม

 

เปรียบเทียบกับ cross-platform UI framework ตัวอื่นๆ

Xamarin

Xamarin ใช้ codebase เพียงตัวเดียวคือ C# และสามารถ test แอพได้ในบาง Devices โดยใช้ Xamarin Cloud  framework นี้มีบริษัทใหญ่อย่างเช่น Microsoft และ IBM คอย support อยู่

Xamarin framework

ข้อดี

  • มีเทคโนโลยีที่รวมไว้เป็น stack เดียวสำหรับพัฒนาแอพในทุก platform
  • มี performance ที่ใกล้เคีงกับพวก native
  • มี native UI
  • เข้ากันได้กับอุปกรณืต่างๆ
  • community ขนาดใหญ่
  • ปรับปรุงแก้ไขง่าย
  • มีชุดเครื่องมือเยอะ

ข้อเสีย

  • มี Delays ในการอัพเดท platform
  • มีการจำกัดในการเข้าถึง libraries ต่างๆ
  • มีข้อจำกัดใน ecosystem
  • ไม่รองรับ graphics ที่มีประสิทธิภาพสูง
  • มีความยุ่งยากในการ integration
  • Visual Studio นั้นต้องจ่ายเพื่อใช้ในการพัฒนาเชิงพาณิย์เท่านั้น

PhoneGap

PhoneGap เป็น Framework แบบ open-source สำหรับการพัฒนาแอพ cross-platform ที่ผู้คนสามารถใช้ได้ฟรี นอกจากนี้ PhoneGap ไม่ต้องใช้เครื่องมือหรือ SDKs เพิ่มเติมในการสร้างแอพ ปัจจุบันนี้ก็ได้ช่วยสร้าง Solutions หลายๆอย่างโดยใช้ CSS3, HTML5, และ JavaScript  มันช่วย Developers ได้อย่างดีเพราะมี plugins หลายตัวที่ทไว้แล้ว

PhoneGap framework

ข้อดี

  • ใช้เพียงแค่ codebase เดียวสำหรับทุก platforms
  • มี API ที่ง่าย กราเริ่มต้นพัฒนาแอพจึงเป็นอะไรที่รวดเร็ว
  • สามารถใช้ libraries ของ JavaScript ได้ทุกตัว
  • รองรับ platform ของมือถือทั้งหมด

ข้อเสีย

  • Performance ยังไม่ดีเท่าไร ( ให้ลืมเกี่ยวกับการพัฒนาเกมโดยใช้ Phone gap ไปได้เลย)
  • Plugins บางตัวล้าสมัย
  • UI ถูกแสดงผลได้ด้วยความช่วยเหลือของ browser

React Native

framework นี้ได้รับการปรับแต่งมากจาก React.js ที่สร้างขึ้นโดย Facebook  interface สร้างขึ้นโดยใช้ JavaScript การปรับปรุงแก้ไขในด้านเครื่องมือ Design ประสบความสำเร็จเป็นอย่างมาก ดังนั้น Facebook จึงตัดสินใจที่จะสร้าง React native สำหรับ platform ในมือถือ

Engine ของ JavaScript มีประสิทธิภาพเทียบเท่ากับพวก native  React native ใช้เพียงแค่ API ของ JavaScript ไม่มี browsers หรือ WebView ลองไปดูที่ บทความนี้ เกี่ยวกับการเปรียบเทียบ Flutter และ React native

React Native framework

ข้อดี

  • มี Feedback ที่รวดเร็ว
  • มีการนำ code มาใช้ซ้ำ
  • รองรับในทุก platforms
  • รวบรวมส่วนประกอบต่างๆของ native ได้
  • ใช้ชุดเครื่องมือเดียกันทั้งใน Web และ มือถือ
  • การพัฒนา UI อย่างเปิดเผย

ข้อเสีย

  • มี API ที่จำกัด
  • ใช้อุปกรณ์จริงเสมอ
  • platform ที่แตกต่างกันทำให้การพัฒนาล่าช้า

และนี่ก็คือ Framework ที่ได้รับความนิยมและสามารถนำมาเปรียบเทียบกับ Flutter UI framework ในปัจจุบันได้  แต่มันก็ขึ้นอยู่กับว่าคุณต้องการแบบไหนและคุณนั้นสามารถเลือกเองได้

สรุป

โดยรวมๆแล้ว mobile framework จาก google ก็เป็นตัวเลือกที่ดีถ้าคุณต้องการสร้างแอพแบบ cross-platform แต่จากการทดสอบของเราแล้ว การพัฒนาแอพแบบแยก platform จะเป็นประโยชน์สำหรับธุรกิจของคุณมากกว่าในบางเคส แต่มันก็ขึ้นอยู่กับ features ที่คุณต้องการและเป้าหมายของคุณ

บทความแปลจากเว็บไซต์: cleaveroad