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

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

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

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

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

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

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

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

การเริ่มต้นใช้งานไม่ได้แตกต่างจากสิ่งที่คุณกำลังทำอยู่แล้วในวันนี้ งานทั้งหมดที่คุณทํากับ 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 เพื่อดูว่ามีอะไรใหม่ในเครื่องมือสำหรับนักพัฒนาเว็บใน Chrome 67

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

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

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