กลับมาอัพเดตข่าวสารกับชาวโลกในงาน Google I/O Extended Bangkok 2019

Minseo Chayabanjonglerd
MikkiPastel
Published in
26 min readJun 4, 2019

เอาจริงๆเหมือนปีนี้งาน Google I/O ไม่ค่อยมีอะไรใหม่ๆชวนว๊าวมากเท่าปีที่แล้วเลยแหะ ในความเห็นส่วนตัวเรานะสำหรับส่วน developer

อันนี้บล็อกงานปีก่อนจ้า

งานรอบนี้มีบัตรฟรี และบัตร Community Support ticket 590 บาทได้เสื้อยืดฟรี

เนื่องด้วยงานจัดที่ตลาดหลักทรัพย์แห่งประเทศไทย เลยอยากให้ใส่ขายาวและรองเท้าหุ้มส้นเข้าไปจ้า

งวดนี้โชคดีมีเพื่อนคนเดิมที่มากับเราปีที่แล้วมากับเราในปีนี้ด้วย เย้ มีคนเม้าตอนเที่ยงล้าววว

วันนี้คนมาเช้ากันมากๆเลยยย ส่วนที่จอดรถสามารถจอดได้ฟรี แต่ต้องสแตมป์ที่ counter ด้วยนะ

ก่อนงานเริ่มมีสิ่งนี้ให้ดูด้วยยย

เนื่องจากบล็อกนี้ดันยาวกว่าของงานไลน์ซะอีก แต่เราเชื่อว่า คนหลงเข้ามาอ่าน มันไม่อ่านทั้งหมดหรอก อ่านเฉพาะทีมตัวเองไปอะไรงี้

Welcome Remark — Wittaya Assawasathian, GDG Thailand

ขอตัดในส่วนงานขายเลยดีกว่าค่ะ ง่ายดี น้องจะได้ช่วยพี่โอ๋ขายเลยทีเดียว

งาน Android Bangkok Conference 2019 ในปีนี้ จัดวันที่ 7 เดือน 7 ที่โรงแรม S31 ปีนี้บอกเลยว่าชาว Android Developer ห้ามพลาดเลย เพราะมี speaker จาก Google มาน่าจะมากที่สุดที่เคยเห็นมาเลย ขนาดเราเป็น speaker ในงานนี้ยังตกใจเลย ระดับเทพมากกันขนาดนี้ ช่วยเป็นกำลังใจโดยการซื้อบัตรงานนี้กันด้วยนะ มีโปรดด้วยสำหรับงานนี้

เพียงกรอก io19th แล้วกดซื้อบัตรที่ลิ้งด้านล่างค่ะ

และงาน Firebase Meetup เป็นงานวันที่ 5 เดือน 7 ตอนเย็น เป็นงานรวมเทพ Firebase ทั้ง 4 เอ่อทำไมไม่เรียกจตุเทพแต่แรกเลยหล่ะเขามาสี่คน วันที่ 6 เดือน 6 จะปล่อยบัตรฟรี ส่วนบัตรซื้อราคา 390 บาทได้เสื้อฟรีด้วย

Opening Keynote: Empowering Your Devs with Google Practices and Tools — Thadpong Pongthawornkamol, KBTG

ขออนุญาติตัดช่วงขายของออกนะคะ เพื่อเข้าเนื้อหา session กลัวบล็อกจะยาวเกิน

เนื่องจาก speaker ท่านนี้เคยทำงานที่ Google มาก่อน ก็เลยเอามาปรับใช้ในทีมจ้า หังข้อมี 4 เรื่อง คือ

1) Code Review ในทีม Code จะต้องได้รับการ approve ก่อน ถึงจะเอาลง repo ของโปรเจกได้ ซึ่งช่วงแรกจะช้าหน่อย การทำสิ่งนี้ทำให้ทีมสามารถเดินต่อไปได้เมื่อคนในทีมไม่อยู่ ทำให้มีการคุยกันและเรียนรู้กันมากขึ้น ความรู้ก็จะมีในองค์กรไม่หายไปไหน

process ของพิธีกรรมนี้ เรา init code เข้าไปในโปรเจกใช่ป่ะ reviwer ก็จะตรวจดู ถ้าไม่ผ่านก็จะส่ง change request ให้เราแก้โค้ดให้ดีขึ้น และส่งโค้ดที่เราได้ทำการแก้ไขแล้วไปให้ reviwer ตรวจ แก้จนกว่าจะผ่านอะเนอะ ถ้าผ่านก็เอาขึ้น repo ได้

Tool ที่ใช้คือ Gerrit ซึ่ง integrate กับ email และเชื่อมต่อกับ git สามารถคุยโต้ตอบกันได้ในนั้น

2) Automated Testing มี test case ที่สามารถให้เรา refactor code และเอาไปตรวจสอบได้ว่าโค้ดที่เราแก้ไปนั้นทำงานถูกต้องหรือไม่ ตอนส่ง Code Review ก็ต้องส่ง file test แนบไปด้วย ถ้าไม่มี test case จะเกิดเหตุการณ์ที่ไม่กล้าแตะต้องโค้ดเก่าๆแล้วเอามาแก้ เพราะไม่รู้ว่าโค้ดชุดนั้นทำอะไร

Tool ที่ใช้คือ Bazel เป็น tool google ที่มีความ open source มากขึ้น สามารถพ่วง build กับไฟล์อื่นๆเป็นวงกว้างได้

3) Service-base Design เช่นพวก microservice base มองเป็น components แบ่งเป็น 3 ส่วนคือ logic (จะทำอะไรจ๊ะ), data (ข้อมูลขาเข้าขาออก), channel (ส่งไงอ่ะ)

