תכונה חדשה בפלטפורמת האינטרנט ביוני

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

גרסאות יציבות של דפדפנים

ביוני, Chrome 103 ו-Firefox 102 התייצבו.

טרנספורמציה של זרמים וזרימת בייטים קריאים

גרסה 102 של Firefox כוללת תמיכה ב-Transform Streams. כך מתאפשרת יצירת צירים מ-ReadableStream ל-WritableStream, ומבצעת טרנספורמציה במקטעים. טוב לראות שהתכונה הזו זמינה בכל שלושת המנועים, ולכן זהו זמן טוב מאוד ללמוד על עדכוני התוכן.

תמיכה בדפדפן

  • 67
  • 79
  • 102
  • 14.1

מקור

שידורים של בייטים קריאים נתמכים עכשיו גם ב-Firefox 102, ומאפשרים קורא BYOB (עם מאגר נתונים זמני) בעזרת הממשק של ReadableStreamBYOBReader. ניתן להשתמש בו כדי לשדר נתונים שסופקו על ידי המפתח.

תמיכה בדפדפן

  • 89
  • 89
  • 102
  • x

מקור

גישה לגופנים שהותקנו באופן מקומי

גרסה 103 של Chrome כוללת את Local Font Access API, שמאפשר גישה לגופנים שמותקנים באופן מקומי על ידי המשתמש. אחרי בקשת גישה לגופנים שמותקנים במכשיר, צריך לבצע קריאה אל window.queryLocalFonts() כדי לקבל מגוון של הגופנים המותקנים.

const pickedFonts = await window.queryLocalFonts();
for (const fontData of pickedFonts) {
  console.log(fontData.postscriptName);
  console.log(fontData.fullName);
  console.log(fontData.family);
  console.log(fontData.style);
}

תכונת המדיה update

Firefox 102 כולל את תכונת המדיה update. משמש כדי לברר אם מכשיר הפלט יכול לשנות את מראה התוכן לאחר שהוא עבר רינדור.

תמיכה בדפדפן

  • 113
  • 113
  • 102
  • 17

מקור

קוד מצב HTTP חדש—103 רמזים מוקדמים

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

גרסאות של דפדפן בטא

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

גרסאות בטא חדשות באפריל היו Chrome 104, Firefox 103 ו-Safari 16.

תחביר חדש לשאילתות מדיה של טווח

Chrome 104 כולל את התחביר החדש לשאילתות מדיה טווח, מהמפרט 'שאילתות מדיה ברמה 4'. לדוגמה, שאילתת מדיה שנכתבה בעבר כך:

@media (min-width: 400px) { … }

עכשיו אפשר לכתוב כך:

@media (width >= 400px) { … }

תמיכה בדפדפן

  • 104
  • 104
  • 102
  • 16.4

מקור

API ללכידת אזור

Chrome 104 למחשב כולל גם את Region Capture API. התכונה הזו מאפשרת לחתוך ולהסיר תוכן מסרטון שצולם לפני השיתוף שלו.

Safari 16 כולל כמה תכונות מרכזיות לדפדפן

Safari 16 היא עוד גרסה מלהיבה מצוות Safari. לגרסה הזו נוספו הרבה מהתכונות הכלולות בשיתוף הפעולה 2022, וזה היה נהדר לראות כל כך הרבה נחיתה באמצע השנה הזו. הדגשתי כאן כמה מהתכונות האהובות עליי, אבל כדאי לקרוא את נתוני הגרסה למידע נוסף.

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

גם ב-Safari 16 יש תמיכה בערך subgrid עבור grid-template-columns ו-grid-template-rows. התכונה הזו כבר נמצאת ב-Firefox ונמצאת בפיתוח ב-Chrome, והיא מאפשרת לשנות את הגודל של פסי הרשת כך שניתן יהיה להעביר אותם בירושה למשבצות היררכיות.

תמיכה בדפדפן

  • 117
  • 117
  • 71
  • 16

מקור

גם לפריסת רשת יש אפשרות ליצור אנימציה של מסלולי רשת.

תמיכה בדפדפן

  • 107
  • 107
  • 66
  • 16

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

תמיכה בדפדפן

  • 99
  • 99
  • 101
  • 16

מקור

גם בעיות הנגישות בחשבון display: contents טופלו, ולכן התכונה המועילה הזאת היא בטוחה לשימוש ללא סכנה של הסרת רכיבים מעץ הנגישות.

תכונות הבטא האלה יושקו בקרוב בדפדפנים יציבים.

חלק מסדרת סרטונים חדשה באינטרנט