ממשק ה-API של מסגרת אנימציה ארוכה (LoAF, נהגי Lo-Af) נשלח מ-Chrome 123, ועכשיו גם עדכנו את הכלים וההנחיות שלנו כדי לעזור לך להפיק את המרב מה-API החדש הזה.
LoAF זמין בספריית JavaScript של web-vitals
גרסה 4 של ספריית ה-JavaScript של משתני אינטרנט כוללת את מסגרת האנימציה הארוכה (או הפריימים) שקשורה לאינטראקציה ב-INP, כפי שמתועד במדריך חיפוש אינטראקציות איטיות בשדה כדי לכלול מידע על ניצול היתרונות של LoAF.
ב-Google I/O 2024 הצגנו את המידע הזה בשיחות בנושא תובנות חדשות בתחום לניפוי באגים ב-INP, כולל שימוש ב-LoAF לזיהוי סקריפטים אחרים שמאטים את האינטראקציות עם ה-INP.
שילוב של ה-API ישירות בספרייה מאפשר לשותפי RUM שמשתמשים ב-API הזה לחשוף את הנתונים האלה, כולל RUMVision ו-DebugBear. כמו כן, היא מספקת הטמעת קובצי עזר של קוד פתוח לספקי RUM אחרים כשהם מתעניינים בנושא של המוצר שלהם.
מדד LoAF זמין בתוסף Web Vitals
עדכנו את התוסף Web Vitals כך שיכלול נתונים של מסגרות אנימציה ארוכות כדי לעזור לכם לנפות באגים באינטראקציות עם מדד INP:
האפשרות הזו שימושית כדי לראות אילו סקריפטים אחרים רצים בזמן האינטראקציה. לרוב זה גורם לעיכובים (במיוחד לעיכובים בקלט), אבל עד עכשיו היה קשה לאבחן אותם כשמשתמשים בתוסף.
הנחיות מעודכנות לגבי השימוש ב-LoAF
בנוסף, עדכנו את ההנחיות שלנו במסמכים הראשיים של Long Animation Frames API כדי לעזור לכם להפיק את המרב מה-API הזה.
ההנחיות האלה מבוססות על האופן שבו ראינו שנעשה שימוש ב-API הזה בשטח. לדוגמה, במקרה לדוגמה הזה של Taboola. אנחנו עובדים על מספר מקרים לדוגמה נוספים, ונשמח לפרסם עוד דוגמאות כאלה בעתיד.
בנוסף, תיעדנו את ה-API ב-MDN.
סיכום
ממשק ה-API של מסגרת האנימציה הארוכה הוא תוספת מלהיבה לפלטפורמת האינטרנט, וכבר ראינו מספר אתרים שמשתמשים ב-API הזה כדי לשפר את האתרים שלהם גם במהלך שלב הניסיון. אנחנו מצפים להטמעה נרחבת יותר של ה-API בכלים וביכולת תגובה משופרת באתרים בעזרת ה-API הזה.