Google มี tool 2 ตัว คือ

  • protocol buffer (ส่วน data) จะ generate proto file เป็นภาษาต่างๆที่เราต้องการ ข้อดีคือ ไม่ต้อง recompile library ใหม่
  • GRPC (ส่วน channel) ใช้ควบคู่กับ protocol buffer ในการเป็น service stub และ add logic เพิ่มได้ ทั้งฝั่ง server และ cilent ข้อดีคืออ่านแล้วรู้ว่า service นี้ทำอะไร

4) App Monitoring & Tracing เป็นการ tracing performance code ของ developer อย่างเรา ข้อดีคือ รู้ว่าเกิดอะไรขึ้นกับโปรแกรมของเรา

tool ที่ใช้คือ opencensus ซึ่งได้รับแรงบันดาลใจจากของ Google ซึ่งสามารถ report ไปหลังบ้านได้และสามารถต่อกับตัวอื่นๆได้ เช่น prometheus กับ zipkin

สรุปสุดท้าย เราต้องเป็น Tinkerer ซึ่งมีสปิริตที่ทำให้ทีมของเราดีขึ้น จากการตั้งคำถาม, สร้างแบบอย่างที่ดีและ tool ที่ช่วย improvement, มีการวัดผล และแชร์ความรู้ไปยังคนอื่นๆ

I/O Keynote-Android, Kotlin Firebase, Cloud, Web, Flutter, ML and more GDEs

ในส่วนนี้จะมากันรัวๆ ดูสิว่ามีอะไรบ้างนะ

Learning Google Technologies

ก่อนอื่นใครมีลูกมีหลานแนะนำให้สมัครโครงการนี้จ้า

ตอนแรกอ่านสไลด์และจดไม่ทัน หนทางสู่ Talence คือ อะไรที่เราทำได้ และมี หา resource จากไหน เราขอแบ่งตามที่เขาบอก แต่แปะเป็นลิ้งแทนนะแล้วกัน

Android Developer หลักๆจะมีใน Udacity ซึ่งมี course เยอะมาก และฟรี (ยกเว้น nanodegree) ลองเข้าไปในนี้แล้ว search Android ดูเอานะ

ใน youtube ก็มีนะ ช่อง Android Developer

จริงๆฝั่ง Android มี Cerf. ด้วย ชื่อว่า Associate Android Developer Certification จ้า

Web Developer มีตัวเว็บแยกให้เรียน กับมี cerf. เช่นกัน

Machine Learning ช่วงนี้สายนี้เงินดีเพราะเป็นที่ต้องการในตลาด

ทาง Google ก็มีเว็บให้เรียนฟรีด้วยหล่ะ

webinar ก็มี

อันนี้ถ่านกันพรึบพรับ start-up program จ้า

เข้าไปกรอกฟอร์มกันได้จ้าถ้าบริษัทไหนสนใจ ทางนี้ไม่มีประสบการณ์ในเรื่องนี้55

ท้ายสุดเขาฝากให้เรา catch up จ้า

Android

Android Q Preview

เรื่องแรกเลย Dark Theme (ซึ่งทาง Material Design ก็เพิ่มเรื่องใหม่ในงานคือเรื่องนี้ เรื่องเดียว) “ชาว dev ที่แท้จริงต้อง dev ใน dark theme” แล้วมันมีทำไมหล่ะ? มีเพื่อช่วยประหยัดพลังงาน กินไฟน้อย(ขึ้นกับหน้าจอโทรศัพท์ของท่าน)

หนทางการเปิด dark mode ในมือถือ ซึ่งอาจจะอยู่ที่ RAM ของ firmware ด้วย

วิธีการเปิด มี 4 วิธี คือ

วิธีแรก ใช้ DayNight Theme เปลี่ยนจาก Light เป็น DayNight

วิธีที่สอง แก้ที่ hardware ไป set แบบนี้ที่ AndroidManifest.xml จากนั้นเครื่องมันจะตัดสินใจเปลี่ยนสีต่างๆให้อยู่ใน dark mode ให้เรา อารมณ์แบบ Designer ไม่ต้อง เครื่องทำเอง

android:forceDarkAllowed="true"

มันจะมีเคสว่า บางสีอาจจะให้เครื่องเปลี่ยนแล้วไม่ค่อยโอเคอ่ะแก ก็สามารถ set ที่ view ที่เราต้องการแยกต่างหากได้

view.isForceDarkAllowed = false
android:forceDarkAllowed="false"

วิธีที่สาม แยก style.xml เผื่อ UI Designer เขาอยากจะให้สีเป็นไปตาม brand CI อะไรงี้ ใช้ชื่อ folder แยกด้วยว่า values-night

วิธีที่สี่ ……..

เรื่องต่อมาเลยดีกว่าเนอะ Gesture Navigator จ้า จะคล้ายๆ iOS หน่อยๆ แบบนี้ (ลองหาเครื่อง Android 9 บางรุ่นเล่นดู เช่น ยี่ห้อ Samsung)

ซึ่งจะมี 3 แบบ คือ สามปุ่มแบบปกติ, สองปุ่ม, ไม่มีปุ่ม เป็นแถวยาวๆเหมือน iPhoneX เลย

ทำทำไมอ่ะอากู๋? ทำเพื่อให้มี standard เดียวกัน และรองรับมันตั้งแต่แรก ทำให้ developer อย่างเราสามารถ develop ได้ทันที และสมัยนี้จอเต็มมากขึ้น(แทบจะไร้ขอบกันอยู่แล้ว) ก็ทำเพื่อความสวยงาม ขยายแอปได้เต็มจอ

edge-to-edge ที่ Navigation bar สามารถ set value ใน code แยกได้

content สามารถกินพื้นที่ข้างในนั้นได้ เราจะต้องขยายเผื่อไว้สามด้าน คือ ด้านล่าง โดย get insect มา และด้านข้างสองด้าน สามารถ override ทับได้

