By: mk 
on 4 March 2021 - 08:57
Tags:
กูเกิลประกาศออก Flutter 2.0 และ Dart 2.12 ซึ่งถือเป็นการอัพเกรดครั้งใหญ่ของโลก Flutter
ปัจจุบัน Flutter รองรับการเขียนแอพเนทีฟบน 5 ระบบปฏิบัติการคือ Android, iOS, macOS, Linux, Windows บวกด้วยการเขียนเว็บอีก 1 แพลตฟอร์ม
นอกจาก 6 แพลตฟอร์มข้างต้นแล้ว กูเกิลยังประกาศความร่วมมือกับ Toyota ที่จะนำ Flutter ไปใช้ในระบบ infotainment ของรถยนต์ด้วย แต่ก็ยังไม่มีรายละเอียดมากนักในตอนนี้
ของใหม่ที่สำคัญที่สุดของ Flutter 2.0 คือรองรับการเขียนเว็บแอพเต็มรูปแบบ (ก่อนหน้านี้เป็น Beta ตอนนี้คือ Stable) โดยระบบ Flutter จะมองเว็บเป็น device target อีกตัวหนึ่ง เหมือนกับการตั้ง target ของระบบปฏิบัติการอื่นๆ
ฟีเจอร์สำคัญของ Flutter Web ในเวอร์ชัน 2.0 ได้แก่
- รองรับ Progressive web apps (PWAs)
- รองรับ Single page apps (SPAs) เว็บแบบหน้าเดียว โหลดครั้งเดียว
- สามารถพอร์ตแอพ Flutter เวอร์ชันมือถือไปเป็นเว็บแอพได้ทันที ใช้โค้ดเดียวกันได้เลย
นอกจากฟีเจอร์หลัก 3 อย่างแล้ว ยังมีเอนจินเรนเดอร์เว็บตัวใหม่ที่เขียนด้วยเทคโนโลยี CanvasKit และ WebAssembly ให้มีประสิทธิภาพมากขึ้น, รองรับ text autofill, เพิ่มการควบคุม URL ใน adress bar ของเบราว์เซอร์ เป็นต้น
ฝั่งของ Flutter Desktop ตอนนี้สถานะเป็น Stable แบบ Early Access ก่อนออกรุ่น Stable ภายในปีนี้ ของใหม่คือปรับปรุง text selection, context menu, ปรับปรุงการทำงานของ scrollbar และเพิ่ม grab handle ตัวลากลิสต์สลับไปมาใน ReorderableListView
ภาษา Dart 2.12 ยังมีฟีเจอร์ใหม่ที่สำคัญคือ Sound Null Safety ซึ่งเป็นการแยกชนิดของตัวแปรแบบ nullable และ non-nullable ออกจากกัน เพื่อให้โปรแกรมเมอร์ป้องกันแครชแบบ null error ได้ (การตรวจสอบ null อยู่ที่ระดับของตัวแปรเลย ดักเจอตั้งแต่ตอนเขียน)
กูเกิลบอกว่าตอนนี้ Flutter ออกมาได้ 6 แพลตฟอร์มแล้ว รองรับอุปกรณ์จอเล็กไปจนถึงจอใหญ่ มีอินพุตหลายแบบ ทั้งทัช คีย์บอร์ด เมาส์ และมีมุมมองการใช้งานแอพต่างกัน (เว็บ มือถือ เดสก์ท็อป) นักพัฒนาอาจสับสนว่าต้องเขียนแอพอย่างไรให้รองรับทุกอย่างได้ครบ จึงได้ออกแอพตัวอย่างชื่อ Flutter Folio มาให้ดูกันเป็นแนวทาง
ที่มา - Flutter 2.0, Google Developer
Get latest news from Blognone
Follow @twitterapi
Hiring! บริษัทที่น่าสนใจ
Blognone Jobs Premium
Cloudnone
- สงคราม GenAI บนคลาวด์ในปี 2024 ไปถึงไหนกันแล้ว | Cloudnone x AWS
- Kubernetes คืออะไร [Part 1] เกิดขึ้นมาอย่างไร? ทำไมต้องใช้มัน? | Cloudnone EP.14
- CI/CD ยังไงดี ตั้งเซิร์ฟเวอร์เอง vs เช่าคลาวด์ | Cloudnone EP.13
- รู้จักโน้ตบุ๊กบนคลาวด์ เช่าใช้งาน Jupyter Notebook ที่ไหนดี | Cloudnone Ep.12
- สรุปข่าวใหญ่ปี 23 และคาดการณ์เทรนด์ปี 24 ในวงการ Cloud | Cloudnone EP.11
Comments
แจ่มๆ
มาซะที จะได้ไม่ต้องมาสลับ channel อีกแล้ว
อยากรู้ว่าว่าอันไหนน่าใช้กว่ากันระหว่าง Flutter 2.0 vs React Native 0.6 โดยไม่สนว่าคนเขียนจะถนัดเว็บหรือแอป
The Dream hacker..
ส่วนตัวชอบความอิสระก็เลือก React เขียนเว็บก็ React.js หรือ Next.js เขียน app ก็ React Native ทุกอย่างอยู่บนพื้นฐาน html, css , javascript เรื่อง performance ยังไม่เห็นการรีวิวที่ต่างกันชัดเจนราวฟ้ากับเหว community react ก็ใหญ่ พลักดันโดย Facebook
เอาแค่ list ยาวๆ ที่เป็น custom component มีรูป มี text ข้างใน react native ก็พร้อมจะกระตุกแล้ว ไหนจะเรื่อง navigation ที่ Flutter ทำได้ดีมาก อีกอย่างคือคุณามารถโยกโค้ดจากแอปไปแปลงเป็นเว็บ โดยแทบไม่ต้องแก้โค้ดเลย ในขณะที่ react native ทำแบบนั้นไม่ได้
community react ใหญ่จริง ดีจริง แต่ดีแค่ตัวเว็บ ตัว react ธรรมดา ไม่ใช่ react native สำหรับเขียนแอป
อันนี้ไม่ถูกทั้งหมดนะ และไม่เห็นข้อเปรียบเทียบที่เป็นหลักฐานชัดเจน และ อยู่ที่การเขียน code ของบุคคลนั้นนะครับว่าเอาเทคโนโลยีไปใช้พัฒนาแบบไหน เท่าที่ดู app อย่าง facebook ก็ไม่กระตุกนะครับ https://reactnative.dev/showcase
ไม่เห็นข้อเปรียบเทียบที่เป็นหลักฐานชัดเจน? ไม่ทราบว่าเคยเขียนแอปด้วย react native แล้วเอาลง store จริงๆ ใช่ไหมครับ
ผมตอบไปแล้วว่าคุณเอาเทคโนโลยีไปใช้ มันก็ขึ้นอยู่กับคุณว่าคุณพัฒนามันได้ดีแค่ไหน ผมเลยยกตัวอย่าง app อย่าง facebook ไง ข้อเปรียบเทียบที่เป็นหลักฐานชัดเจน ผมหมายถึงคุณมีแหล่งอ้างอิงไหมว่ามันไม่ดี ไม่ใช้มาบอกว่าเคยเขียน app ไหมอันนั้นมันอยู่ที่ความสามารถของบุคคลนั้น
reactjs initial project เป็น typescript + scss ได้ยัง
create เป็น typescript หรือ js ได้ครับเลือกได้ว่าจะสร้างแบบไหน npx react-native init MyApp --template react-native-template-typescript ส่วน scss เป็นหลักการการเขียน css อีกแบบหนึ่งมาช่วยให้การเขียน css มีโครงสร้างที่ดูง่ายขึ้นและเป็นระเบียบเท่านั้น ไม่จำเป็นต้องเป็นไฟล์ scss var styles = {
myClass: {
color: "blue"
},
myOtherClass: {
color: "red"
}
};
แทงยู
เอ๊ะ SCSS มันมีพวกคำสั่งที่ไม่มีใน CSS และต้อง compile SCSS => CSS นี่ครับ
ใช้ครับถูกต้องครับมีครับที่เป็นคำสั่งใน scss แต่สุดท้ายเราจะได้ css และหลักการของ scss จะมองเป็น ฟังก์ชั่น เราสามารถใช้ Loop, if else หรือ เก็บค่าต่างๆไว้ในตัวแปร แล้วนำมาคำนวนค่า เพื่อความสะดวกรวดเร็วในการใช้งาน สุดท้าย javascript ทำได้หมด ในหลักการพวกนี้ครับ
ได้ครับ ผม initial บ่อย ๆ ลง node-sass + ts + custom webpack นิดหน่อย ถ้าให้ดีลง eslint + stylelint ด้วยจะดีมาก แต่กว่าจะ initial ให้ perfect ก็ปวดตับเอาเรื่อง
ขอบใจมากจ้าาา