חדש ב-Chrome 108

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

קוראים לי אדריאנה ג'רה. נצלול פנימה ונראה מה חדש למפתחים ב-Chrome 108.

יחידות חדשות של גודל אזור התצוגה

יחידות שדה התצוגה החדשות נותנות לכם יותר שליטה ביצירת ממשקי משתמש מותאמים.

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

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

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

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

הערך יהיה כל ערך בטווח של היחידה הגדולה (המקסימום) והיחידות הקטנות (המינימום).

החלקים השונים של אזור התצוגה לכל סוג של יחידת אזור תצוגה.

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

יש עכשיו תמיכה בגופנים משתנים ב-COLRv1.

התמיכה בגופנים וקטוריים צבעוניים מסוג COLRv1 קיימת מאז גרסת Chrome 98, אבל במהדורה הראשונית הייתה תמיכה רק בפונקציונליות סטטית של טבלת COLRv1.

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

הגרסה הזו כוללת גם את תוספי התנאים font-tech() ו-font-format() ל-CSS @supports .

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

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

השיטות של FileSystemSyncAccessHandle הן עכשיו סינכרוניות.

מערכת הקבצים הפרטית של המקור מספקת גישה לסוג מיוחד של קובץ שעבר אופטימיזציה רבה לביצועים. מפתחים יכולים לקבל גישה לקבצים כאלה על ידי קריאה ל-createSyncAccessHandle(), שהיא שיטה שחשופה באובייקטים מסוג FileSystemFileHandle.

כתוצאה מהקריאה הזו מתקבל FileSystemSyncAccessHandle.

השיטות truncate(newSize),‏ getSize(),‏ flush() ו-close() במזהה הגישה הזה היו אסינכרניות בעבר, אבל הן סינכרוניות החל מגרסה 108 של Chrome.

יש סיבה טובה לשינוי: הוא מאפשר ל-FileSystemSyncAccessHandle להתאים ל-API של קבצים סינכרוני בסגנון POSIX שצפוי לאפליקציות מבוססות-Wasm. כך ה-API הופך לארגונומי יותר ומניב שיפור משמעותי בביצועים.

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

// ⛔️ This will break, and you need to restructure your code:
accessHandle.flush().then(/* Follow-up code */);
// ✅ Correct:
accessHandle.flush();
/* Follow-up code */

הוראות מפורטות יותר זמינות במאמר הזה.

ועוד.

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

קריאה נוספת

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

להרשמה

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

קוראים לי אדריאנה ג'רה, ואחרי שגרסת Chrome 109 תפורסם, אספר לכם מה חדש ב-Chrome.