ส่วน Bottom Sheets วางไว้เหนือปุ่ม home นิดหน่อย

Foldable Phone มือถือพับได้ ตอนนี้ราคาสี่ห้าหมื่น ซึ่งชอบคำพูดนี้มากเลย developer ไม่มีปัญหาในการซื้อ แต่มีปัญหาในการจ่ายตังค์ 555

แล้วทำเจ้ามือถือพับได้นี้ไปทำไม? เพื่อหน้าจอที่ใหญ่ขึ้น แสดงผลได้มากขึ้น และเปิดได้หลายหน้าต่างมากขึ้น

สิ่งที่เปลี่ยนแปลงไป สมมุติว่าเราพับออก พับเข้า พับไป พับมา สิ่งที่เปลี่ยนแน่ๆคือขนาดหน้าจอเนอะ ไหนจะหมุนไปหมุนมาอีก ดังนั้นถ้าเรา config ตาม guideline อยู่แล้วก็ไม่น่าจะมีปัญหาอะไร

Multi-window เราสามารถเล่นแอป 2 แอปได้พร้อมกัน เช่น เล่น Rov ไปด้วย แชทไลน์ไปด้วย ซึ่งบางทีการเปิดแบบนี้มันจะเล่นได้แอปใดแอปหนึ่ง ไม่ได้เล่นพร้อมกันไง ดังนั้นไป set ที่ AndroidManifest.xml เพื่อให้เครื่องรู้ว่า แอปนี้เล่นพร้อมกับแอปอื่นได้ด้วยนะ

แน่นอนว่าใครจะซื้อจอพับมาเล่นเอง ชาว Android Developer สามารถทดลองเล่นได้ใน Emulator บน Android Studio 3.5 จ้า

Multi-Display มือถือเราสามารถเสียบสายต่อจอ แล้วออกมาเป็นอีกจอนึง ซึ่งเป็น responsive เนอะ

Bubbles ถ้านึกไม่ออกก็ที่เราเจอใน Facebook Messenger และ WorkChat เนอะ ซึ่งในตอนนี้ทุกแอปสามารถใช้ได้ และใช้ได้ทุกแอปในตัวเดียว นั่นคือรูปแบบการแสดงผล Notification นั่นเอง และระบบก็ทำให้เราเลย สำหรับบางแอปที่เด้งจอมา เช่น ไลน์ จอยลดา ที่ใช้ SYSTEM_ALERT_WINDOW เขาให้ใช้ตัวอื่นแทนเพราะรบกวน user อ่าจ้า ซึ่ง Bubbles API เปิดมาเป็น activity อะไรก็ได้ ต้องสามารถ resize หรือ flag ได้

Privacy มีการอัพเดตกันคร่าวๆดังนี้

  • External Storage พยายามให้เป็น standard เดียวกัน
  • Location เลือกแค่แสดงใน foreground เท่านั้น ห้ามไปใช้ background ตลอดเวลา
  • Background Activity เปิด activity ในที่ที่ไม่สมควร ถ้านอกเหนือใน list นี้ ก็คือโดน block
  • Camera ของ getCameraChracteristics() เมื่อก่อนไม่ต้องขอ แต่ตอนนี้ต้องขอ permission เพิ่มไปด้วยจ้า
  • Connectivity ต้องขอ permission เพิ่ม
  • Setting Panel มี wrapper เช็คหน้าต่างย่อในการเปิดปิด WiFi

ANGLE เปลี่ยนจากการ render ใน OpenGl เป็นใน Vulkan แทน

Embedded Dex ใช้ไฟล์ dex จาก apk ได้โดยตรง ไม่ให้คนอื่นไปโมเพิ่มเพื่อความปลอดภัยจ้า

Android Runtime (ART) มี profile online บน cloud ทำให้แอปเปิดใช้งานได้เร็วขึ้น

Kotlin

ประชากรตอนนี้เริ่มมากขึ้นเรื่อยๆในทุกๆวัน

ทาง Google ประกาศ Kotlin First ก็คืออะไรก็ตามแต่ที่เป็นของใหม่ ชาว Kotlin ได้ใช้ก่อน

Understanding better Kotlin เป็นการทำความเข้าใจโค้ดสั้นๆจ้า

Coroutines First อันนี้เขา Recommends เลยซึ่งจะเกี่ยวกับเรื่อง threading โดยตรง ใช้ร่วมกันกับ LiveData ของ Android Architecture Components ซึ่งอยู่ใน Jetpack library

แล้วก็ Jetpack Compose คือทุกอย่างจะอยู่ใน scope เดียวกันให้โค้ดอ่านง่ายขึ้น

สุดท้ายคลิปงาน Google I/O ใน session ที่น่าสนใจและเกี่ยวข้องจ้า

Firebase

แอปในไทยใช้ Firebase เยอะมากกกกกกกๆๆๆ

และแอปที่เราทำก็ไม่อยู่ในนี้ ฮืออออออ

ของจากเรียงตาม 3 ภารกิจ

Build better apps

  • ML Kit for Firebase เพิ่ม launch ตัว language กับ smart reply ไปใน cloud next ของใหม่จะมี object detection เวลาถ่ายรูปจะบอก object สำคัญๆในรูป และใช้ร่วมกันกับการ streaming video ได้ด้วย, translation แบบ offline รองรับภาษาไทย, custom model upload ภาพไปสร้าง model เองได้ด้วย, AutoML Vision edge สอนว่าอันนี้คืออะไรแล้วมันจะแยกมาให้
  • Cloud Firestore : location เพิ่มขึ้น ซึ่งใกล้ไทยมากสุดในตอนนี้คือฮ่องกง เมื่อเราระบุ region แล้วเปลี่ยนไม่ได้น้า และราคาบาง region ลดลง 50% ด้วย ตั้งแต่เข้าโปรเจกมาเลย

