Chrome 89 กำลังเริ่มเปิดตัวในเวอร์ชันเสถียร
สิ่งที่จำเป็นต้องทราบมีดังนี้
- WebHID, WebNFC และ Web Serial ได้เปลี่ยนจากช่วงทดลองใช้จากต้นทางและพร้อมให้ใช้งานแบบเสถียรแล้ว
- เรากำลังปิดช่องโหว่ที่นักพัฒนาแอปบางรายใช้การตรวจสอบความสามารถในการติดตั้งของ PWA
- การแชร์เว็บและเป้าหมายการแชร์เว็บพร้อมใช้งานบนเดสก์ท็อป
- และยังมีอื่นๆ อีกมากมาย
ฉันชื่อ Pete LePage ทำงานและถ่ายทำ จากที่บ้าน มาเจาะลึกและดูว่ามีอะไรใหม่ๆ สำหรับนักพัฒนาซอฟต์แวร์ใน Chrome 89 บ้าง!
WebHID, WebNFC และ Web Serial
ผมตื่นเต้นเกี่ยวกับ WebHID, WebNFC และ Web Serial มาก โดยเปิดประสบการณ์ใหม่ๆ แก่ผู้ใช้ที่ไม่เคยทำได้มาก่อนด้วยการโต้ตอบกับฮาร์ดแวร์ที่ใช้จริง
อุปกรณ์ต่างๆ ช่วยให้ผู้ผลิตเชื่อมต่อกับแอปการประชุมทางวิดีโอที่สนุกและแปลกใหม่ ได้โดยใช้ปุ่มโทรศัพท์บนลำโพงพิเศษโดยเฉพาะ หรือกรณีการใช้งานอื่นๆ
การใช้ Web Serial และโค้ดประมาณ 60 บรรทัดทำให้ @AndreBan สามารถสร้างหน้าเว็บที่สามารถโต้ตอบกับ MicroPython REPL ใน Raspberry Pi Pico Espruino ยังใช้ Web Serial ใน IDE บนเว็บด้วย
ที่งาน CDS 2019 นั้น Francois เขียนเกมสนุกๆ สไตล์หน่วยความจำโดยใช้ Web NFC คุณต้องแตะโทรศัพท์กับบัตรที่ถูกต้องในลำดับที่ถูกต้อง
และที่ฉันชอบอย่าง @bramus ก็ใช้ WebHID เชื่อมต่อกับ StreamDeck เพื่อสร้างกลองแพด Daft Punk หากคุณไม่มี StreamDeck โปรดชมวิดีโอสาธิตของเขาบน YouTube และดูโค้ดบน GitHub
ไม่ว่าจะเป็นเว็บไซต์ที่โต้ตอบกับฮาร์ดแวร์หรือฮาร์ดแวร์ที่สามารถโต้ตอบกับเว็บไซต์จำนวนมาก ผู้ใช้จะชนะเพราะไม่จำเป็นต้องติดตั้งไดรเวอร์พิเศษหรือซอฟต์แวร์
ดูข้อมูลเพิ่มเติมเกี่ยวกับอุปกรณ์บางเครื่องที่เชื่อมต่อได้ที่ web.dev/devices หรือดูคู่มือเริ่มต้นใช้งานสำหรับ WebHID, WebNFC และ Web Serial
การเปลี่ยนแปลงเกณฑ์ความสามารถในการติดตั้งของ PWA
การรองรับการใช้งานออฟไลน์เป็นส่วนสำคัญของเกณฑ์ Progressive Web App ด้านความสามารถในการติดตั้งมาตั้งแต่ต้น ผู้ใช้คาดหวังให้แอปทำงานเสถียร เช่นเดียวกับแอปอื่นๆ ที่ติดตั้งไว้ มันควรจะเร็ว แล้วพวกมันก็ไม่ควร เห็นไดโนเสาร์ที่ออฟไลน์แน่ๆ เลย!
ภายในปีนี้ เราวางแผนที่จะปิดช่องโหว่ที่ทำให้เว็บไซต์ 2-3 แห่งผ่านเกณฑ์ความสามารถในการติดตั้งได้โดยไม่ต้องมีประสบการณ์แบบออฟไลน์ หาก PWA มีประสบการณ์แบบออฟไลน์อยู่แล้ว คุณก็พร้อมใช้งาน คุณไม่ต้องดำเนินการใดๆ แต่หากไม่ ก็ได้เวลาเพิ่มแล้ว
ตั้งแต่ Chrome 89 เป็นต้นไป หาก PWA ให้การตอบสนองไม่ถูกต้องเมื่อออฟไลน์ คุณจะเห็นคำเตือนใน DevTools ในแท็บ "ปัญหา" และ Lighthouse จะระบุว่ามีปัญหา และจะเริ่มบังคับใช้ใน Chrome 93 ภายในปีนี้
คุณเลือกได้ว่าต้องการมอบประสบการณ์แบบออฟไลน์แบบใด ถ้าจะให้ดี คุณควรมอบประสบการณ์การใช้งานมากที่สุดเท่าที่จะเป็นไปได้ แต่อย่างน้อยก็ใช้ง่ายได้เพียงแค่หน้าสำรองแบบออฟไลน์
ดูรายละเอียดเพิ่มเติมเกี่ยวกับการเปลี่ยนแปลงและสาเหตุที่เราทำการเปลี่ยนแปลงได้ในการปรับปรุงการตรวจหาการรองรับแบบออฟไลน์ของ Progressive Web App
หากไม่แน่ใจว่าควรเริ่มต้นใช้งานจากตรงไหน โปรดดูWorkbox ซึ่งมีชุดไลบรารีที่ขับเคลื่อน Service Worker ที่พร้อมสำหรับการใช้งานจริงสำหรับ PWA ได้ หรือสำหรับหน้าสำรองแบบออฟไลน์แบบง่ายๆ ให้อ่านบทความ สร้างหน้าสำรองแบบออฟไลน์ที่มีโค้ดทั้งหมดที่ต้องการ ซึ่งคุณจะคัดลอกและวางในเว็บไซต์ได้โดยตรง
การแชร์เว็บและเป้าหมายการแชร์เว็บสำหรับเดสก์ท็อป
หากเว็บไซต์ของคุณอนุญาตให้ผู้ใช้สร้าง แก้ไข หรือโต้ตอบกับไฟล์ คุณควรใช้ Web Share และ Web Share Target API แทน API เหล่านี้ใช้งานได้ในอุปกรณ์เคลื่อนที่มาระยะหนึ่งแล้ว แต่ตอนนี้รองรับใน ChromeOS และ Windows แล้ว
Web Share ช่วยให้ผู้ใช้ส่งไฟล์หรือข้อมูลไปยังแอปอื่นๆ ที่ติดตั้งไว้ในอุปกรณ์ได้ เช่น การแชร์รูปภาพจาก Google Photos ไปยัง Twitter
async function share(title, text, url) {
try {
await navigator.share({title, text, url});
return true;
} catch (ex) {
console.error('Share failed', ex);
return false;
}
}
ในการลงทะเบียนเป็นเป้าหมายเพื่อให้แอปอื่นๆ แชร์ไฟล์หรือข้อมูลกับคุณได้ คุณจะต้องใช้ Web Share Target API
"share_target": {
"action": "/?share-target",
"method": "POST",
"enctype": "multipart/form-data",
"params": {
"files": [
{
"name": "file",
"accept": ["image/*"],
},
],
},
},
ดูคู่มือเริ่มต้นใช้งานได้จากผสานรวมกับ UI การแชร์ระบบปฏิบัติการด้วย Web Share API และการรับข้อมูลที่แชร์ด้วย Web Share Target API
และอื่นๆ
นอกจากนี้ยังมีอีกมากมาย
ตอนนี้ Chrome อนุญาต await
ระดับบนสุดภายในโมดูล JavaScript แล้ว
เราได้อัปเดตไอคอนที่แสดงในแถบอเนกประสงค์สำหรับ PWA ที่ติดตั้งได้เพื่อลดความสับสนของผู้ใช้
และหากคุณใช้กิจกรรมบนเว็บที่เชื่อถือได้เพื่อทำให้ PWA พร้อมใช้งานใน Play Store สำหรับ ChromeOS แล้ว คุณลงชื่อสมัครทดลองใช้ Digital Goods API จากต้นทางได้
อ่านเพิ่มเติม
ทั้งหมดนี้พูดถึงไฮไลต์สำคัญเพียงบางส่วน ไปที่ลิงก์ด้านล่างสำหรับ การเปลี่ยนแปลงเพิ่มเติมใน Chrome 89
- มีอะไรใหม่ใน Chrome DevTools (89)
- การเลิกใช้งานและการนำ Chrome 89 ออก
- การอัปเดต ChromeStatus.com สำหรับ Chrome 88
- มีอะไรใหม่ใน JavaScript ใน Chrome 88
- รายการเปลี่ยนแปลงที่เก็บของแหล่งที่มา Chromium
สมัครใช้บริการ
หากต้องการติดตามวิดีโอล่าสุด จากนั้นติดตามช่อง YouTube สำหรับนักพัฒนาซอฟต์แวร์ Chrome และคุณจะได้รับการแจ้งเตือนทางอีเมลทุกครั้งที่เราเปิดตัววิดีโอใหม่
ฉันชื่อ Pete LePage และทันทีที่เปิดตัว Chrome 90 ฉันจะมาบอกว่า มีอะไรใหม่ใน Chrome!
เครดิต
รูปภาพของ Raspberry Pis และ Arduino เขียนโดย Harrison Broadbent บน Unsplash