חדש ב-Chrome 88

Pete LePage

אנחנו מתחילים להשיק את Chrome 88 בגרסה היציבה.

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

  • עכשיו אפשר להעלות תוספים באמצעות מניפסט V3 לחנות האינטרנט של Chrome.
  • בעזרת מאפיין ה-CSS aspect-ratio אפשר להגדיר בקלות את יחס הגובה-רוחב של כל רכיב.
  • ב-Chrome 88, נצמצם מאוד את הזמן של שעוני JavaScript בשרשור לדפים מוסתרים בתנאים מסוימים.
  • עכשיו אפשר להשתמש בחיוב ב-Play בפעילות באינטרנט מהימנה.
  • כל הסרטונים מ-Chrome Dev Summit זמינים.
  • ויש עוד הרבה יותר.

קוראים לי Pete LePage ואני עובד ומצלם מהבית. עכשיו נצלול פנימה ונראה מה חדש למפתחים ב-Chrome 88.

מניפסט V3

גרסה 88 של Chrome תומכת עכשיו בתוספים שנוצרו באמצעות Manifest V3, ואפשר להעלות אותם לחנות האינטרנט של Chrome. Manifest V3 היא פלטפורמת תוספים חדשה שמאפשרת לתוספים ל-Chrome להיות בטוחים יותר, יעילים יותר ומכבדים יותר את הפרטיות כברירת מחדל.

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

הוא מציג קובצי שירות (service workers) כתחליף לדפי רקע. מאחר ששירותי ה-Workers נמצאים בזיכרון רק כשיש צורך בהם, התוספים ישתמשו בפחות משאבי מערכת.

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

באתר developer.chrome.com תוכלו למצוא פרטים מלאים על הנושא, וגם מידע על העברת התוסף הנוכחי שלכם ל-Manifest V3.


מאפיין aspect-ratio של CSS

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

<!-- Height is auto-computed from width & aspect ratio -->
<img src="..." style="width: 800px;">

ב-Chrome 88, המאפיין aspect-ratio מאפשר לציין באופן מפורש יחס גובה-רוחב, וכך מאפשר התנהגות דומה.

.square {
  aspect-ratio: 1 / 1;
}

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

.square {
  aspect-ratio: 1 / 1;
}

@supports not (aspect-ratio: 1 / 1) {
  .square {
    height: 4rem;
    width: 4rem;
  }
}

תודה ל-Jen Simmons שציינה שהתכונה הזו נתמכת בגרסה האחרונה של Safari Technical Preview, כך שאנחנו אמורים לראות אותה ב-Safari בקרוב. מומלץ לצפות בהדגמה של Una כדי לראות איך זה עובד.

ויסות נתונים (throttling) כבד של טיימרים ב-JS שמקושרים זה לזה

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

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

חיוב ב-Play בפעילות Trusted Web

עכשיו אפשר להשתמש בחיוב ב-Play בפעילות באינטרנט מהימנה כדי למכור מינויים ומוצרים דיגיטליים באמצעות ה-API החדש למוצרים דיגיטליים. התכונה זמינה כגרסת ניסיון למקור ב-Chrome 88 ל-Android, ואנחנו מצפים להרחיב את גרסת הניסיון למקור ל-ChromeOS בגרסה הבאה.

אחרי שתגדירו את החשבונות, תצטרכו לעדכן את הפעילות המאומתת באינטרנט כדי להפעיל את החיוב ב-Play וליצור את הפריטים הדיגיטליים שלכם ב-Play Developer Console. לאחר מכן, מוסיפים את אסימון הניסיון של המקור לאפליקציית ה-PWA, ומוכנים להוסיף את הקוד כדי לבדוק רכישות קיימות, להריץ שאילתות לגבי רכישות זמינות ולבצע רכישות חדשות.

// Get list of potential digital goods

const itemService =
  await window.getDigitalGoodsService("https://play.google.com/billing");

const details =
  await itemService.getDetails(['ripe_bananas', 'walnuts', 'pecans' ]);

Adriana ו-Andre מדברים על הנושא בפירוט רב יותר בהרצאה שלהם בכנס Chrome Dev Summit – מה חדש באפליקציות אינטרנט ב-Play. אפשר גם לעיין במסמכים.

ועוד

ויש עוד הרבה דברים.

  • כדי לעמוד בדרישות של שינוי בתקן HTML, תגי עוגן עם target="_blank" יכללו עכשיו את rel="noopener" כברירת מחדל. כך אפשר למנוע התקפות מסוג tab-napping.
  • רוב מערכות ההפעלה מאפשרות האצה של העכבר כברירת מחדל, אבל זה יכול ליצור בעיות במשחקים מסוימים. ב-Chrome 88, Pointer Lock API מאפשר להשבית את האצת העכבר. כלומר, אותה תנועה פיזית, איטית או מהירה, גורמת לאותה תנועה, וכך מתקבלת חוויית משחק טובה יותר ודיוק גבוה יותר.
  • וגם addEventListener מקבל עכשיו אפשרות של אות ביטול. קריאה ל-abort() מסירה את פונקציית ה-event listener הזו, כך שקל להשבית פונקציות event listener כשאין בהן יותר צורך.

קריאה נוספת

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

להרשמה

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

קוראים לי פיט לייפאג (Pete LePage), ואחרי שגרסת Chrome 89 תפורסם, אספר לכם מה חדש ב-Chrome.