חדש ב-Chrome 63

Pete LePage

ויש עוד הרבה!

קוראים לי Pete LePage. נצלול פנימה ונראה מה חדש למפתחים בגרסה 63 של Chrome.

רוצים לראות את רשימת השינויים המלאה? תוכלו לעיין ברשימת השינויים במאגר מקורות Chromium.

ייבוא דינמי של מודולים

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

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

button.addEventListener('click', event => {
  import('./dialogBox.js')
  .then(dialogBox => {
    dialogBox.open();
  })
  .catch(error => {
    /* Error handling */
  });
});

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

מחולל וסורק אסינכרוני

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

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

async function* getChunkSizes(url) {
  const response = await fetch(url);
  const b = response.body;
  for await (const chunk of magic(b)) {
    yield chunk.length;
  }
}

אפשר להשתמש במערכי סריקה אסינכרונים בלולאות for-of וגם כדי ליצור מערכי סריקה אסינכרונים מותאמים אישית באמצעות מפעלים של מערכי סריקה אסינכרונים.

התנהגות של גלילה מעבר לקצה

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

לפני כן, עם רענון מלא של הדף.

אחר כך מרעננים רק את התוכן.

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

Chrome 63 תומך עכשיו במאפיין ה-CSS overscroll-behavior, כדי להקל על שינוי התנהגות ברירת המחדל של גלילה לאפשרויות נוספות של הדפדפן.

אפשר להשתמש בה כדי:

החלק הכי טוב הוא של-overscroll-behavior אין השפעה שלילית על ביצועי הדף.

שינויים בממשק המשתמש של ההרשאות

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

המערכת מתעלמת מ-90% מכל בקשות ההרשאות או נחסמות זמנית.

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

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

ועוד.

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

  • finallyזמין עכשיו במכונות Promise, והוא מופעל אחרי ש-Promise הושלם או נדחה.
  • Device Memory JavaScript API החדש עוזר לכם להבין את מגבלות הביצועים על ידי מתן רמזים לגבי נפח ה-RAM הכולל במכשיר של המשתמש. אתם יכולים להתאים אישית את החוויה בזמן הריצה, לצמצם את המורכבות במכשירים ברמה נמוכה יותר ולספק למשתמשים חוויה טובה יותר עם פחות תסכולים.
  • באמצעות Intl.PluralRules API אפשר לפתח אפליקציות שמבינות את צורת הרבים של שפה נתונה, על ידי ציון צורת הרבים שחלה על מספר נתון ועל שפה נתונה. ויכול לעזור עם מספרים עוקבים.

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

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