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

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

Rachel Andrew

תאריך פרסום: 29 במאי 2026

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

‫Chrome 148,‏ Firefox 151 ו-Safari 26.5 הושקו בגרסה יציבה במהלך חודש מאי. בפוסט הזה נסקור את התכונות החדשות הרבות שהושקו החודש.

פסאודו המחלקה :open CSS הופכת ל-Baseline

גרסה Safari 26.5 היא בעיקר גרסה שכוללת תיקונים לתכונות קיימות. עם זאת, הוא כולל גם תמיכה ב:open, מה שהופך את התכונה הזו לזמינה ב-Baseline.

הפסאודו-קלאס :open מאפשר לעצב רכיבים עם מצבים של 'פתוח' ו'סגור' כשהם פתוחים. זה חל על רכיבים כמו <details> ו-<dialog> כשהם פתוחים, וגם על רכיבים <select> ו-<input> (כמו בוחר צבעים או בוחר תאריכים) כשממשקי הבחירה שלהם מוצגים. האפשרות הזו מספקת חלופה סמנטית ונקייה יותר לעיצוב באמצעות מאפיינים כמו details[open].

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: 136.
  • Safari: 26.5.

Source

שאילתות CSS לקונטיינרים לפי שם בלבד הופכות ל-Baseline

עם ההשקה של Chrome 148 החודש, שאילתות של מאגרי תגים עם שם בלבד זמינות עכשיו ב-Baseline Newly available.

בעבר, כשכתבתם שאילתת מאגר, הייתם צריכים לציין תנאי של שאילתת גודל או סגנון לצד שם המאגר, ולקבוע את סוג המאגר באמצעות המאפיין container-type. עכשיו אפשר לשלוח שאילתה לגבי הנוכחות של מאגר נתונים בעל שם לפי השם שלו בלבד, בלי תנאי נוסף. בנוסף, אם אתם מבצעים שאילתה רק לפי שם, אתם לא צריכים יותר להגדיר container-type ברכיב ancestor:

#container {
  container-name: --sidebar;
}

@container --sidebar {
  .content {
    padding: 2rem;
  }
}

Browser Support

  • Chrome: 148.
  • Edge: 148.
  • Firefox: 149.
  • Safari: 26.4.

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

ב-Firefox 151 נוספה תמיכה בשאילתות style() ב-@container, כך ששאילתות סגנון של מאגרי תגים עבור מאפיינים מותאמים אישית זמינות עכשיו כ-Baseline.

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

@container style(--theme: dark) {
  .card {
    background-color: #1a1a1a;
    color: #fff;
  }
}

Browser Support

  • Chrome: 111.
  • Edge: 111.
  • Firefox: 151.
  • Safari: 18.

טעינה מדורגת של רכיבי וידאו ואודיו

ב-Chrome 148 נוספה תמיכה מובנית בטעינה עצלה של רכיבי <video> ו-<audio> עם המאפיין loading="lazy".

בדומה לרכיבים <img> ו-<iframe>, עכשיו אפשר להנחות את הדפדפן לדחות את הטעינה של משאבי מדיה עד שהם קרובים לאזור התצוגה. כך אפשר לשפר את ביצועי טעינת הדף, לחסוך ברוחב הפס ולצמצם את השימוש בחבילת הגלישה עבור המשתמשים. במאמר How To Use Standard HTML Video and Audio Lazy-Loading on the Web Today (איך להשתמש היום בטעינה עצלה של אודיו ווידאו ב-HTML רגיל באינטרנט) אפשר לקרוא מידע נוסף מהצוות שהטמיע את התכונה הזו.

Browser Support

  • Chrome: 148.
  • Edge: 148.
  • Firefox: not supported.
  • Safari: not supported.

Source

‫Document Picture-in-Picture API

ב-Firefox 151 נוספה תמיכה ב-Document Picture-in-Picture API בפלטפורמות למחשבים.

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

Browser Support

  • Chrome: 116.
  • Edge: 116.
  • Firefox: 151.
  • Safari: not supported.

Source

הרחבת התמיכה בפלטפורמות ב-Web Serial API

ב-Firefox 151 נוספה תמיכה ב-Web Serial API בפלטפורמות למחשבים, וב-Chrome 148 נוספה תמיכה ב-API הזה ב-Android.

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

Browser Support

  • Chrome: 89.
  • Edge: 89.
  • Firefox: 151.
  • Safari: not supported.

Source

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

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

גרסת בטא 149 של Chrome כוללת עדכוני CSS מעניינים כמו CSS gap decorations, שמאפשרים לכם לעצב את הרווח הלבן (הפערים) בין פריטים גמישים ופריטים ברשת. הוא תומך גם ב-path() וב-shape(), וגם בפונקציות בסיסיות של צורות rect() ו-xywh() בנכס shape-outside, וב-path-length כנכס CSS. בצד ה-API, שיטות גלילה פרוגרמטיות כמו scrollTo(),‏ scrollBy() ו-scrollIntoView() מחזירות עכשיו Promises שמושלמים כשהגלילה החלקה מסתיימת, ודפים עם חיבורי WebSocket פעילים יכולים עכשיו לעמוד בדרישות למטמון לדף הקודם/הבא (BFCache).

בגרסת הבטא של Firefox 152 נוסף תמיכה מלאה במאפיין field-sizing, שמאפשר להתאים את הגודל של אמצעי הבקרה בטופס באופן אוטומטי כך שיתאים לתוכן שלהם. בנוסף, הוא מוסיף את הנכסים actions ו-maxActions לממשק Notification ואת התמיכה ב-options.pseudoElement ב-Element.getAnimations().