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

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

Rachel Andrew

תאריך פרסום: 30 ביוני 2026

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

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

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

שינוי הגודל של אמצעי הבקרה בטופס באמצעות field-sizing הופך ל-Baseline

ב-Firefox 152 נוספה תמיכה במאפיין CSS‏ field-sizing, כך שניתן להשתמש ב-Baseline כדי לשנות את הגודל של רכיבי טופס באופן אוטומטי בכל מנועי הדפדפנים העיקריים.

המאפיין field-sizing מאפשר לרכיבי בקרה של טפסים כמו <textarea>, ‏ <input> ו-<select> להתכווץ או להתרחב באופן דינמי כדי להתאים לתוכן שלהם (field-sizing: content), במקום להישאר בגודל ברירת מחדל קבוע (field-sizing: fixed). כך אין צורך בפתרונות עקיפים של JavaScript כשיוצרים שדות קלט או תיבות טקסט שמשנים את הגודל שלהם בזמן שהמשתמשים מקלידים.

textarea {
  field-sizing: content;
}

Browser Support

• 123
• 123
• 152
• 26.2

Source

צורות בסיסיות rect() ו-xywh() ב-shape-outside הופכות ל-Baseline

ב-Chrome 149 יש תמיכה בפונקציות של צורות rect() ו-xywh() במאפיין shape-outside. הצורות הבסיסיות האלה זמינות עכשיו בדפדפנים מרכזיים.

הפונקציות rect() ו-xywh() מאפשרות להגדיר אזורי החרגה מלבניים באמצעות קואורדינטות מדויקות של שוליים פנימיים או תחביר של נקודת מוצא ומידות. התחביר הזה פשוט וקריא יותר מאשר השימוש ב-polygon() לצורות מלבניות של גלישת טקסט.

Browser Support

• 149
• 149
• 149
• 17.2

Source

שינוי גודל הגופן באופן אוטומטי באמצעות CSS text-fit

בגרסה 150 של Chrome נוספה text-fit מאפיין CSS, שמאפשר למפתחים לשנות את גודל הגופן באופן אוטומטי כך שיתאים לרוחב של תיבת המכילה.

.headline {
  text-fit: grow;
}

קישוטים של רווחים ב-CSS

בגרסה 149 של Chrome נוספה תמיכה בקישוטי רווח CSS בפריסות של grid ו-flexbox. קישוטי רווח מאפשרים להוסיף קווים וסגנונות ישירות לרווח בין פריטים ברשת ופריטים גמישים, בדומה ל-column-rule בפריסות מרובות עמודות.

.grid-container {
  display: grid;
  gap: 20px;
  column-rule: 2px solid red;
  row-rule: 1px dashed gray;
}

מידע נוסף זמין במאמר Gap decorations: Now in Chromium.

Browser Support

• 149
• 149
• x
• x

CSS background-clip: border-area

בגרסת Chrome 150 נוספה תמיכה ב-background-clip: border-area מ-CSS Backgrounds Level 4.

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

Browser Support

• x
• x
• x
• 18.2

הבטחות לגלילה פרוגרמטית

ב-Chrome 150, שיטות גלילה פרוגרמטיות (scrollTo(), scrollBy() ו-scrollIntoView()) מעודכנות כדי להחזיר Promise.

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

ניווט הצהרתי במקלדת באמצעות focusgroup

בגרסה Chrome 150 נוספה תמיכה במאפיין focusgroup.

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

<div focusgroup="toolbar wrap" aria-label="Text formatting">
  <button type="button">Bold</button>
  <button type="button">Italic</button>
  <button type="button">Underline</button>
</div>

מידע נוסף זמין בהסבר על קבוצות מיקוד.

תמיכה ב-WebSockets במטמון לדף הקודם/הבא (bfcache)

ב-Chrome 149, דפים עם חיבורי WebSocket פעילים יכולים להיכנס עכשיו למטמון לדף הקודם/הבא (bfcache).

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

תזמון של תגובות ביניים ותגובות של כותרות בתזמון של משאבים

ב-Firefox 152 נוספה תמיכה ב-firstInterimResponseStart וב-finalResponseHeadersStart בממשק PerformanceResourceTiming.

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

Browser Support

• 115
• 115
• 152
• 26.4

Source

כפתורי פעולה להתראות

ב-Firefox 152 נוספה תמיכה בלחצני פעולה להתראות באמצעות המאפיין actions ב-Notification ואפשרויות ב-ServiceWorkerRegistration.showNotification().

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

Browser Support

• 53
• 18
• 152
• x

Source

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

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

ב-Firefox 153 beta נוסף תמיכה ב-Error.stackTraceLimit להגדרת עומק מקסימלי של דוח קריסות שנתפס, ב-IDBObjectStore.getAllRecords() וב-IDBIndex.getAllRecords() לאחזור רשומות באינדקס וב-RTCDtlsTransport.getRemoteCertificates() לבדיקת אבטחה של WebRTC. מפתחי תוספים מקבלים גם publicSuffix API חדש ושיטה חדשה userScripts.execute() להוספת סקריפט לפי דרישה.

בגרסת הבטא של Safari 27 נוספו: מיקום עוגן שמתחשב בטרנספורמציה, פסאודו-מחלקת :heading לזיהוי רכיבי כותרת, מילת המפתח revert-rule להחזרת שכבות מדורגות, תמיכה במילת המפתח stretch בקביעת גודל תיבה ובוררים מורכבים :host:has().