ข้อมูลอัปเดต 10 ประการจาก Google I/O 2024: ปลดล็อกศักยภาพของ AI สำหรับนักพัฒนาเว็บทุกราย

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

1. การผสานรวม Gemini Nano ใน Chrome เดสก์ท็อปเพื่อมอบฟีเจอร์ AI ใหม่ในอุปกรณ์

ตั้งแต่ Chrome 126 เป็นต้นไป Gemini Nano จะรวมอยู่ใน Chrome บนเดสก์ท็อป เหตุใดจึงสำคัญ คุณจะนําเสนอฟีเจอร์ AI ที่มีประสิทธิภาพให้แก่ผู้ใช้ Chrome หลายพันล้านคนได้โดยไม่ต้องกังวลเกี่ยวกับวิศวกรรมที่รวดเร็ว การปรับแต่ง ความสามารถ หรือค่าใช้จ่าย ฟีเจอร์ "ช่วยฉันเขียน" พร้อมให้ใช้งานใน Chrome บนอุปกรณ์เพื่อช่วยผู้ใช้เขียนเนื้อหาแบบสั้น

ร่วมกำหนดอนาคตของเว็บด้วยการลงชื่อสมัครใช้โปรแกรมทดลองใช้ก่อนเปิดตัว

2. WebAssembly และ WebGPU เปิดใช้ AI ในอุปกรณ์ ไม่ว่าคุณจะใช้โมเดล AI ใดก็ตาม

เราได้ลงทุนอย่างมหาศาลเพื่อให้โมเดล AI ทำงานได้อย่างรวดเร็วและมีประสิทธิภาพโดยใช้ WebGPU และ Wasm ซึ่งเป็นเทคโนโลยีสําคัญที่ช่วยให้ AI ในอุปกรณ์ทํางานบนเว็บได้ การปรับปรุงใหม่ๆ เช่น ค่าทศนิยม 16 บิตใน WebGPU, Memory64 และการใช้งาน JavaScript Promise ใน Wasm ช่วยให้ AI ทำงานได้เร็วขึ้น เมื่อใช้ Wasm และ WebGPU ไลบรารี AI จะเรียกใช้โมเดลในวงกว้างได้บนฮาร์ดแวร์หลากหลายประเภท

3. เครื่องมือสำหรับนักพัฒนาเว็บใน Chrome ที่ทำงานด้วยระบบ AI จะปรับปรุงกระบวนการแก้ไขข้อบกพร่อง

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

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

4. Speculation Rules API มอบประสบการณ์การท่องเว็บที่รวดเร็ว

Speculation Rules API ใหม่ช่วยให้การไปยังส่วนต่างๆ ทำได้เกือบจะทันที เพิ่มความเร็วในการเรียกดูได้อย่างมากด้วยการดึงข้อมูลและแสดงผลหน้าเว็บล่วงหน้าในเบื้องหลัง คิดเป็นมิลลิวินาทีแทนวินาที ที่สำคัญที่สุดคือ เริ่มต้นใช้งานได้ง่ายๆ ด้วยโค้ดเพียงไม่กี่บรรทัด และสามารถใช้ AI เพื่อคาดการณ์รูปแบบการไปยังส่วนต่างๆ อย่างชาญฉลาด

ตัวอย่าง Tokopedia: ผลลัพธ์ของการแสดงผลล่วงหน้าที่ทําให้เวลาในการโหลดเร็วขึ้นมาก แม้ในการเชื่อมต่อที่ช้า

5. ดูทรานซิชันสําหรับเว็บไซต์หลายหน้า

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

6. แดชบอร์ดแพลตฟอร์มเว็บเพื่อดูภาพรวมในเบราว์เซอร์ต่างๆ

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

7. เครื่องมือพื้นฐานในเวิร์กโฟลว์

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

8. การจัดระเบียบข้อมูลบางส่วนใน Angular ช่วยปรับปรุงประสิทธิภาพ

เราเชื่อว่า Angular เป็นแพลตฟอร์มที่ดีที่สุดแพลตฟอร์มหนึ่งในการสร้างและใช้งานเว็บแอป ตอนนี้เรากําลังทํางานเกี่ยวกับการไฮเดรตบางส่วน เพื่อให้ JavaScript โหลดและไฮเดรตเฉพาะบางส่วนของแอปเมื่อจําเป็นเท่านั้น ซึ่งจะปรับปรุง Core Web Vitals อย่างมากสําหรับแอปที่ไวต่อประสิทธิภาพ ลองดูในรุ่นตัวอย่างสำหรับนักพัฒนาซอฟต์แวร์ในอีก 2-3 สัปดาห์ข้างหน้า

9. ความสามารถในการตอบสนองแบบละเอียดของ Angular ที่มี Signals ตั้งแต่แกะกล่อง

เราต้องการให้คุณควบคุมการตรวจหาและการจัดการการเปลี่ยนแปลงในแอปได้อย่างละเอียดยิ่งขึ้น ต่อไปนี้คือความไวต่อการเปลี่ยนแปลงแบบละเอียดด้วย Signals Angular มีชุด Reactive API ชุดใหม่ที่ช่วยให้นักพัฒนาซอฟต์แวร์ได้รับประสบการณ์การใช้งานสัญญาณที่ยอดเยี่ยม และสัญญาณจะเปิดใช้การตรวจหาการเปลี่ยนแปลงแบบละเอียดซึ่งจะตรวจสอบเพียงเศษเสี้ยวของต้นไม้คอมโพเนนต์เพื่อนำไปใช้กับการเปลี่ยนแปลงสถานะ คุณจึงไม่ต้องเพิ่มประสิทธิภาพ UI ด้วยตนเองอีกต่อไป

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

10. สร้างประสบการณ์การใช้งานที่สมจริงแบบ 3 มิติใน Maps JavaScript API

เรากำลังปลดล็อกวิธีใหม่ๆ ในการสร้างประสบการณ์การใช้งานเว็บที่สมจริงยิ่งขึ้น ด้วยการนําแผนที่ 3 มิติแบบสมจริงมาไว้ใน Maps JavaScript API ที่คุ้นเคยจาก Google Maps Platform ตอนนี้คุณใช้ประโยชน์จากเทคโนโลยีการแสดงผลของ Google เพื่อแสดงแผนที่ 3 มิติที่สมบูรณ์ในความเร็วที่ผู้ใช้คาดหวังได้แล้ว ที่สำคัญคือคุณเริ่มต้นใช้งานได้ด้วยโค้ดเพียงบรรทัดเดียว

เราอดใจรอที่จะได้ดูประสบการณ์ที่น่าทึ่งและสมจริงที่คุณสร้างขึ้น ดูข้อมูลเพิ่มเติม


ทุกวัน คุณกำลังฝ่าฟันความซับซ้อนของการพัฒนาและขยายขีดจำกัดของสิ่งที่เป็นไปได้ เรายินดีที่จะช่วยคุณสร้างประสบการณ์ใหม่ๆ ให้พวกเราทุกคนได้เพลิดเพลิน โปรดไปที่ developer.chrome.com และ web.dev เพื่อดูข้อมูลเพิ่มเติมเกี่ยวกับเว็บที่มีประสิทธิภาพนี้ซึ่งใช้งานได้ง่ายขึ้น และอย่าลืมติดตามเราใน X, YouTube และตอนนี้ก็ยังมี LinkedIn ด้วย

แล้วพบกันใหม่ในงาน I/O ครั้งถัดไป