มีหน้า usage insight แล้ว

collection group query เราสามารถ query ง่ายกว่า realtime database ถ้ามี collection เยอะๆ ตอนนี้ query ครั้งเดียว ได้ครบทุก collection

  • Cloud Function รองรับ node8 แล้วมี async/await, มี schedule function cron job ฟรี 3 jobs ส่วน job ที่ 4 3 บาทต่อเดือน ถูกมั่กกกกก
  • ก่อนหน้านี้มี Firestore และ Realtime Database Emulators กันไปแล้ว ตอนนี้ของ Cloud Function ก็ไม่น้อยหน้า มีแล้วเช่นกัน สามารถ test ใน local ได้
  • Firebase Hosting + cloud run รวมร่างเป็น dynamic site รองรับภาษาอะไรก็ได้ ซึ่งก่อนหน้านี้มีใช้ cloud function เพื่อเปลี่ยนจาก static site เป็น dynamic site กันไปบ้างแล้ว

และ subdomain มีมาเพิ่ม .web.app ซึ่งเราชอบมาก เพราะมันสั้นดีย์

รายละเอียดเราเคยโพสลงเพจไว้ ประมาณนี้

  • Firebase Authentication เพิ่มของ microsoft และ yahoo! เข้ามา

Improve app quality

  • Firebase Test Lab รองรับ Wear OS, Android Q และ App Bundle เพิ่มเข้ามา

improved game testing เอา ML มาใส่สำหรับเทสเกมส์โดยเฉพาะ ให้เดาว่ากลุ่มไหนควรจะกด, Flaky test detection กลับเข้าไปดูได้ว่าทำไมถึงเกิดเหตุการณ์นี้ขึ้น (จริงๆเป็นการทำ End-to-End Testing นะ)

  • Monitoring เพิ่ม BigQuery integration และ web support (ซึ่งทางเราได้เข้าโปรแกรม alpha ได้เมลล์ว่าก่อนสงกรานต์ ว่าจะลองเล่น และลืม)
  • Crashlytics รองรับ NDK และ Unity ซึ่งทาง Fabric จะพยายาม port product ทุกอย่างภายในปี 2020 และมีการรวมร่างกับ Big Query สำหรับดู data (เคยลองคร่าวๆถ้าจำไม่ผิดตัวนะ), customize velocity alert ถ้ามี crash สำคัญๆเกิดขึ้นอย่างรวดเร็วและรุนแรง จะ noti ไปยังทีม dev ได้

Grow your business

  • Google Analytics มี new UI Audience Builder สามารถทำเป็น dynamic ได้ และสามารถ set เวลากลุ่มเป้าหมาย เพื่อความสดใหม่ตลอด เช่น แอปนี้ยิงโนติเมื่อเราไม่ผ่าน level 99 ถ้าเราเล่นไม่ผ่านจนผ่านแล้ว เราจะออกจากกลุ่มนี้
  • ที่ console สามารถระบุ role ว่าให้เห็นอะไรได้บ้าง

Firebase เปิด Open Source ทุก platform แล้ว เข้าไป contribute กันได้

และ alpha โปรแกรมจ้า มีอะไรใหม่นางจะมาบอกเราให้เราลองเล่นก่อนเสมอ (แล้วส่วนใหญ่เจ้าของบล็อกก็ดันไม่ค่อยได้เล่นไปอีกกกก)

Web & Assistance

หลายๆเรื่องก็ถูกเปิดตัวใน cloudNEXT มาก่อนแล้ว เริ่มที่ฝั่งเว็บก่อนจ้า ลุยย

  • เน้น performance มากขึ้น อย่าง Chrome 73 support lazy load เหมือนทางฝั่งแอปแล้วนะ
  • paint holding (port จาก edge มา) navigation จะไม่เปลี่ยนเมื่อโหลดหน้านั้นยังไม่เสร็จ
  • web packaging pack web ไปวางบน provider เพื่อ serve ไปยัง package ได้เลย
  • Firebase Performance Monitoring มีของเว็บแล้ว
  • Lighthouse support budgets และ run CI ใน git ตอน PR ได้ด้วย และ tech stack กับ WordPress และ Joomla
  • Google Search Console มี speed report
  • Web Share API
  • Web Perception Toolkit อันนี้คือสามารถ scan QR Code อะไรพวกนี้ได้
  • Fugu เป็นโปรแกรมปิดช่องว่างระหว่าง web กับ app
  • Comlink เชื่อมต่อกับ web worker เพื่อ simulate ง่ายขึ้น (main thread กับ worker)
  • js node12 เมื่อเทียบกับ node8 และ upgrade version ใหม่ๆ
  • มี TWA ที่ทำให้ wrap PWA ขึ้น Play Store
  • Google Fonts render ได้ไวขึ้นกว่าเดิม

http://fonts.googleapis.com/css?family=Lobster&font-display=swap

ส่วน Assistance เริ่มเปลี่ยนวิธีคิด จากลำโพง มาเป็น smart screen สามารถทำ video แบบ how-to จริงๆที่บอกลำดับขั้นตอนได้

และ Interactive Canvas พวกเกมส์

Local Home SDK ส่ง item คุยกันในบ้ายได้โดยตรง โดยไม่ต้องผ่าน server

พักเที่ยงกินข้าวววว และนั่งฟังเพื่อนและเพื่อนของเพื่อนคุยกันของฝั่ง Web มีแลกเปลี่ยนความรู้กันบ้างนิดหน่อย

