เผยแพร่เมื่อ: 19 พฤษภาคม 2026
เครื่องมือการเขียนโค้ดด้วย AI มีประสิทธิภาพอย่างมากในการเขียนโค้ด แต่มักจะแยกจากการดำเนินการ เครื่องมือเหล่านี้สามารถสร้างเว็บแอปที่ซับซ้อนได้ แต่ไม่สามารถสังเกตลักษณะการทำงานหรือตรวจสอบเอาต์พุตในเบราว์เซอร์ที่ใช้งานจริงได้
เครื่องมือสำหรับนักพัฒนาเว็บใน Chrome สำหรับ Agent ช่วยให้ Agent การเขียนโค้ดมองเห็นสิ่งที่จำเป็นในการยืนยัน แก้ไขข้อบกพร่อง และเพิ่มประสิทธิภาพโค้ดแบบเรียลไทม์ เมื่อ 2-3 เดือนที่ผ่านมา เราได้แสดงเครื่องมือนี้เป็นครั้งแรก, และตอนนี้เรายินดีที่จะประกาศว่าเครื่องมือสำหรับนักพัฒนาเว็บใน Chrome สำหรับ Agent พร้อมให้บริการแล้วในเวอร์ชัน 1.0 ที่เสถียร
เชื่อมต่อ Agent กับเบราว์เซอร์
เครื่องมือสำหรับนักพัฒนาเว็บใน Chrome สำหรับ Agent ช่วยให้ Agent ได้สัมผัสประสบการณ์การใช้งานเว็บไซต์เหมือนกับผู้ใช้จริง เวอร์ชันที่เสถียรนี้มีหลายวิธีให้คุณและ Agent โต้ตอบกับ Chrome ได้ ดังนี้
- เซิร์ฟเวอร์ Model Context Protocol (MCP): เซิร์ฟเวอร์ที่เชื่อมต่อโมเดล ภาษาขนาดใหญ่ (LLM) กับความสามารถในการแก้ไขข้อบกพร่องของเครื่องมือสำหรับนักพัฒนาเว็บ
- อินเทอร์เฟซบรรทัดคำสั่ง (CLI): ตัวเลือกที่มีประสิทธิภาพในการใช้โทเค็น ซึ่งช่วยให้ Agent จัดกลุ่มการดำเนินการเป็นสคริปต์ได้
- ทักษะของ Agent: คำแนะนำจากผู้เชี่ยวชาญที่สอนให้ Agent ทราบวิธีและเวลาที่จะ ใช้เครื่องมือเฉพาะสำหรับงานต่างๆ เช่น การแก้ไขข้อบกพร่องด้านการช่วยเหลือพิเศษหรือประสิทธิภาพ
แก้ไขข้อบกพร่อง จำลอง และตรวจสอบโดยอัตโนมัติ
ในเวอร์ชัน 1.0 นี้ Agent การเขียนโค้ดสามารถทำงานขั้นสูงในการแก้ไขข้อบกพร่องที่ก่อนหน้านี้ต้องทำด้วยตนเองได้แล้ว
ตรวจสอบคุณภาพโดยอัตโนมัติ
ตอนนี้ Agent สามารถเรียกใช้การตรวจสอบ Lighthouse เพื่อประเมินคุณภาพของเว็บไซต์ได้แล้ว โดยสามารถระบุปัญหาเกี่ยวกับการช่วยเหลือพิเศษ, SEO, แนวทางปฏิบัติแนะนำ และการท่องเว็บแบบ Agentic ซึ่งก็เหมือนกับการมี Linter ที่เข้าใจรันไทม์ เมื่อใช้เป็นเกตคุณภาพ เครื่องมือนี้จะเปลี่ยน Agent การเขียนโค้ดให้เป็นผู้เชี่ยวชาญที่ตรวจพบตัวบล็อกที่สำคัญก่อนที่จะเข้าสู่การใช้งานจริง
จำลองประสบการณ์ของผู้ใช้ในโลกจริง
Agent สามารถใช้เครื่องมือสำหรับนักพัฒนาเว็บใน Chrome สำหรับ Agent เพื่อทดสอบลักษณะและประสิทธิภาพของเว็บไซต์ใน อุปกรณ์ต่างๆ หรือในสถานที่ต่างๆ โดยใช้เครื่องมือจำลอง เครื่องมือ โดยสามารถปรับขนาดหน้าต่าง จำลองตำแหน่งทางภูมิศาสตร์ และจำกัดความเร็วของเครือข่ายและ CPU เพื่อเลียนแบบสภาพแวดล้อมในโลกจริง ด้วยวิธีนี้ Agent จะทดสอบลักษณะการทำงานเฉพาะของอุปกรณ์เคลื่อนที่ เช่น เมนูแฮมเบอร์เกอร์ได้โดยที่คุณไม่ต้องปรับขนาดเบราว์เซอร์ด้วยตนเอง
พัฒนาและแก้ไขข้อบกพร่องของส่วนขยาย Chrome
นอกจากนี้ คุณยังให้ Agent ช่วยคุณพัฒนาส่วนขยาย Chrome รวมถึงแก้ไขข้อบกพร่องของส่วนขยายได้ด้วย โดย Agent สามารถติดตั้ง โหลดซ้ำ และทริกเกอร์การดำเนินการของส่วนขยายได้โดยตรง ซึ่งจะช่วยให้วงจร "บันทึกและรีเฟรช" ที่ทำบ่อยๆ ระหว่างการพัฒนาเป็นไปโดยอัตโนมัติ นอกจากนี้ Agent ยังสามารถเจาะลึกสคริปต์เบื้องหลังและหน้าส่วนขยายเพื่อช่วยคุณแก้ไขข้อบกพร่องในการตั้งค่าเบราว์เซอร์ที่ซับซ้อนมากขึ้นได้ด้วย
แก้ไขข้อบกพร่องและทดสอบเครื่องมือ WebMCP
นอกจากนี้ เรายังเพิ่มการมองเห็นเชิงลึกในการทดลองใช้ WebMCP (Web Model Context Protocol) เพื่อช่วยคุณใช้ API ใหม่นี้
แทนที่จะให้ Agent อาศัยสัญญาณเพื่ออนุมานแผนการนำทาง DOM ตอนนี้ Agent สามารถโต้ตอบกับเครื่องมือที่มีโครงสร้างที่คุณเปิดเผยโดยใช้ WebMCP ได้โดยตรง ซึ่งจะช่วยให้พัฒนา ทดสอบ และแก้ไขข้อบกพร่องของเครื่องมือเหล่านี้ได้ง่ายขึ้น โดย Agent สามารถแสดงรายการ เรียกใช้แบบเป็นโปรแกรม และตรวจสอบความถูกต้องแบบเรียลไทม์ ซึ่งจะช่วยปรับปรุงกระบวนการเพิ่มการรองรับ WebMCP ลงในเว็บไซต์และการทดสอบ
ตรวจหาและแก้ไขข้อบกพร่องของหน่วยความจำรั่ว
นอกจากนี้ เรายังได้เพิ่มเครื่องมือเฉพาะสำหรับการวิเคราะห์หน่วยความจำ ตอนนี้ Agent สามารถใช้สแนปชอตฮีปเพื่อระบุหน่วยความจำรั่ว เช่น โหนด DOM ที่แยกออกได้แล้ว เมื่อใช้ทักษะเฉพาะในการแก้ไขข้อบกพร่องของหน่วยความจำรั่วไหล Agent จะทำหน้าที่เป็นผู้เชี่ยวชาญด้านประสิทธิภาพเพื่อช่วยให้แอปพลิเคชันของคุณมีขนาดเล็กและทำงานได้รวดเร็ว
ส่งต่อเซสชันด้วยการเชื่อมต่ออัตโนมัติ
คุณสามารถแชร์บริบทเบราว์เซอร์ปัจจุบันกับ Agent, แทนที่จะให้ Agent เปิดอินสแตนซ์เบราว์เซอร์แบบแซนด์บ็อกซ์ของตัวเอง (ซึ่งเป็นวิธีที่ เครื่องมือสำหรับนักพัฒนาเว็บสำหรับ Agent มักจะให้สิทธิ์เข้าถึงเบราว์เซอร์แก่ Agent) วิธีนี้เหมาะอย่างยิ่งสำหรับการแก้ไขข้อบกพร่องที่ต้องมีการเข้าสู่ระบบ เช่น แดชบอร์ดที่ผ่านการตรวจสอบสิทธิ์ ซึ่งคุณต้องการให้ AI Agent เข้ามาตรวจสอบทางเทคนิคแทนคุณโดยที่คุณไม่ต้องตรวจสอบสิทธิ์ทุกอย่างอีกครั้ง
เปิดเผยสถานะภายในด้วยเครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ของบุคคลที่สาม
เครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ของบุคคลที่สามช่วยให้เว็บแอปพลิเคชันแชร์สถานะภายในและรายละเอียดคอมโพเนนต์กับ AI Agent ได้โดยตรง เครื่องมือเหล่านี้ให้สิทธิ์เข้าถึงข้อมูลที่โดยปกติแล้วจะซ่อนจากการวิเคราะห์มาตรฐาน ซึ่งจะช่วยให้ Agent มีบริบทที่จำเป็นในการทำความเข้าใจตรรกะที่ซับซ้อน ซึ่งจะส่งผลให้ได้คำแนะนำในการแก้ไขข้อบกพร่องที่แม่นยำมากขึ้นโดยอิงตามลักษณะการทำงานจริงของแอปพลิเคชันในเบราว์เซอร์
เริ่มต้นใช้งาน
คุณสามารถติดตั้งเวอร์ชันที่เสถียรโดยใช้ npm หรือกำหนดค่าโดยตรงใน Agent ที่เลือกได้ ดังนี้
Antigravity
เครื่องมือสำหรับนักพัฒนาเว็บใน Chrome สำหรับ Agent มาพร้อมกับ Antigravity 2.0 ที่รวมไว้ล่วงหน้า คุณสามารถเริ่มใช้งานได้ทันทีด้วย Agent ย่อยของเบราว์เซอร์ ลองใช้คำสั่งเครื่องหมายทับ เช่น
/browser Navigate to the Google homepage
หากต้องการเข้าถึงทักษะเฉพาะของ Agent เราขอแนะนำให้ติดตั้งปลั๊กอินเครื่องมือสำหรับนักพัฒนาเว็บในขั้นตอนสร้างด้วย Google ของการตั้งค่าเริ่มต้นหรือในการตั้งค่าแอปพลิเคชัน ดูข้อมูลเพิ่มเติมได้ในเอกสารประกอบ Agent ย่อยของเบราว์เซอร์ Antigravity
Gemini CLI
หากต้องการติดตั้งแพ็กเกจและทักษะ MCP เป็นส่วนขยาย ให้ใช้คำสั่งต่อไปนี้
$ gemini extensions install --auto-update https://github.com/ChromeDevTools/chrome-devtools-mcp
Claude Code
หากต้องการติดตั้งเครื่องมือสำหรับนักพัฒนาเว็บใน Chrome สำหรับ Agent เป็นปลั๊กอิน Claude Code ให้ใช้คำสั่ง Slash ต่อไปนี้ใน Claude Code เพิ่มรีจิสทรี Marketplace
/plugin marketplace add ChromeDevTools/chrome-devtools-mcp
และติดตั้งปลั๊กอินจากรีจิสทรี Marketplace
/plugin install chrome-devtools-mcp@chrome-devtools-plugins
ดูคำแนะนำโดยละเอียดและข้อความแจ้งตัวอย่างได้ที่เอกสารประกอบเครื่องมือสำหรับนักพัฒนาเว็บใน Chrome สำหรับ Agent นอกจากนี้ คุณยังสำรวจ ซอร์สโค้ดได้ใน GitHub