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

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

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

במרץ 2023, Firefox 111, Chrome 111 ו-Safari 16.4 התייצבו. נבחן את המשמעות מבחינת פלטפורמת האינטרנט.

מאפייני HTML גלובליים

ב-Firefox 111 יש תמיכה בכמה מאפייני HTML גלובליים שימושיים. המאפיין autocapitalize קובע אם המערכת תשתמש באותיות רישיות באופן אוטומטי כשהמשתמש מקליד במקלדת וירטואלית.

תמיכה בדפדפן

  • 43
  • 79
  • 111
  • x

מקור

המאפיין translate מציין אם צריך לתרגם רכיב מסוים כשהדף מותאם לשוק המקומי.

תמיכה בדפדפן

  • 19
  • 79
  • 111
  • 6

מקור

מערכת הקבצים הפרטית של המקור (OPFS)

ב-Firefox נוספה תמיכה ב-Origin Private File System (OPFS) כשמשתמשים ב-File System Access API. מידע נוסף על OPFS

ממשק ה-API של מעברים מ-View

ב-Chrome 111 נוסף View Transitions API כדי ליצור מעברים מלוטשים באפליקציות של דף יחיד (SPA) בקלות רבה יותר באמצעות יצירת snapshot של תצוגות מפורטות ומאפשרות לשנות את ה-DOM ללא חפיפה בין מצבים.

מידע נוסף מופיע בפוסט ההשקה מעברים של תצוגת SPA נוחתים ב-Chrome 111.

תמיכה בדפדפן

  • 111
  • 111
  • x
  • x

מקור

פונקציות ומרחבי צבע חדשים ב-CSS

גרסה 111 של Chrome כוללת גם אוסף חדש לגמרי של דרכים לשימוש בצבעים באינטרנט. ב-Chrome יש עכשיו תמיכה במרחבי צבעים שמאפשרים גישה לצבעים מחוץ ללוח ה-RGB, יחד עם הפונקציות color() ו-color-mix(). תוכלו למצוא מידע נוסף במדריך הצבעים של CSS באיכות גבוהה ובפוסט בבלוג ב-color-mix().

תמיכה בדפדפן

  • 111
  • 111
  • 113
  • 16.2

מקור

הגרסה של Chrome כוללת גם כלי פיתוח חדשים שיעזרו לכם לעבוד עם פונקציונליות הצבעים החדשה הזו.

יותר שליטה ב-:nth-child() אפשרויות שבחרת

בגרסה 111 של Chrome נוספה היכולת להעביר רשימת סלקטורים ב-:nth-child() וב-nth-last-child(). מידע נוסף על כך, ואפשר לראות דוגמאות בפוסט יותר שליטה על בחירות :nth-child() עם תחביר S.

תמיכה בדפדפן

  • 111
  • 111
  • 113
  • 9

תמיכה לשקף הקודם והשקף הבא ב-MediaSession API

לבסוף, ברשימה הזו של Chrome 111 התוספות הן הפעולות לגבי הצגת שקפים עבור ה-API של סשן המדיה — "previousslide" ו-"nextslide".

תמיכה בדפדפן

  • 111
  • 111
  • x
  • x

תמיכה ברמת פסאודו ב-Safari

Safari 16.4 היא גרסה מדהימה לפלטפורמת האינטרנט. המאמר הזה לא יכסה את כל התוספות, לכן כדאי לעיין ברשימת התכונות המלאה בנתוני הגרסה של Safari 16.4.

בגרסה הזו יש כמה סיווגים נוספים של CSS עם תמיכה: :user-invalid, :user-valid, :dir(), :modal ו-:fullscreen.

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

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

תמיכה בדפדפן

  • 104
  • 104
  • 102
  • 16.4

מקור

מאפיינים וערכים של CSS

ב-Safari 16.4 יש תמיכה ב-@property, וכך מאפשרת רישום של מאפיינים מותאמים אישית ב-CSS ישירות בגיליון סגנונות. תוכלו לקבל מידע נוסף על הנושא הזה במאמר @property: הענקת כוחות-על למשתני CSS.

תמיכה בדפדפן

  • 85
  • 85
  • 16.4

מקור

תמיכה ב-CSS API

התוספות הנהדרות ל-CSS ממשיכות להגיע, עם תמיכה ב-CSS Typed OM. ה-API הזה חושף ערכי CSS כאובייקטים של JavaScript שהוקלדו, ולא כמחרוזות. הוא מאפשר לעבוד עם CSS מ-JavaScript בקלות רבה יותר, והוא מניב ביצועים טובים יותר מהשיטות הקיימות.

תמיכה בדפדפן

  • 66
  • 79
  • x
  • 16.4

מקור

יש תמיכה גם בגיליונות סגנונות שניתנים לבנייה באמצעות CSSStyleSheet(). כך מתאפשר השיתוף של גיליונות סגנונות בין מסמך לבין עצי המשנה של DOM של צל. באמצעות הגרסה הזו של Safari, בכל שלושת המנועים יש תמיכה בדפי סגנונות ניתנים לבנייה.

תמיכה בדפדפן

  • 73
  • 79
  • 101
  • 16.4

מקור

הודעות באינטרנט וממשק ה-API של התגים

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

תמיכה בדפדפן

  • 42
  • 17
  • 44
  • 16

מקור

ייבוא מפות

תוספת נוספת שמביאה את התכונה לסטטוס של יכולת פעולה הדדית היא ההוספה של ייבוא מפות של JavaScript, שהופכת את הייבוא של מודולים של ES לפשוט יותר.

תמיכה בדפדפן

  • 89
  • 89
  • 108
  • 16.4

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

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

ב-Firefox 112 יש תמיכה במאפיין inert, כך שהמאפיין השימושי הזה יהיה זמין בכל המנועים. אפשר למצוא מידע נוסף על אינרציה בקטע חדש: אינטרקטיביות. בנוסף, מערכת Firefox תפעיל תמיכה בפונקציה linear() של התאמה לצפייה.

גם ב-Chrome 112 וגם ב-Safari 16.5 יש תמיכה ב-CSS Nesting, תכונה שמפתחים רבים מצפים לה.

גרסה 112 של Chrome כוללת גם תמיכה ב-animation-composition. מידע נוסף על אופן הפעולה של המאפיין הזה זמין במאמר ציון האופן שבו אפקטי אנימציה מרובים צריכים לשלב עם קומפוזיציה של אנימציה.

אם אתם משתמשים במצב 'דפדפן ללא GUI' של Chrome, לדוגמה ב-Puppeteer, 112 מספק מצב חדש לגמרי של 'דפדפן ללא GUI'. ניתן לקרוא על כך במאמר בנושא שדרוג המצב 'דפדפן ללא GUI' של Chrome.

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