ส่วนตัวไม่ค่อยโอเคกับคนที่บอกว่ารออ่านบล็อกเท่าไหร่อ่ะ รู้สึกว่าเพิ่มความเหนื่อยและความกดดันไปอีก ;_______;

ไหนๆบ่นแล้วขอบ่นต่อ ตอน keynote ช่วงคุณนากิอ่ะ ข้างหลังคุยกันตลอดเวลาเลยไม่รู้ทำไม แบบเงียบไปนาทีนึงคุยต่ออ่ะ T___T ซึ่งทำให้เราฟังและจดพร้อมกันยากด้วย ดีที่หลังเที่ยงนั้นเจอฝั่งเว็บเฮรอบวงจ้าาาา จ้าาาาาาาาาาาาาา

What’s new in Android Jetpack — Somkiat Kitwongwattana, GDE Android

หลังกินข้าวอาจจะรู้สึกง่วงนอนกัน ฮ่าๆ ใน session นี้มี 5 เรื่องใหญ่ๆ

1) CameraX มาเพื่อแก้ไขปัญหา pain point ของ Camera V1 และ Camera V2 ซึ่งมี fragmentation ของกล้องเยอะแยะมากมายเป็นไปหมด เรียกใช้งานทีก็ดูโค้ดเยอะมากๆทั้ง 2 version เลยย (เอออ เราเอง ไม่ใช่คนที่ยกมือว่าเคยทำทั้ง 2 version นะ แต่ตอนฝึกงานเขียน Android เพิ่งหัดเดินปุ๊ป มาเขียนแอปกล้องเลย ส่วน Camera V2 น้องในทีมที่ฟังใจเขียน แล้วบ่นว่าใช้งานยาก เห็นโค้ดมาทั้งสองเวอร์ชั่นอ่ะ //เรียก V ยังกะ AF ยังไงก็ไม่ลู้) ซึ่งตัวนี้รองรับ V2 (เนี่ยฟิวยังกะ AF) และ Android L ขึ้นไป แต่อาจจะเขียน 2 code ถ้าจะใช้เจ้า V1 ด้วย ดังนั้นเราใช้เจ้า X แทน V2 ได้เลย

use case ในที่นี้คือ พฤติกรรมต่างๆของกล้องนั่นเอง

  • preview มี listener เพื่อ update มัน และมี code ที่สั้นมาก ใช้ bindToLifecylcer เพื่อโยน use case กี่อันก็ได้ ซึ่งมันโยนไป Android Architecture Components ส่วน metadata ต่างๆ เช่น location สามารถใส่ค่าลงไปง่ายๆได้เลย ไม่ต้องดึง metadata ออกมา ใส่ค่าทับ แล้วยัดลงไปแบบนั้นอีกแล้ว
  • มีให้ลองเล่นแล้ว แบบอัลฟ่าๆ 1.0.0-alpha01
  • extensions แบบพวกหน้าชัดหลังละลายอะไรเนี่ย ที่เรียกว่าโบเก้ ยังไม่เสร็จนะ

2) ViewModel with SavedState

  • ตายได้ก็ต่อเมื่อ process นั้นถูก kill แบบคืน memory ให้กับระบบ
  • เก็บค่าที่ saveStateHandle -> getLiveData

3) ViewPager2

  • tab : viewpager มี fragment หลายๆตัว
  • based on RecyclerView (อ่ะชาว iOS เรียกมันว่า CollectionView เนอะ แล้วเว็บมีไหมนะ) เช่น สร้าง adapter เปลี่ยนเป็น FragmentStateAdapter จะคล้ายๆของเดิม เพิ่มเติมคือโยน lifecycle ไปด้วย และโยนเข้าไปเหมือนใช้ RecyclerView มีการเปลี่ยนเพจไปมา จึงไป set แบบเรียงกี่อันแนวตั้งนอนไม่ได้นะเออ บอกได้แค่ว่าเลื่อนแนวนอนหรือแนวตั้ง
  • page transformer เอาโค้ดจาก 1 ไปใส่ 2 ได้เลย
  • page indicator คือฉันเลื่อนไปหน้าที่เท่าไหร่แล้วนะ รับค่าจาก pageIndicator ไป render view เองเลย

ซึ่งตัวนี้ก็ alpha อยู่เช่นกัน

4) Preferences: หน้า settings

5) Architecture Components

  • worker ทำงานเป็น synchronous ถ้ามี fail หรือสั่งหยุด (interrupt) หล่ะ
    room (SQLite) suspend คือ ตัว coroutine ที่จัดการงาน synchronous ซึ่งพบเจอใน Retrofit 25.1 และ WorkManager เช่นกัน

ดังนั้นถ้าถูกสั่งให้หยุด worker จะหยุดทำงานกลางคัน เราไม่ต้องทำอะไรต่อ

  • LiveData ทำงานตาม life cycler ของ Android (UI : Activity/Fragment) เป็น LiveData กับ coroutine ในตัว
  • LifeCycle เป็น coroutine ในตัวด้วยคำสั่ง launch ดังนั้นทำให้เขียนโค้ดง่ายขึ้น ส่วน launchWhenStarted ไม่ต้องกังวลว่าโดน destory ไป จะทำตอน start เท่านั้น
  • Testing ง่ายขึ้น

Android Benchmark — Inaki Villar, GDE Android

เนื้อหาโดยรวมกล่าวถึงเรื่อง Testing นี่แหละ แต่เพิ่มเติมโดยการทำ benchmark เพื่อดู performance

test process นอกจาก test แบบตามปกติแล้ว ควรมี performances test ด้วย

Jetpack Benchmark Library ก่อนอื่นเลย เอาเข้า project ก่อน จะมี test function worker ตัวนึง

แล้วไป integration Android Studio โดยการสร้างเจ้า benchmark module ใหม่

แล้วเอาไป run test ได้ผล benchmark มา และได้ BenchmarkData,json เอาไปดูผลต่อ

