ทีม Web Dev Ecosystem - สรุปผลเดือนกุมภาพันธ์

Mariko Kosaka
X
ยินดีต้อนรับสู่ภาคแรกของสรุปประจำเดือน ซึ่งเราจะย้อนดูสิ่งที่เกิดขึ้นในทีมระบบนิเวศของนักพัฒนาเว็บ✨

เราคือทีมวิศวกรและผู้สื่อสารที่เขียนบทความและตัวอย่างโค้ด เช่น พื้นฐานเกี่ยวกับเว็บในเว็บไซต์นี้ และพอร์ทัลใหม่ล่าสุดอย่าง web.dev นอกจากนี้ คุณยังดูผลงานของเราในช่อง YouTube ได้ด้วย และอย่าลืมติดตามเราที่ @ChromiumDev :)

แม้เดือนกุมภาพันธ์จะเป็นเดือนที่สั้น แต่เราก็มีเนื้อหาให้คุณรับชมอย่างแน่นอน มาเริ่มกันที่การเปิดตัวครั้งใหญ่จากทีม

การเปิดตัว

Workbox

Workbox 4.0 เปิดตัวไปเมื่อไม่กี่วันที่ผ่านมา🎉 โดยรุ่นนี้มีฟีเจอร์ใหม่ที่น่าทึ่งอย่าง workbox-window และการปรับปรุงแพ็กเกจ Workbox ที่มีอยู่หลายรายการ สําหรับผู้ที่ใช้ Workbox อยู่แล้ว โปรดดูคําแนะนําในการย้ายข้อมูลจาก v3 ไปยัง v4 สงสัยไหมว่าจะใช้ Workbox ในโปรเจ็กต์ที่มีอยู่ได้อย่างไร ต่อไปนี้เป็นคำแนะนำในการใช้กับเครื่องมือรวมที่คุณเลือก หากไม่แน่ใจว่าเวิร์กบ็อกซ์ช่วยแก้ปัญหาอะไรได้บ้าง ดูบทสัมภาษณ์เกี่ยวกับ Service Worker ในรายการ State of the Web

lit-html และ LitElement

ทีมในโปรเจ็กต์ Polymer กำลังยุ่งอยู่กับรุ่นเสถียรของ lit-html และ LitElement ซึ่งเป็น 2 ไลบรารีสำหรับการพัฒนาเว็บรุ่นถัดไป หากต้องการลองใช้ ให้เริ่มด้วยคำแนะนำลองใช้ LitElement 📝

กิจกรรมในเว็บซึ่งเชื่อถือได้

กิจกรรมบนเว็บที่เชื่อถือได้ (TWA) ได้เปิดตัวสู่ตลาดแล้วพร้อมกับการเปิดตัว Chrome 72 TWA ช่วยให้คุณใช้ Chrome แบบเต็มหน้าจอภายในกิจกรรม Android ได้ ซึ่งหมายความว่าคุณสามารถนําเนื้อหาบนเว็บมาไว้ในแอปได้📱 ดูคู่มือการเริ่มต้นใช้งานนี้หรืออ่านวิธีที่ @svenbudak เผยแพร่ PWA ของตนใน Google Play Store

สิ่งที่จะเกิดขึ้นต่อไป

เราได้เตรียมฟีเจอร์ที่น่าสนใจมากมายมาให้คุณทราบเนื่องด้วย Chrome 73 เวอร์ชันเสถียรกำลังจะเปิดตัว (12 มีนาคม)

V8 - เครื่องมือรันไทม์ JavaScript ของ Chrome มีการอัปเดตมากมาย รวมถึง Object.fromEntries และ String.prototype.matchAll อ่านบันทึกประจำรุ่น v8

ทำงานกับเสียงและวิดีโอบนเว็บอยู่ใช่ไหม ตอนนี้เรารองรับปุ่มสื่อของฮาร์ดแวร์แล้ว และ "ข้ามโฆษณา" ในหน้าต่างภาพในภาพก็พร้อมให้ทดลองใช้แล้วในรุ่นที่ใช้งานจริง ดูข้อมูลเพิ่มเติมได้ที่การอัปเดตเสียง/วิดีโอใน Chrome 73

พูดถึงการทดลองใช้ต้นทาง เตรียมพร้อมสําหรับลําดับความสําคัญในการดึงข้อมูลด้วยลําดับความสําคัญในการดึงข้อมูล นักพัฒนาซอฟต์แวร์สามารถกําหนดความสําคัญขององค์ประกอบ <script>, <img> หรือ <link> เพื่อบอกเบราว์เซอร์ว่าจะโหลดองค์ประกอบเหล่านั้นอย่างไร ฟีเจอร์นี้ยังอยู่ในขั้นทดลอง โปรดลองใช้และส่งความคิดเห็น

