ฟีเจอร์ใหม่ใน Chrome 67

Pete LePage

  • Progressive Web App กำลังจะพร้อมให้บริการบนเดสก์ท็อป
  • API เซ็นเซอร์ทั่วไปช่วยให้เข้าถึงเซ็นเซอร์ของอุปกรณ์ เช่น ตัวตรวจวัดความเร่ง เครื่องวัดการหมุน และอื่นๆ ได้ง่ายขึ้น
  • และ BigInt ช่วยให้การจัดการกับจำนวนเต็มขนาดใหญ่ง่ายขึ้นมาก

และยังมีอีกมากมาย

และ Pete LePage จะเป็นผู้ดูแลคุณในวันนี้ มาดูกันว่ามีอะไรใหม่สำหรับนักพัฒนาซอฟต์แวร์ใน Chrome 67

หากต้องการดูรายการการเปลี่ยนแปลงทั้งหมด ดูรายการการเปลี่ยนแปลงที่เก็บข้อมูลซอร์สโค้ด Chromium

PWA บนเดสก์ท็อป

Progressive Web App บนเดสก์ท็อปของ Spotify

ตอนนี้ ChromeOS 67 รองรับ Progressive Web App บนเดสก์ท็อปแล้ว และเราได้เริ่มดำเนินการรองรับ Mac และ Windows แล้ว เมื่อติดตั้งแล้ว แอปจะเปิดขึ้นเช่นเดียวกับแอปอื่นๆ และทำงานในหน้าต่างแอปโดยไม่มีแถบที่อยู่หรือแท็บ Service Worker ช่วยให้แอปทำงานได้อย่างรวดเร็วและเชื่อถือได้ ส่วนประสบการณ์การใช้งานหน้าต่างแอปจะทำให้ผู้ใช้รู้สึกว่าแอปผสานรวมกัน และสร้างประสบการณ์การใช้งานที่น่าสนใจให้แก่ผู้ใช้

การเริ่มต้นใช้งานไม่แตกต่างจากที่คุณทําอยู่ในปัจจุบัน งานทั้งหมดที่คุณทํากับ Progressive Web App ที่มีอยู่จะยังคงมีผล คุณเพียงแค่ต้องพิจารณาจุดพักเพิ่มเติม

หากแอปเป็นไปตามมาตรฐานเกณฑ์ PWA ทาง Chrome จะเรียกใช้เหตุการณ์ beforeinstallprompt แต่จะไม่แสดงข้อความแจ้งให้ผู้ใช้ทราบโดยอัตโนมัติ แต่ให้บันทึกเหตุการณ์แทน จากนั้นเพิ่ม UI เช่น ปุ่มติดตั้งแอป ลงในแอปเพื่อแจ้งให้ผู้ใช้ทราบว่าสามารถติดตั้งแอปได้ จากนั้นเมื่อผู้ใช้คลิกปุ่มโทรพรอมต์ในเหตุการณ์ที่บันทึกไว้ Chrome จะแสดงพรอมต์ต่อผู้ใช้ หากผู้ใช้คลิก "เพิ่ม" Chrome จะเพิ่ม PWA ของคุณลงในชั้นวางและเครื่องมือเริ่มต้น

โปรดดูการพูดคุยในงาน Google I/O ซึ่ง Jenny และฉันได้อธิบายรายละเอียดเกี่ยวกับข้อควรพิจารณาทางเทคนิคและการออกแบบพิเศษที่คุณต้องคำนึงถึงเมื่อสร้าง Progressive Web App บนเดสก์ท็อป

และหากต้องการเริ่มใช้งานใน Mac หรือ Windows โปรดดูรายละเอียดเกี่ยวกับวิธีเปิดใช้การรองรับด้วย Flag ในโพสต์เกี่ยวกับ Progressive Web App บนเดสก์ท็อป

Generic Sensor API

ข้อมูลเซ็นเซอร์ใช้ในแอปหลายแอปเพื่อให้ประสบการณ์การใช้งาน เช่น การเล่นเกมสมจริง การติดตามการออกกำลังกาย และเทคโนโลยีความจริงเสริมหรือเสมือนจริง ตอนนี้ข้อมูลนี้พร้อมให้ใช้งานในเว็บแอปที่ใช้ Generic Sensor API แล้ว

API ประกอบด้วยอินเทอร์เฟซเซ็นเซอร์พื้นฐานที่มีชุดคลาสเซ็นเซอร์ที่เฉพาะเจาะจงซึ่งสร้างขึ้นด้านบน การมีอินเทอร์เฟซพื้นฐานจะลดความซับซ้อนของกระบวนการติดตั้งใช้งานและข้อกําหนดสำหรับคลาสเซ็นเซอร์ที่เฉพาะเจาะจง เช่น คลาส Gyroscope มีขนาดเล็กมาก

const sensor = new Gyroscope({frequency: 500});
sensor.start();

sensor.onreading = () => {
    console.log("X-axis " + sensor.x);
    console.log("Y-axis " + sensor.y);
    console.log("Z-axis " + sensor.z);
};