และเราสามารถใส่ plugin benchmark ในโปรเจกได้

จากนั้นมาถึง Ramp, Dive, Build System เรื่องของ multi-threading ใน APG

อันนี้คุณนากิฝากร้านจ้า ลองไปอ่านดูได้จ้า

พูดเรื่อง testing แบบคร่าวว่ามี level ไหนบ้าง และแต่ละ class ควรเทสยังไง

ซึ่งเขาใช้เจ้า Nitrogen EAP ช่วยเทส

บล็อกนี้สรุปของใหม่ฝั่ง testing ทั้งหมดจ้า

What’s New in ML Kit for Firebase — Jirawat Karanwittayakarn, GDE Firebase Kajornsak Peerapathananont, Agoda

เราว่า session นี้ เราต้องตื่นแน่นอนนนนน!!!! พี่ตี๋บอกว่า “จบ session นี้ เป็น Data Science แน่นอนนนน” ซึ่งจริงๆมีสองอย่าง เป็นแน่นอน กับไม่เป็นเลย 555

mission ของ Firebase นั่นคือ สามารถทำ ML บนแอปได้ง่ายๆ ซึ่งพี่ตี๋ได้กล่าวว่า “ใช้เงินซื้อความสำเร็จให้เราได้” มีเงินก็ใช้ได้เลย

รูปแบบการทำงานมี 3 แบบคือ

  • on-device ทำงานแบบ offline
  • in-the-cloud แม่นยำกว่า แต่ก็มีค่าใช้จ่าย
  • custom models ไป build model ได้ TensorFlowLite ไป upload

ปีที่แล้วมี use case vision 5 อย่าง รวม custom model และมี 2 ตัวใหม่ที่ประกาศก่อนงาน IO

ซึ่ง ML Kit โตขึ้นมาก ตั้งแต่ปล่อยออกมา

“Firebase เป็นเพื่อนกับทุก platform” มี iOS ใช้อยู่ 24% แหน่ะ

มีคนบอกให้ Firebase เปิด API เพื่อทำ use case เพิ่ม

ส่วนของใหม่

  • smart reply : wording suggestion นึกไรไม่ออก ตอบแบบนี้ไปสิ นางจะอ่าน chat history เพื่อบอก suggestion ใส่ได้สูงสุด 3 ตัว นับ 10 recent message เพื่อดู context แต่ด้วยมัน on-device มันจะไม่ suggest อันที่เป็น sensitive message

ส่วนอันนี้โค้ดตัวอย่างฝั่ง iOS จ้าาา

  • language id : บอกว่าอันนี้เป็นภาษาอะไร อาจจะต่อ Google Translate API ได้ เช่น ทำ on-device translate กด download ภาษาเก็บไว้ หรือ scan คำ

หลักการทำงานมี phrase คำนี้คืออะไรซึ่งจะทำแบบ NMT ที่สนใจ context ทั้งประโยค (ส่วนอีกอัน Phrare-based machine translation จะรู้ว่าคำว่าคืออะไร)

แต่ละภาษามีขนาด 25–35 MB และจัดการ model เองได้ ใช้ภาษาอังกฤษเป็นสื่อกลางในการแปล เช่น ไทย->ฝรั่งเศส ก็จะเป็น ไทย->อังกฤษ และ อังกฤษ->ฝรั่งเศส

สองอันนั้นใหม่แล้วนะ ยังมีของใหม่กว่าอีก

  • Object Detection & tracking : object นีคืออะไร อยู่ตรงตำแหน่งไหนของรูป ซึ่ง detect ได้สูงสุด 5 object การทำงานคือ ส่องเจอ object แล้วดูว่าวัตถุนี้คืออะไร ตัวอย่างแอปที่ทำก็คือ IKEA นั่นเอง

ขั้นตอนการประมวลผล ตอนแรกจะมีแค่ สองอันล่าง คือ locaticer (ถ่ายมาไม่ชัดอาจจะผิด)-> classifier ซึ่งการทำงานจะหน่วงๆเนื่องจากกินเวลาไปอย่างละ 10ms ตอนหลังจะมี tracker ใส่ด้านบน ทำให้ทำงานได้เร็วขึ้น

  • Custom ML Kit เป็น Photo ML มี 3 กลุ่มคน คือแบบไม่ค่อยรู้ แบบ expert ไปเลย แล้วคนกลุ่มตรงกลางหล่ะ

ตัวอย่างเช่น น้องหมาในรูปพันธุ์อะไรง่ะ

process การทำคือ upload รูปไป cloud storage บน Google Cloud แล้วไปที่ TensorFlowLite ข้อดีคือเร็ว

ขั้นตอนการทำ image prediction พอมี feature นี้ลด process เหลือเพียง 3 process เท่าน้านน

DEMO หน้าจอแซลลี่ พี่ตี๋หยิบของออกจากถึงเป็บบราวน์และโคนี่ และวันนี้จะเดโม่อะไรนี่ จริงๆกล้องเราควรซูมสุดเพื่อขยายความ ขายในขาย มากขึ้น

บราวน์กับโคนี่มาทำไม ทั้งสองคนเป็น dataset ของพี่ตี๋ ถ่ายทั้งคู่คนละ 100 รูป คนละมุมคนละที่กัน และใส่ folder แยกคนกัน การตั้งชื่อ folder ที่ดีย์นั้น ควรตั้งชื่อให้มัน predict ได้เลย จากนั้นนำทั้งสอง folder มาเป็นไฟล์ zip

จากนั้นเข้าหน้า console เพื่อ add dataset ซึ่งขั้นตํ่าคือ 100 รูปตามจำนวนที่พี่ตี๋ถ่ายเลย เลือก predict object เดียวและ upload zip file