ประสิทธิภาพการแสดงผลเป็นสิ่งที่เราให้ความสำคัญเสมอ ใน Chrome 73 โปรแกรมฟัง wheel และ mousewheel ที่ลงทะเบียนในเป้าหมายรูท (หน้าต่าง เอกสาร หรือบอดี้) จะเป็นโปรแกรมฟังแบบพาสซีฟโดยค่าเริ่มต้น ซึ่งจะเลื่อนด้วยล้อโดยค่าเริ่มต้น

นอกจากการต้อนรับฟีเจอร์ใหม่แล้ว เรายังต้องบอกลาฟีเจอร์เก่าๆ ด้วย โปรดดูการเลิกใช้งานและการนำออกสำหรับ Chrome 73 ด้วย

การพัฒนาใหม่

ต่อไปนี้คือฟีเจอร์เพิ่มเติมที่เรากำลังพัฒนาและจะพร้อมให้บริการในเบราว์เซอร์ของคุณ

เรากําลังพัฒนา API ใหม่ที่เรียกว่า Trusted Types เพื่อช่วยป้องกัน Cross-Site Scripting การเลือกประเภทที่เชื่อถือได้ (ผ่านนโยบายรักษาความปลอดภัยเนื้อหา) จะล็อกเอกสารไม่ให้มี DOM แทรก เรากำลังหาตัวอย่างโค้ดและคำแนะนำเพิ่มเติมเกี่ยวกับเรื่องนี้ แต่ในระหว่างนี้โปรดอ่านเพิ่มเติมเกี่ยวกับประเภทที่เชื่อถือได้เพื่อลองใช้

การกดปุ่มย้อนกลับและไปข้างหน้าใน Chrome อาจเร็วมากในเร็วๆ นี้ เรากําลังสํารวจแคชย้อนกลับ/ไปข้างหน้าแบบใหม่เพื่อแคชหน้าเว็บในหน่วยความจําเมื่อผู้ใช้ไปยังหน้าอื่น ดูคำอธิบายและต้นแบบของ bfcache ในโพสต์นี้

สุดท้าย Intersection Observer v2 นำเสนอแนวคิดในการติดตาม "การแสดงผล" จริงของเป้าหมาย

สิ่งที่เรากำลังดำเนินการ

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

วิดีโอและพอดแคสต์ใหม่

Martin จะเริ่มซีรีส์ใหม่ชื่อ JavaScript SEO โดยตอนแรกจะเกี่ยวกับวิธีที่ Google Search จัดทําดัชนีเว็บไซต์ JavaScript เมื่อเร็วๆ นี้ Meggin ได้นำเสนอมุมมองเกี่ยวกับโปรเจ็กต์ web.dev ในงานพบปะ Jake และ Surma กลับมาพร้อมพอดแคสต์ HTTP203 ตอนที่ใหม่เกี่ยวกับการทดลองการหมุนรูปภาพ

นอกจากนี้ เรายังมีรายการที่ออกอากาศเป็นประจำ เช่น "มีอะไรใหม่ใน Chrome", "มีอะไรใหม่ใน DevTools" และ"สถานะของเว็บ"" ในช่อง YouTube

การกล่าวขอบคุณเป็นพิเศษ

คุณเคยดูตัวอย่าง Puppeteer ไหม คุณอาจเคยเห็นจากทวีตของ Eric Bidelman "📯The 12 Days of Puppeteer 🤹🏻‍♂️🎁" เมื่อปีที่แล้ว นี่เป็นคอลเล็กชันตัวอย่างโค้ด Puppeteer ที่ยอดเยี่ยมซึ่งจะช่วยให้คุณคิดอย่างสร้างสรรค์เกี่ยวกับสิ่งที่ทำได้ด้วยเบราว์เซอร์ คุณควรลองเข้าไปดูนะ

(ขอให้โชคดีในเส้นทางใหม่นะ Eric เราจะคิดถึงคุณนะ)

สรุป

คุณชอบสรุปประจำเดือนฉบับแรกไหม หากชอบหรือมีไอเดียในการปรับปรุง โปรดแจ้งให้เราทราบทาง Twitter @kosamari ✅

หากคุณสร้างสิ่งใหม่ๆ โดยใช้ฟีเจอร์ที่เปิดตัวที่นี่หรือเปลี่ยนแปลงบางอย่างในโค้ดเบสตามบทความของเรา โปรดแจ้งให้เราทราบที่ @ChromiumDev

ในเดือนมีนาคม พวกเราบางส่วนจะเดินทางไปอินเดียเพื่อเรียนรู้เพิ่มเติมเกี่ยวกับประสบการณ์การใช้งานเว็บบนอุปกรณ์เคลื่อนที่ ✈️ เราหวังว่าจะได้แชร์สิ่งที่ได้เรียนรู้จากการเดินทางครั้งนี้

แล้วพบกันใหม่เดือนหน้า👋