דף זה תורגם על ידי Cloud Translation API.

מה'חדש ב-WebGPU (Chrome {8/}113)

François Beaufort

אחרי שנים של פיתוח, צוות Chrome מכריז שהגרסה הראשונה של WebGPU זמינה עכשיו כברירת מחדל ב-Chrome ב-ChromeOS, ב-macOS וב-Windows. מידע נוסף זמין במאמר WebGPU מגיע ל-Chrome.

התחלנו גם להוסיף מסמכי עזרה מקיפים בנושא WebGPU ב-MDN.

ויש עוד.

שימוש במקור `VideoFrame` של WebCodecs ב-`importExternalTexture()`

WebGPU חושף ממשק API ליצירת אובייקטים של 'טקסטורה חיצונית' אטומים מ-HTMLVideoElement ועד importExternalTexture(). אפשר להשתמש באובייקטים האלה כדי לדגום את הפריימים של הסרטון ביעילות, אולי ללא העתקה ישירות מנתוני YUV המקור.

עם זאת, במפרט הראשוני של WebGPU אי אפשר ליצור אובייקטים מסוג GPUExternalTexture מאובייקטים מסוג VideoFrame של WebCodecs. היכולת הזו חשובה לאפליקציות מתקדמות לעיבוד וידאו שכבר משתמשות ב-WebCodecs ורוצות לשלב את WebGPU בצינור עיבוד הווידאו. הדיון מתנהל כרגע בבעיה gpuweb/gpuweb#1380.

הפעלת התכונה

כברירת מחדל, התכונה הזו לא מופעלת ב-Chrome, אבל אפשר להתנסות בה ב-Chrome 113 על ידי הפעלה מפורשת של הפונקציונליות. אפשר להפעיל אותו באופן מקומי על ידי הפעלת הדגל 'WebGPU Developer Features' (תכונות למפתחים של WebGPU) ב-chrome://flags/#enable-webgpu-developer-features.

כדי להפעיל את התכונה לכל המבקרים באפליקציה, אנחנו עורכים גרסת טרום-השקה שתסתיים בגרסת Chrome 118 (8 בדצמבר 2023). כדי להשתתף בתקופת הניסיון, צריך להירשם ולכלול מטא אלמנט עם אסימון המקור לניסיון בכותרת ה-HTML או ה-HTTP. מידע נוסף זמין בפוסט תחילת העבודה עם ניסויים במקור.

קוד לדוגמה

// Access the GPU device.
const adapter = await navigator.gpu.requestAdapter();
const device = await adapter.requestDevice();

// Create VideoFrame from HTMLVideoElement.
const video = document.querySelector("video");
const videoFrame = new VideoFrame(video);

const texture = device.importExternalTexture({ source: videoFrame });
// TODO: Use texture in bind group creation.

כדאי לעיין בדוגמה הניסיונית העלאת סרטונים באמצעות WebCodecs כדי לנסות את התכונה.

מה'חדש ב-WebGPU (Chrome {8/}113)

שימוש במקור `VideoFrame` של WebCodecs ב-`importExternalTexture()`

הפעלת התכונה

קוד לדוגמה