เมื่อ upload เสร็จแล้วจะมีเมลล์เด้งมาบอกว่าเสร็จแล้วนะ เราก็เข้าไปดู กด training model และ set compute ได้ตอน train model เสร็จแล้ว

เราสามารถเลื่อน theresold มาดูได้ ซึ่งควร set ไว้สัก 0.7

การนำโมเดลไปใช้นั้นมี 3 แบบคือ

  1. download model TensorFlowLite อันนี้ก็ on-device ไป
  2. อยู่บน cloud
  3. build บน app และ remote ด้วย แบบรวมสองข้อแรกเข้าด้วยกัน ซึ่งมีข้อดีคือ user สามารถเปิดแอปได้ทันที และใช้ remote config เพื่อ download model มาใหม่เมื่อมีการอัพเดต

มาดูผลกันดีกว่าเนอะ

Recap ก่อนจะจากกันไป สามารถ upload รูปฟรีไม่เกิน 1000 รูป และ speech ยังไม่มาจ้า

New capacities on web — Warat Wongmaneekit, GDE Web

ฝั่ง Android เราโดนเขาบลัฟเยอะมาก อ่ะยอมๆเขาหน่อยแล้วกัน

Google เน้นปิด gap ระหว่าง app และ web ซึ่งทางเว็บก็มีความพยายามลดช่องว่างด้วย PWA มาแล้ว ด้วยคอนเซปการทำเว็บที่เหมือนแอป

ซึ่ง Fugu (ที่ชื่อคล้ายๆ FuFu เดี๊ยวว) ผลักดัน feature ที่ทำให้เว็บนั้นมีความสามารถเท่ากับแอป ให้มีคนสนใจมันมากขึ้น ซึ่งมี top priority มี 3 feature และ 3 state เช่นกัน จึงแบ่งเป็นสองกลุ่มคือ

กลุ่มสีเชียวและสีเหลือง รองรับ

  • Native LightBox ไม่ต้องใช้ js handle html dialog implement
  • Portals ให้ Navigation ของเว็บเปลี่ยนไป

ที่จำได้เปิด Document ให้เราดูเลยจ้า

  • Dark Mode : defect ได้ว่าเว็บนี้เป็น dark mode ไหม และให้ทำไรบ้าง
  • Web Payment UI เป็นแค่ form เฉยๆ
  • Payment Handler APO สามารถสร้างของตัวเองและยัดลงไปได้
  • Web Authentication API เข้าถึง fingerprint ของมือถือได้
  • ปุ่ม share มี fragmentation สูงมาก เปิดเว็บไหนก็ไม่เหมือนกัน ของเว็บแก้ปัญหาโดยการทำ intent เหมือน Android มีชื่อว่า WebSharedTarget และใน V2
  • Background Fetch เช่น กด download ซึ่งทำใน background ได้แล้วโดยไม่ต้องอยู่หน้า browser อีกต่อไป
  • Picture-in-Picture เป็น default ของ video player ใน Chrome (คือสามารถยกไปเล่นที่อื่นได้)
  • Media Session API ช่วย control เสียงของเว็บเมื่อเปิดหน้าจอ แต่ตอนนี้ใช่ media keyboard ได้แย้ววว
  • Object Detection สามารถ detect รูปและ QR Code ได้ ใข้ perception toolkit ซึ่งเราสามารถ integrate QR Code Scanner ลงไปในเว็บเราได้
  • WebXR เป็น web AR และ VR ต้องกสน web GL ซึ่งเขาจะมีตัวนึงชื่อว่า model-viewer ไว้ปั้น model พวกนี้

กลุ่มสีแดง ยังไม่รองรับ

  • Feature Policy เราสามารถ set ได้ว่าเว็บนี้ใช้ js อะไรได้บ้าง
  • Wake Lock API เว็บไม่สามารถเปิดหน้อจอไว้เฉยๆได้
  • Badge UI ว่ามี Notification เท่าไหร่
  • Contact API มี contact อะไรในเครื่องเราบ้าง

สรุปสุดท้าย อะไรที่ Chrome Support นั้น Edge Beta ก็จะ support ด้วย

ก่อนจบ session มาดูเจ้า WebXR กันเถอะ

ส่วนใครอยากศึกษาโค้ดก็เข้ามาดูได้ที่นี่

Bringing your PWA to the Google Play Store with Trusted Web Activity — Henry Lim, GDE Web

session เปิดโลก เมื่อชาว Web Developer อยากเอาแอปลง Play Store บ้าง

เปิดมาที่เรื่องของ webview กันก่อนเลย ปกติเวลาชาว Android Developer แปะหน้าเว็บลงไปในแอป เราจะเรียก webview เป็นสิ่งแรกที่เราเริ่มเขียนแอปกัน จนตอนหลังมี Chrome Custom Tabs เข้ามา ซึ่ง performance ก็เร็วขึ้นนะ (แต่บางอย่างสำหรับเรามันก็ custom ไม่ได้เลยยย)

มีตารางเปรียบเทียบระหว่าง Webview กับ Chrome Custom Tab ด้วย

TWA จะไวกว่า webview โดยใส่ Chrome Custom Tab ในแอปและใส่ asset link ลงไปในโปรเจก Android ของเราด้วย

มาเริ่มทำกันเลยดีกว่า

ขั้นตอนแรก ใส่ import เจ้า chrome custom tab ตัวนี้ลงไปในโปรเจก

implementation 'com.github.google chrome.custom-tabs-client:d08e93fce3'

ถ้าขยายรูปดูพบว่าน่าจะเป็น commit นี้นะ

อันนี้ Github

จากนั้น add digital asset link

ใส่ SHA16 ในแอปและใน Play Store

