תאריך פרסום: 19 במרץ 2025
אנחנו ממשיכים לעדכן אתכם על התוכנית לשיפור הכלים לבדיקת ביצועים ב-Chrome, ומשמחים להודיע על שדרוגים נוספים לאופן האינטראקציה עם הלוח 'ביצועים' בכלי הפיתוח. השיפורים האלה נועדו לשפר את היכולת לנווט בנתוני המעקב אחר הביצועים ולהפחית את הרעש הלא רלוונטי, כדי שתוכלו להתמקד במעקב מהיר אחר בעיות בביצועים ובפתרון שלהן.
ניווט משופר
קיבלנו משוב ממשתמשים רבים על כך שהגלילה והשינוי של מרחק התצוגה בחלונית 'ביצועים' יכולים להיות לא אינטואיטיביים. משתמשים ותיקים רבים רגילים לכך, אבל אנשים רבים מצפים שמחוות גלילה תגרום לגלילה, ולא להגדלה או להקטנה של המסלול.
אפשרות חדשה בקטע מאפשרת לעבור בין הגלילה הקיימת 'קלאסית' לבין הגישה החדשה 'מודרנית'.
במצב קלאסי, גלילה (בלוח מגע או בגלגל גלילה) ממשיכה להתקרב ולהתרחק, בעוד שלחיצה ארוכה על Shift וגלילה גורמת לגלילה למעלה ולמטה בתרשים הלהבות.
במצב המודרני החדש, הפעולות האלה הפוכות: עכשיו הגלילה מגלילה את תרשים הלהבות, ואילו לחיצה על Shift וגלילה מגדילה ומקטינה את התצוגה.
מקשי הקיצור (כמו שימוש ב-WASD כדי לנווט בניתוח) ימשיכו לפעול ללא שינוי.
סקירה כללית על מודעות דו-כיווניות
בחלק העליון של החלונית ביצועים מוצג התרשים מעבד, שהוא חלק מהסקירה הכללית של ציר הזמן. בדוח מוצגות אומדנים של שימוש ב-CPU במהלך הקלטת המעקב, בחלוקה לפי סוג העבודה (לדוגמה, כתום לביצוע סקריפט, סגול לפעולות רינדור).
כך תוכלו לקבל סקירה כללית – שנקראת לפעמים מפת משנה – של המעקב, ולקבל סיכום ברמה גבוהה של ציר הזמן כולו, גם כשאתם מתקרבים כדי לבדוק בעיות ספציפיות.
עם זאת, קל מאוד לאבד את המיקום המדויק במפה המפורטת כשמתמקדים בעיקר בנתיב – ולהפך. לכן הוספנו תכונות חדשות שיעזרו לקשר בין התצוגה הכללית לתצוגה המוגדלת. עכשיו, כשמעבירים את העכבר מעל לסקירה הכללית, מופיע קו אנכי תואם בתרשים הלהבות, שמציין את אותה נקודת זמן בתרשים הלהבות:
באופן דומה, מעבירים את העכבר מעל רשומות בתרשים הלהבות, והחלק המתאים בתרשים CPU יודגש. כך תוכלו לראות בדיוק אילו משימות גורמות לעליות החדות האלה בשימוש ב-CPU.
סינון המסלול
בדרך כלל, כדי לנפות באגים שקשורים לביצועים צריך לסנן כמות גדולה של נתונים. כדי לעזור לכם להתמקד במידע הרלוונטי ביותר, שיפרנו את היכולת לסנן רעשי רקע.
בשנה שעברה הוספנו את האפשרות להוסיף סקריפטים בחלונית 'ביצועים' לרשימת התעלמות ב-DevTools, כדי לסנן רשומות פחות רלוונטיות בתרשים הלהבות. לדוגמה, אם אתם מנסים לנפות באגים בביצועים של רכיב בדף, יכול להיות שסטאק הקריאות של המסגרת יהיה עמוק מספיק כדי שתצטרכו לגלול למעלה ולמטה בחלונית הביצועים. לרוב, כדאי לכווץ חלק גדול מסטאק הקריאות כדי להתמקד בחלקים החשובים.
אפשר ללחוץ לחיצה ימנית על רשומה בתרשים הלהבות ולבחור באפשרות הוספת סקריפט לרשימת ההתעלמות. הפעולה הזו תוסיף את הסקריפט לרשימת ההתעלמות של DevTools ותכווץ את כל הרשומות שלו בתרשים הלהבות.
אבל עכשיו אפשר גם לערוך את רשימת ההשמטות באופן ידני ישירות מהלחצן בחלק העליון של החלונית Performance. ביטויים רגולריים של רשימת התעלמות משותפים בכל כלי הפיתוח – כך שסקריפטים שתואמים להם ידלגו עליהם במהלך ניפוי הבאגים בחלונית 'מקורות' ויכווצו לרשומה אחת בתרשים הלהבות – והרשימה נשמרת בכל הסשנים של כלי הפיתוח.
כך תוכלו לשלוט באופן מדויק באילו קבצים להתעלם מהם, וגם להפעיל ולהשבית כללים תוך כדי עבודה.
עמעום של סקריפטים של צד שלישי
סקריפטים של צד שלישי נפוצים באתרים, אבל לרוב הם לא בשליטתנו או לא רלוונטיים לסשן ניפוי באגים ספציפי. האפשרות החדשה Dim 3rd parties (הכהיית צדדים שלישיים) בחלק העליון של החלונית 'ביצועים' תגרום להכהיית סקריפטים של צד שלישי ופעילות של רשתות בקו הזמן, כדי לצמצם את העומס החזותי ולאפשר לכם להתמקד בגורמים שתורמים לביצועים מאינטראקציה ישירה (First-Party).
אבל לפעמים רוצים יותר שליטה, למשל להתמקד בצד שלישי מסוים או אפילו לקבל רק תוכן מ-API או מ-CDN משלכם. בתחתית החלונית בכרטיסייה סיכום מוצג פירוט של צדדים ראשוניים ושלישיים ש-DevTools מצליח למצוא בדף. כשמעבירים את העכבר מעל כל ישות ברשימה, כל פעילות שלא קשורה לישות הזו תתבהר.
סיכום
התכונות החדשות האלה אמורות לעזור לכם לנווט טוב יותר בחלונית 'ביצועים' ולסנן את הרעשי הרקע כדי שתוכלו להתמקד בחלקים של המעקב שחשובים לכם. נסו את התכונות האלה וספרו לנו איך אפשר לשפר אותן או אילו שיפורים נוספים הייתם רוצים לראות.