חדש ב-Chrome 94

Pete LePage

דברים שעליך לדעת:

  • מרחב הצבעים שמוגדר כברירת מחדל לאלמנטים מסוג <canvas> מוגדר עכשיו באופן רשמי במפרט בתור SRGB, ואפשר לשנות אותו ל-Display P3.
  • WebCodecs היא דרך חדשה ברמה נמוכה לגשת לקודקים מובנים של אודיו וידאו, חשובה לסטרימינג של משחקים, תוכנות לעריכת וידאו וכו'.
  • WebGPU מתחיל את תקופת הניסיון שלו במקור.
  • כנס PWA יתקיים ב-6 וב-7 באוקטובר.
  • ויש עוד הרבה.

קוראים לי Pete LePage ואני עובד ומצלם מהבית. עכשיו נצלול פנימה ונראה מה חדש למפתחים ב-Chrome 94.

מרחב הצבעים שמוגדר כברירת מחדל לאלמנטים מסוג canvas

האופן שבו הצבע מוצג במסך הוא קריטי לחלק מהמשתמשים. צלם, מאייר דיגיטלי ועוד רבים אחרים צריכים שהצבעים במסך יהיו זהים לצבעים בתמונה המודפסת. החל מגרסה 94 של Chrome, רכיבי <canvas> מנוהלים בצורה מלאה באמצעות sRGB. בעבר, sRGB היה מוסכמה, אבל לא הוגדר במפורש במפרט.

opts = {colorSpace:'display-p3'};
const ctx = canvas.getContext('2d', opts);

חשוב יותר, עכשיו אפשר לציין את מרחב הצבעים שבו רוצים להשתמש כשיוצרים אובייקט 2D של הקשר עיבוד <canvas> או אובייקט ImageData, כולל מרחב הצבעים P3.

WebCodecs

הוספת סרטון לדף היא פעולה פשוטה למדי. אבל אם אתם צריכים לבצע פעולה מורכבת יותר ולנהל אינטראקציה עם הרכיבים של סטרימינג וידאו, זה קשה, ובדרך כלל צריך להשתמש ב-Web Assembly כדי לשלוח קודקים משלכם.

אבל שליחת קודק משלכם פירושה כתיבת קוד שכבר קיים בדפדפן, והוא לא יכול לנצל את היתרונות של האצת חומרה. באמצעות Web Codecs API אפשר להשתמש ברכיבי המדיה ובקודקים שכבר נמצאים בדפדפן.

באופן אישי, תמיד היה לי קשה לזכור את המתגים הנכונים בשורת הפקודה כדי לקודד סרטון לאינטרנט או כדי להמיר קובץ GIF לקובץ וידאו. באמצעות ממשקי ה-API שזמינים דרך WebCodecs, הצלחתי ליצור במהירות אפליקציית אינטרנט שקוראת קובץ ומייצאת את הקבצים הנכונים שנדרשים לאינטרנט.

הנתיב מ-Canvas או מ-ImageBitmap לרשת או לאחסון
הנתיב מ-Canvas או מ-ImageBitmap לרשת או לאחסון

אפליקציות אינטרנט שדורשות שליטה מלאה על האופן שבו תוכן המדיה מעובד, כמו כלי עריכת וידאו, שיחות ועידה בווידאו, אפליקציות סטרימינג וכו'. הגישה לבקרי המדיה המובנים בדפדפנים היא עצומה.

קשה להציג משהו שימושי ב-30 שניות, לכן כדאי לעיין במאמר עיבוד וידאו באמצעות WebCodecs ב-web.dev כדי לקבל הסבר מעמיק עם הרבה קוד וכמה הדגמות מגניבות.

WebGPU

WebGPU הוא ממשק API חדש שמציג יכולות גרפיקה מודרניות, במיוחד Direct3D 12,‏ Metal ו-Vulkan. אפשר להתייחס אליו כמו ל-WebGL, אבל הוא מספק גישה לתכונות מתקדמות יותר של ה-GPU, וגם תמיכה בביצוע חישובים כלליים ב-GPU.

תרשים ארכיטקטורה שבו מוצג החיבור של WebGPUs בין ממשקי ה-API של מערכת ההפעלה לבין Direct3D 12,‏ Metal ו-Vulkan.
תרשים הארכיטקטורה של WebGPU

אנחנו מתחילים גרסת מקור לניסיון ב-Chrome 94, וגם ב-Safari וב-Firefox עובדים כרגע על הטמעות.

דוגמה ל-Babylon.js של סימולציה של ים סוער באמצעות יכולת ה-compute shader של WebGPU.

François פרסם מאמר מעולה בנושא גישה לתכונות מודרניות של GPU באמצעות WebGPU באתר web.dev, שבו הוא משווה בין הביצועים של כפל מטריצות שפועל במעבד (CPU) לבין הביצועים של כפל מטריצות שפועל ב-GPU. הנה רמז. ה-GPU מנצח.

PWA Summit

כנס PWA יתקיים ב-6 וב-7 באוקטובר. זו ועידה אונליין חינמית שמטרתה לעזור לכולם להצליח עם אפליקציות Progressive Web App. כנס PWA Summit הוא שיתוף פעולה בין אנשים מכמה חברות שונות שמעורבות ביצירה של טכנולוגיות PWA: Google,‏ Intel,‏ Microsoft ו-Samsung.

יש המון תוכן ושיחות מעולות. מידע נוסף והרשמה זמינים בכתובת PWASummit.org. אני מקווה לראות אותך שם!

ועוד.

כמובן שיש עוד הרבה.

השיטה עם העדיפות scheduler.postTask() מאפשרת לתזמן משימות, לשנות את העדיפויות שלהן באופן דינמי או לבטל את כולן.

אם ניסיתם אי פעם לשנות את הפריסה כשהופיעו סרגליות גלילה, הנכס scrollbar-gutter יעזור לכם. היא מאפשרת לקבוע אם יוצגו פסולות לצד סרגל הגלילה, וכך למנוע שינויים בפריסה כשהתוכן מתרחב.

השימוש ב-WebSQL בהקשרים של צד שלישי הוצא משימוש, והוא יוסר ב-Chrome 97. סטנדרט Web SQL Database הוצא משימוש בנובמבר 2010. היא מעולם לא יושמה ב-Firefox, והוצאה משימוש ב-Safari בשנת 2019. הוא יוסר מ-Chrome כששיעור השימוש בו יהיה נמוך מספיק. אם אתם עדיין משתמשים ב-WebSQL, כדאי להתחיל לתכנן את ההעברה ממנו.

בנוסף, ממשק ה-API של המקלדת הווירטואלית מאפשר לכם לשלוט טוב יותר באופן שבו המקלדת הווירטואלית במסך מוצגת ובמועד שבו היא מוצגת. הוא מאפשר לשלוט באופן מפורש בהתנהגות הגלילה או בשינויים בפריסה כשהקליד מופיע או נעלם.

קריאה נוספת

כאן מפורטות רק חלק מהנקודות העיקריות. בקישורים הבאים מפורטים שינויים נוספים ב-Chrome 94.

להרשמה

כדי להתעדכן, נרשמים לערוץ YouTube למפתחי Chrome, ומקבלים התראה באימייל בכל פעם שאנחנו משיקים סרטון חדש.

קוראים לי פיט לייפיג', ואחרי שגרסת Chrome 95 תפורסם, אספר לכם מה חדש ב-Chrome.