ซึ่งเราสามารถใช้ tool เพื่อ generate สิ่งนี้ได้ และใส่ TWA ลงในแอปของเรา

สุดท้ายเอาไปแปะในแอป

ตอนแรกเราก็ init มันก่อน

mTwaLauncher = new TwaLauncher(this);

เวลาเอามาใช้ก็ง่ายแสนง่ายยยย

mTwaLauncher.launch(url);

How It Works? การทำงานจะคล้ายๆเราส่ง intent ไปยัง activity อื่น

supported on 95% of Android Devices! เรียกได้ว่าเกือบทุกเครื่องบนโลก

การเปิดเจ้า TWA มาใช้งานหลังจากที่เราลงแอปไป ก็เปิดจาก launcher เข้า activity แล้วไปที่ TWA แต่จริงจะข้ามขั้นตอน เปิดมาเจอ TWA เลย

ถ้าเครื่องนั้นไม่มี Chrome หล่ะ ทำไงดี? เราจะต้อง navigating to a differnt origin

อยากลองเล่นเข้าไป clone จากที่นี่เลย

และอย่าลืมใส่เว็บที่เราจะใช้ ใน AndroidManifest.xml ใน manifestPlaceholders

convert PWA เป็น apk

Rules for web content in your TWA

  • ก่อนอื่น เจ้าต้องเป็น PWA เสียก่อน
  • lighthouse ดู performance และ check ความเป็น PWA ได้ ซึ่งเราสามารถเอาขึ้นได้ ถ้าผลเป็นไฟสีเขียวทุกหมวด และได้คะแนน performance 80% ขึ้นไป
  • เรื่อง policy ของ Play store
  • จัดการ schema และ header ต่างๆในแอปของเรา
  • use case เฮนรี่ได้ยกตัวอย่างเว็บแอปของตัวเองในตำนาน Remote for Slides (ในตำนานยังไงหรอ คือถ้าใครไปงานนี้น่าจะจำได้จ้า//ลองเล่นดูคร่าวๆโอเคอยู่นะ ว่างจะมารีวิวให้นะ ;)) ใช้ Web/Native Bridge เพื่อทำ in-app purchase ห้ามใช้ 3-rd party ในการจ่ายเงินจ้า

ส่วนแอปอื่นๆก็จะมี Myntra กับ oyo

ส่วนเจ้าอื่นๆก็กำลังทำตามมากัน

ที่เหลือเป็นเนื้อหา roadmap และอื่นๆ อ่านเอาเองนะ ไม่ได้จดมาจ้า

Flutter for multi platform development — Krisada Vivek, Thailand Flutter Community

keyword ของ Flutter มี 4 ตัว ก็คือ

  • Beautiful ใช้ Material Design หรือ custom ได้
  • Fast สร้าง app ได้เร็ว
  • Productive ไม่ต้อง build ใหม่ เป็นโค้ดที่แก้แล้วดูผลได้ทันที
  • Open เป็น Open Source และ Free

ถ้าอยากเริ่มศึกษา Flutter เข้าไปอ่านที่นี่ได้เลยจ้า

Update

  • Theme : Material + Custom เปลี่ยนชื่อตัว view ข้างนอก แต่ไส้ในใช้ของได้เหมือนเดิม
อย่าถามเราว่าตัวสีแดงอ่านว่าอะไร เราเองก็มองไม่เห็นเช่นกัน แงงงงงง
  • Dark Theme : เขาบลัฟมาว่าใช้สองบรรทัดจบ (อย่าไปยอมค่ะทีม Android เรามีทางเลือกที่ 4 เดี๊ยวววว)
อย่าเราอีกนะว่าสีแดงคืออะไร เราอ่านไม่เห็นจ้า ฮือออ
  • Widgets มีเจ้า SliderThemeData อัพเดตมา และมีตัวใหม่เพิ่มมา 3 ตัว คือ Reorderable list, Range Slider, Search
  • Beyond ด้วย Adaptive Layout เวลาทำหน้าจอของ mobile, tablet, desktop จะแสดงผลไม่เหมือนกันเพราะขนาดหน้าจอ อ้าวแล้วถ้าเอาลง wear, smart tv และอื่นๆหล่ะ จะวุ่นวายขนาดไหน จึงต้องใช้ Adaptive Components เข้าช่วย ที่ทำให้เขียนครั้งเดียว สามารถใช้ได้ทุกหน้าจอเลย ไม่ต้องทำหน้าจอแยกแล้ววว และตอนนี้ยังเป็น Design Concept อยู่

ทาง Flutter ได้ทำโปรเจก Developer Quest เป็นเกมส์ให้ทุกคนลองเล่นกันในงาน Google I/O 19 นี่แหละ

และตอนนี้ Flutter ได้ support web แล้วนะ ซึ่งประกาศไปปลายปีที่แล้ว

ซึ่งใน 1 codebase run ได้หมดทั้ง web และ mobile และมี performance ที่ดีไม่ต่างกัน

มีช่วง Demo ด้วย CodeMagic ด้วย ซึ่งตัวเว็บจะแสดงผลแบบ dark theme ได้ด้วย ลองไปเปิดดูนะ

อันนี้เว็บเดโม่จ้า ผลออกมาเป็นดังรูป มือถือเป็นแบบปกติ ส่วนคอมนั้นเปิดตอนเวลาคํ่าๆพอดี

https://hello-flutter-web.codemagic.app

สุดท้ายขากลับคืนสายคล้องคอแลกติ๊กเกอร์จ้า

มาอัพเดตข่าวสารใหม่ๆกันได้ที่เพจเลยจ้า หรือกด follow medium เราไว้เลย

--

--

Minseo Chayabanjonglerd
MikkiPastel

Android Developer | Content Creator AKA. MikkiPastel | Web2 & Web3 Contributor