דף זה תורגם על ידי Cloud Translation API.

חדש ב-Chrome 112

Adriana Jara

דברים שעליך לדעת:

שירות CSS תומך עכשיו בכללי סידור פנימי.
האלגוריתם להגדרת המיקוד הראשוני על רכיבי <dialog> עודכן.
מעכשיו והלאה, המערכת מדלגת על handlers ללא תפעול fetch() ברכיבי שירות (service worker) כדי להפוך את הניווט למהיר יותר.
ויש עוד הרבה עוד.

אני אדריאנה ג'ארה. אנחנו מזמינים אותך לבחון מה חדש אצל המפתחים בגרסה 112 של Chrome.

תמיכה של שירותי CSS בנושא קינון.

אחת התכונות המועדפות שלנו לעיבוד מראש בשירות CSS מובנית עכשיו בשפה: כללים של סגנון סידור פנימי.

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

לפני

.nesting {
  color: hotpink;
}

.nesting > .is {
  color: rebeccapurple;
}

.nesting > .is > .awesome {
  color: deeppink;
}

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

אחרי

.nesting {
  color: hotpink;

  > .is {
    color: rebeccapurple;

    > .awesome {
      color: deeppink;
    }
  }
}

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

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

קינון יכול לעזור במקרים הבאים:

ארגון.
הקטנת הקובץ מתבצעת.
ארגון מחדש.

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

עדכון אלגוריתם למיקוד הראשוני של `<dialog>`.

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

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

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

מעכשיו:

שלבי המיקוד בתיבת הדו-שיח בוחנים רכיבים שניתן להתמקד בהם במקלדת במקום ברכיבים שאפשר להתמקד בהם הרכיב <dialog> עצמו מקבל מיקוד אם הוגדר לו מאפיין של מיקוד אוטומטי

על הרכיב <dialog> עצמו ניתן להתמקד כחלופה במקום להתמקד ב'איפוס' לרכיב <body>.

במסמכי התיעוד מופיעים פרטים נוספים על הרכיב <dialog>.

מתבצע דילוג על handlers לא פעילים לאחזור של Service Worker.

מ-Chrome בגרסה 112, המערכת תשמיט את ההתחלה של קובץ השירות (service worker) ואת השליחה של ה-listener מהנתיב הקריטי לניווט, אם סוכן המשתמש יזהה שכל פונקציות ה-Fetch של ה-Service Worker לא מצריכות תפעול.

התכונה הזו מזרזת את הניווט בדפים האלה.

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

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

אזהרות בכלי הפיתוח לגבי handlers ריקים לאחזור של Service Worker.

ופעולות נוספות.

כמובן שיש עוד הרבה.

עכשיו הפרמטר הגדרה של document.domain הוצא משימוש.
יש גרסת מקור לניסיון להוצאה משימוש של X-Requested-With header ב-WebView
עכשיו מכשיר ההקלטה בכלי הפיתוח יכול להקליט באמצעות סלקטורים ב-Pierce.

קריאה נוספת

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

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

אני אדריאנה ג'ארה, וברגע ש-Chrome 113 יפורסם, אני אהיה כאן לספר לך מה חדש ב-Chrome!