חדש ב-Chrome 108

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

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

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

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

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

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

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

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

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

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

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

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

יש תמיכה בגופנים וקטוריים של צבעים COLRv1 החל מגרסה 98 של Chrome, אבל בגרסה הראשונית תמכה רק פונקציונליות סטטית של טבלת 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!