อินเทอร์เฟซพื้นฐานจะระบุฟังก์ชันหลัก และ Gyroscope จะขยายฟังก์ชันดังกล่าวด้วยแอตทริบิวต์ 3 รายการที่แสดงถึงความเร็วเชิงมุม Chrome เวอร์ชัน 67 รองรับตัวตรวจวัดความเร่ง เครื่องวัดการหมุน เซ็นเซอร์การวางแนว และเซ็นเซอร์การเคลื่อนไหว

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

BigInt วินาที

BigInt เป็นตัวเลขพื้นฐานแบบใหม่ใน JavaScript ที่สามารถแสดงจำนวนเต็มด้วยความแม่นยำตามต้องการ รหัสจำนวนเต็มขนาดใหญ่และการประทับเวลาที่มีความแม่นยำสูงไม่สามารถแสดงเป็น Numbers ใน JavaScript อย่างปลอดภัยได้ ซึ่งมักทำให้เกิดข้อบกพร่องในชีวิตจริง (ด้วยเหตุนี้ เราจึงมักแสดงตัวเลขดังกล่าวเป็นสตรีตแทน)

let max = Number.MAX_SAFE_INTEGER;
// → 9_007_199_254_740_991
max = max + 1;
// → 9_007_199_254_740_992 - Yay!
max = max + 1;
// → 9_007_199_254_740_992 - Uh, no?

BigInt ช่วยให้เราจัดเก็บและดำเนินการคณิตศาสตร์จำนวนเต็มได้อย่างปลอดภัยโดยไม่ต้องเกิดการล้น ปัจจุบัน การจัดการกับจำนวนเต็มขนาดใหญ่มักจะหมายความว่าเราต้องใช้ไลบรารีที่จำลองฟังก์ชันการทำงานแบบ BigInt

let max = BigInt(Number.MAX_SAFE_INTEGER);
// → 9_007_199_254_740_991n
max = max + 9n;
// → 9_007_199_254_741_000n - Yay!

เมื่อ BigInt พร้อมให้บริการในวงกว้างแล้ว เราจะยกเลิกการพึ่งพารันไทม์เหล่านี้เพื่อใช้ BigInts เวอร์ชันเนทีฟแทน การใช้งานแบบเนทีฟไม่เพียงแต่จะเร็วขึ้นเท่านั้น แต่ยังช่วยลดเวลาในการโหลด เวลาแยกวิเคราะห์ และเวลาคอมไพล์ด้วย เนื่องจากเราจะไม่ต้องโหลดไลบรารีเพิ่มเติมเหล่านั้น

และอีกมากมาย

การเปลี่ยนแปลงเหล่านี้เป็นเพียงส่วนหนึ่งของการเปลี่ยนแปลงใน Chrome 67 สําหรับนักพัฒนาซอฟต์แวร์เท่านั้น ยังมีการเปลี่ยนแปลงอีกมากมาย

Chrome รองรับ Credential Management API มาตั้งแต่เวอร์ชัน 51 และมีเฟรมเวิร์กสำหรับสร้าง เรียกข้อมูล และจัดเก็บข้อมูลเข้าสู่ระบบ ซึ่งทำได้ผ่านข้อมูลเข้าสู่ระบบ 2 ประเภท ได้แก่ PasswordCredential และ FederatedCredential Web Authentication API เพิ่มข้อมูลเข้าสู่ระบบประเภทที่ 3 PublicKeyCredential ซึ่งช่วยให้เบราว์เซอร์ตรวจสอบสิทธิ์ผู้ใช้ด้วยคู่คีย์ส่วนตัว/สาธารณะที่สร้างขึ้นโดยโปรแกรมตรวจสอบสิทธิ์ เช่น คีย์ความปลอดภัย เครื่องอ่านลายนิ้วมือ หรืออุปกรณ์อื่นๆ ที่ตรวจสอบสิทธิ์ผู้ใช้ได้ Chrome 67 เปิดใช้ API โดยใช้เครื่องตรวจสอบสิทธิ์ U2F/CTAP 1 ผ่านการรับส่งข้อมูล USB ในเดสก์ท็อป

ดูข้อมูลเพิ่มเติมได้ในโพสต์การเปิดใช้การตรวจสอบสิทธิ์ที่รัดกุมด้วย WebAuthn ของ Eiji

Google I/O จบแล้ว

หากไม่ได้เข้าร่วม I/O หรือเข้าร่วมแล้วแต่ไม่ได้ดูเว็บเทคทั้งหมด โปรดดูเพลย์ลิสต์ Chrome และเว็บเพื่อติดตามข่าวสารล่าสุดทั้งหมดจาก Google I/O

ฟีเจอร์ใหม่ในเครื่องมือสำหรับนักพัฒนาเว็บ

อย่าลืมดูมีอะไรใหม่ใน Chrome DevTools เพื่อดูข้อมูลเกี่ยวกับฟีเจอร์ใหม่ใน DevTools ของ Chrome 67

สมัครใช้บริการ

จากนั้นคลิกปุ่มติดตามในช่อง YouTube แล้วคุณจะได้รับอีเมลแจ้งเตือนทุกครั้งที่เราเปิดตัววิดีโอใหม่

ผมชื่อ Pete LePage และทันทีที่ Chrome 68 เปิดตัว เราจะมาบอกคุณถึงสิ่งใหม่ๆ ใน Chrome