חדש ב-Chrome 60

  • Paint Timing API מאפשר לכם למדוד את הזמן עד להמרת התמונה הוקטורית הראשונה למפת סיביות ואת הזמן עד להצגת התוכן הראשוני באמצעות Paint Timings API.
  • בעזרת font-display אפשר לקבוע איך הגופנים ימוינו לפני ההורדה.
  • WebAssembly הגיע
  • ויש עוד הרבה!

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

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

Paint timings API

כשמשתמש מנווט לדף אינטרנט, הוא מחפש משוב חזותי כדי לוודא שהכול פועל כמו שצריך. בעזרת Paint Timings API החדש, אנחנו יכולים למדוד את זה עכשיו.

ה-API חושף שני מדדים:

  • זמן ליצירת גרפיקה ראשונית – המדד הזה מציין את הנקודה שבה הדפדפן מתחיל לעבד משהו, את קטע התוכן הראשון במסך.
  • זמן ליצירת גרפיקת תוכן ראשוני (FCP) – המדד הזה מציין את הנקודה שבה הדפדפן מעבד את קטע התוכן הראשון מ-DOM, טקסט, תמונה וכו'.

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

מאפיין font-display של CSS

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

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

  • auto משתמש בשיטת הצגת הגופן שבה משתמש סוכן המשתמשים.
  • block מקצה למשפחת הגופן תקופת חסימה קצרה ותקופת החלפה אינסופית.
  • הערך swap מקצה למשפחת הגופן תקופת חסימה של אפס שניות ותקופת החלפה אינסופית.
  • fallback מקצה לגופן תקופת חסימה קצרה מאוד ותקופת החלפה קצרה.
  • הערך optional מקצה לפנים הגופן תקופת חסימה קצרה מאוד ותקופת החלפה של אפס שניות.

התכונה נתמכת ב-Chrome 60 וב-Opera, והיא נמצאת בפיתוח ב-Firefox. מידע נוסף זמין במאמר שליטה בביצועי הגופן באמצעות font-display.

WebAssembly

Web Assembly או wasm מספקים דרך חדשה להריץ באינטרנט קוד שנכתב בשפות כמו C ו-C++ במהירות קרובה למהירות של קוד מקורי.

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

מידע נוסף זמין באתר webassembly.org, כולל הדגמות, מסמכים ומידע על תחילת העבודה.

ועוד.

  • בעזרת Web Budget API החדש, אתרים עם הרשאת התראות דחיפה יכולים לשלוח מספר מוגבל של הודעות דחיפה שמפעילות משימות ברקע, כמו סנכרון נתונים או סגירה של התראות, בלי צורך להציג התראה שגלויה למשתמשים.
  • PushSubscription.expirationTime התכונה הזו זמינה עכשיו, והיא מאפשרת לאתרים לקבל התראה אם תוקף המינוי יפוג.
  • עכשיו יש תמיכה במאפייני Object rest & spread, כך שקל יותר למזג אובייקטים ולשכפל אותם באופן שטחי, ולהטמיע דפוסים שונים של אובייקטים שלא ניתנים לשינוי.

הערה: Payment Request API הועבר ל-Chrome 61.

אלה רק כמה מהשינויים ב-Chrome 60 למפתחים.

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

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