מה חדש ב-WebGPU (Chrome {/7}129)

François Beaufort
François Beaufort

תמיכה ב-HDR במצב מיפוי גוונים של לוח הציור

למפתחי אתרים יש אפשרויות מוגבלות להצגת תוכן HDR, והם מסתמכים בעיקר על הרכיבים <img> ו-<video>. עם זאת, הרכיב <canvas> נשאר מוגבל ל-SDR. כדי ליצור תוכן HDR דינמי בתוך אזור ציור, צריך לקודד את התוכן כתמונת HDR לפני שמציגים אותו (לדוגמה, אפשר לראות את הדמו הזה).

הפרמטר החדש GPUCanvasToneMappingMode בהגדרות של WebGPU canvas מאפשר ל-WebGPU לצייר צבעים בהירים יותר מלבן (#FFFFFF). הוא עושה את זה באמצעות המצבים הבאים:

  • ‫"standard": התנהגות ברירת המחדל מגבילה את התוכן לטווח SDR של המסך. ההשגה של המצב הזה מתבצעת על ידי הצמדה של כל ערכי הצבעים במרחב הצבעים של המסך למרווח [0, 1].

  • ‫"extended": ביטול הנעילה של טווח ה-HDR המלא של המסך. במצב הזה, "standard" תופס את הטווח [0, 1] של המסך. ההידוק או ההקרנה מתבצעים לטווח הדינמי המורחב של המסך, אבל לא ל-[0, 1].

בקטע הקוד הבא מוצג איך להגדיר בד לציור לטווח דינמי רחב.

const adapter = await navigator.gpu.requestAdapter();
const device = await adapter.requestDevice();

const canvas = document.querySelector("canvas");
const context = canvas.getContext("webgpu");

context.configure({
  device,
  format: "rgba16float",
  toneMapping: { mode: "extended" },
});

כדי לראות דוגמאות ל-HDR עם WebGPU, אפשר לעיין בדוגמה של חלקיקים (HDR) ובדוגמה של HDR עם WebGPU, וגם ברשומת ה-chromestatus.

מחשב נייד עם מסך HDR שמוצגת בו תמונה צבעונית.
דוגמה של חלקיקים (HDR) שמוצגת במסך HDR.

תמיכה מורחבת בתת-קבוצות

בעקבות ההודעה על ניסויים בתת-קבוצות, הפונקציות המובנות של תת-קבוצות זמינות עכשיו לשימוש גם ב-compute shaders וגם ב-fragment shaders. הם כבר לא מוגבלים רק ל-compute shaders. מידע נוסף

שימו לב שהערך המובנה subgroup_size כרגע מכיל באגים ב-fragment shaders. מומלץ להימנע ממנו בשלב הזה.

בנוסף, נוספו הפונקציות המובנות הבאות לתת-קבוצות:

  • ‫subgroupAdd(value): מחזירה את הסכום של כל הקריאות הפעילות values בקבוצת המשנה.
  • ‫subgroupExclusiveAdd(value): מחזירה את סכום הסריקה הבלעדי של כל הקריאות הפעילות values בתת-הקבוצה.
  • ‫subgroupMul(value): מחזירה את המכפלה של כל הקריאות הפעילות values בקבוצת המשנה.
  • ‫subgroupExclusiveMul(value): מחזירה את המכפלה הבלעדית של כל ההפעלות הפעילות values בקבוצת המשנה.

  • ‫subgroupAnd(value): מחזירה את הפעולה הבינארית AND של כל הקריאות הפעילות values בקבוצת המשנה.
  • ‫subgroupOr(value): מחזירה את הפעולה הבינארית OR של כל הקריאות הפעילות values בקבוצת המשנה.
  • ‫subgroupXor(value): מחזירה את ה-XOR הבינארי של כל הקריאות הפעילות values בקבוצת המשנה.

  • ‫subgroupMin(value): הפונקציה מחזירה את הערך המינימלי של כל הקריאות הפעילות values בתת-הקבוצה.
  • ‫subgroupMax(value): מחזירה את הערך המקסימלי של כל הקריאות הפעילות values בקבוצת המשנה.

  • ‫subgroupAll(value): מחזירה את הערך True אם value הוא True בכל ההפעלות הפעילות בתת-הקבוצה.
  • ‫subgroupAny(value): מחזירה true אם value הוא true עבור כל הפעלה פעילה בקבוצת המשנה.

  • ‫subgroupElect(): הפונקציה מחזירה את הערך True אם ההפעלה הזו כוללת את הערך הכי נמוך של subgroup_invocation_id מבין ההפעלות הפעילות בקבוצת המשנה.
  • ‫subgroupBroadcastFirst(value): שידור value מהפעלה פעילה עם הערך הכי נמוך של subgroup_invocation_id בקבוצת המשנה לכל ההפעלות הפעילות האחרות. ‫

  • ‫subgroupShuffle(value, id): מחזירה את הערך value מהקריאה הפעילה לפונקציה שבה subgroup_invocation_id תואם ל-id.
  • ‫subgroupShuffleXor(value, mask): מחזירה את הערך value מהקריאה הפעילה לפונקציה שבה subgroup_invocation_id תואם ל-subgroup_invocation_id ^ mask. ‫mask חייב להיות אחיד באופן דינמי.
  • ‫subgroupShuffleUp(value, delta): מחזירה את הערך value מהקריאה הפעילה לפונקציה שבה subgroup_invocation_id תואם ל-subgroup_invocation_id - delta.
  • ‫subgroupShuffleDown(value, delta): מחזירה את הערך value מהקריאה הפעילה לפונקציה שבה subgroup_invocation_id תואם ל-subgroup_invocation_id + delta.

  • ‫quadBroadcast(value, id): שידורים value מהפעלת הריבוע עם מזהה ששווה ל-id. ‫id חייב להיות ביטוי קבוע.
  • ‫quadSwapX(value): מחליף את value בין הפעלות ב-quad בכיוון X.
  • ‫quadSwapY(value): מחליף בין הפעלות של value בתוך הרביעייה בכיוון Y.
  • ‫quadSwapDiagonal(value): החלפה של value בין הפעלות במסך המפוצל באלכסון.

עדכונים של Dawn

המבנה wgpu::PrimitiveState כולל עכשיו ישירות את ההגדרה של בקרת חיתוך העומק, כך שאין צורך במבנה wgpu::PrimitiveDepthClipControl נפרד. למידע נוסף, אפשר לעיין בקטע הקוד הבא ובבקשת משיכה של webgpu-headers.

// Before
wgpu::PrimitiveState primitive = {};
wgpu::PrimitiveDepthClipControl depthClipControl;
depthClipControl.unclippedDepth = true;
primitive.nextInChain = &depthClipControl;
// Now
wgpu::PrimitiveState primitive = {};
primitive.unclippedDepth = true;

המידע הזה כולל רק נקודות עיקריות. רשימה מלאה של קומיטים

מה חדש ב-WebGPU

רשימה של כל הנושאים שמופיעים בסדרת המאמרים What's New in WebGPU.

‫Chrome 155-156

‫Chrome 153-154

‫Chrome 151-152

‫Chrome 149-150

‫Chrome 147-148

Chrome 146

Chrome 145

Chrome 144

Chrome 143

‫Chrome 142

Chrome 141

Chrome 140

Chrome 139

Chrome 138

Chrome 137

Chrome 136

Chrome 135

Chrome 134

Chrome 133

Chrome 132

Chrome 131

Chrome 130

Chrome 129

‫Chrome 128

Chrome 127

Chrome 126

Chrome 125

Chrome 124

Chrome 123

Chrome 122

Chrome 121

Chrome 120

Chrome 119

Chrome 118

Chrome 117

Chrome 116

Chrome 115

Chrome 114

Chrome 113