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

תכונות מעניינות שנוספו לדפדפני אינטרנט בגרסאות יציבות ובגרסאות בטא במהלך ספטמבר 2024.

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

בספטמבר 2024, הגרסאות Firefox 130,‏ Safari 18 ו-Chrome 129 הפכו לגרסאות יציבות. בפוסט הזה נסקור את התכונות החדשות שנוספו לפלטפורמת האינטרנט.

תיבות נפתחות בלעדיות עם המאפיין name עבור <details>

ב-Firefox 130 יש תמיכה במאפיין name של האלמנט <details>. הקבוצה הזו מקבצת רכיבי <details>, וניתן לפתוח רק רכיב אחד בקבוצה בכל פעם. כך ניתן ליצור אקורדיון בלעדי בלי להשתמש ב-JavaScript.

תמיכה בדפדפנים

  • Chrome:‏ 120.
  • Edge:‏ 120.
  • Firefox:‏ 130.
  • Safari: 17.2.

הנפשה אוטומטית (ועוד)

ב-Chrome 129 נוספו המאפיין interpolate-size והפונקציה calc-size() של CSS.

נכס ה-CSS interpolate-size מאפשר לדף להביע הסכמה להצגת אנימציות ומעברים של מילות מפתח פנימיות של CSS לבחירת גודל, כמו auto,‏ min-content ו-fit-content, במקרים שבהם אפשר להציג אנימציה של מילות המפתח האלה.

תמיכה בדפדפנים

  • Chrome: 129.
  • Edge: לא נתמך.
  • Firefox: לא נתמך.
  • Safari: לא נתמך.

מקור

הפונקציה calc-size() ב-CSS היא פונקציית CSS שדומה ל-calc(), אבל היא תומכת גם בפעולות על מילת מפתח אחת בלבד לבחירת גודל. מילות המפתח הנתמכות לבחירת גודל הן auto,‏ min-content,‏ max-content ו-fit-content.

תמיכה בדפדפנים

  • Chrome: 129.
  • Edge:‏ 129.
  • Firefox: לא נתמך.
  • Safari: לא נתמך.

מקור

מידע נוסף זמין במאמר אנימציה לגובה: auto; (ומילות מפתח אחרות לקביעת גודל מובנה) ב-CSS.

עיצוב משכי זמן ב-JavaScript

בנוסף, בגרסה 129 של Chrome יש את Intl.DurationFormat, שמאפשרת לעצב משכי זמן, למשל 'שעה אחת, 40 דקות, 30 שניות', ותומכת במספר אזורים גיאוגרפיים.

תמיכה בדפדפנים

  • Chrome:‏ 129.
  • קצה: 129.
  • Firefox: לא נתמך.
  • Safari: 16.4.

מקור

WebCodecs API

Web Codecs API נתמך עכשיו במחשב ב-Firefox 130, ומעניק למפתחי אינטרנט גישה ברמה נמוכה לפריימים הנפרדים של סטרימינג וידאו ולקטעי אודיו. הממשקים החדשים כוללים את: VideoEncoder,‏ VideoDecoder,‏ EncodedVideoChunk,‏ VideoFrame ו-VideoColorSpace. ה-API הזה לא מאפשר להשתמש ב-Baseline Newly, כי הוא עדיין לא נתמך ב-Firefox ל-Android, אבל יש תמיכה ב-Firefox Nightly ל-Android.

תמיכה בדפדפנים

  • Chrome: 94.
  • Edge:‏ 94.
  • Firefox:‏ 130.
  • Safari: 16.4.

מקור

שאילתות סגנון CSS עבור מאפיינים מותאמים אישית

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

תמיכה בדפדפנים

  • Chrome: 111.
  • Edge:‏ 111.
  • Firefox: לא נתמך.
  • Safari: 18.

מקור

מידע נוסף על שאילתות בסגנון CSS

מעברים זהים בין תצוגות מסמכים

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

תמיכה בדפדפן

  • Chrome: ‏ 111.
  • קצה: 111.
  • Firefox: לא נתמך.
  • Safari: 18.

מקור

מידע נוסף על מעברים בין תצוגות של אותו מסמך

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

גרסאות בטא של הדפדפן מאפשרות לכם לראות תצוגה מקדימה של תכונות שייכללו בגרסה היציבה הבאה של הדפדפן. זו הזדמנות מצוינת לבדוק תכונות חדשות, או הסרות, שעשויות להשפיע על האתר עוד לפני ההשקה של הגרסה הזו. הגרסאות החדשות של גרסת הבטא הן Firefox 131,‏ Chrome 130 ו-Safari 18.1. הגרסאות האלה מוסיפות לפלטפורמה תכונות רבות ומועילות. כל הפרטים מפורטים בהערות המוצר. ריכזנו כאן כמה נקודות עיקריות.

Firefox 131 כולל כלים חדשים מסוג עזרה באיטרטור של JavaScript, והאפשרות קובצי Cookie עם חלוקה עצמאית למחיצות (CHIPS) מופעלת.

ב-Chrome 130 יש תמיכה ב-box-decoration-break: clone גם לפיצול בתוך שורה (פריסת שורה) וגם לפיצול בלוקים (קטעים שנוצרים לצורך הדפסה ולצורך מספר עמודות). בנוסף, יש דיווח משופר על שגיאות ב-IndexedDB, ומאפיין connected חדש לממשק SerialPort של Web Serial.

גרסה 18.1 של Safari כוללת תיקוני באגים בתכונות קיימות.