מה חדש בכלי הפיתוח, גרסה 135 של Chrome

Sofia Emelianova
Sofia Emelianova

שיפורים בחלונית הביצועים

בגרסה הזו נוספו כמה שיפורים לחלונית ביצועים.

קישורים למקור ולסקריפט של קריאות לפרופיל ולפונקציות בדף 'ביצועים'

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

לפני ואחרי הוספת המקור והמוצא לכרטיסייה 'סיכום'.

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

בעיה ב-Chromium: ‏ 368541957.

תמיכה בנתוני השדה 'LCP לפי שלב'

כשנתוני השדה מופעלים, בתובנה ביצועים > תובנות > LCP לפי שלב מוצגים עכשיו זמני הצגת התמונות ב-75% העליונים מדוח חוויית המשתמש ב-Chrome בטבלה נוספת, כדי שתוכלו להשוות בין זמני הצגת התמונות ישירות בתובנה.

התרשימים 'לפני' ו'אחרי' הוספת נתוני השדה תומכים בתובנה 'LCP לפי שלב'.

התובנה 'עץ תלות ברשת'

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

מידע נוסף זמין במאמר יש להימנע משרשור של בקשות קריטיות.

הדגשה של המחסנית הכבדה ביותר

בחלונית ביצועים, כשמעבירים את העכבר מעל פריטים בטראק ראשי בסרגל הצד Call tree (עץ קריאות) או Bottom-up (מלמטה למעלה) > Heaviest stack (הערימה הכבדה ביותר), הפריטים האלה מודגשים והשאר מטושטשים. כך תוכלו למצוא באופן חזותי פריטים בתצוגת עץ ב-call stack שגוזלים את רוב הזמן.

תצוגת עץ הנגישות ב-Elements

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

כדי לפתוח את תצוגת עץ הנגישות, לוחצים על הלחצן מעבר לתצוגת עץ הנגישות בפינה השמאלית העליונה של עץ ה-DOM בחלונית Elements.

התמונה שלפני ואחרי הפעלת התצוגה של עץ הנגישות במסך מלא כברירת מחדל .

מידע נוסף זמין במאמר הדוח המלא של נגישות בכלים למפתחים ב-Chrome.

בעיה ב-Chromium: 40808541.

מצבים ריקים משופרים בחלוניות שונות

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

המצבים לפני ואחרי השיפור של מצבים ריקים בחלוניות 'רשת' ו'חיפוש'.

האפשרות 'שאל את AI' הועברה לתחתית התפריט

האפשרות שאל את AI מופיעה עכשיו בחלק התחתון של התפריטים הנפתחים, במקום בחלק העליון.

התמונה הקודמת והתמונה הבאה אחרי שהאפשרות 'שאל את AI' הועברה לתחתית התפריט הנפתח.

אפשר לשלוח משוב על החלונית עזרה מ-AI בכתובת crbug.com/364805393.

Lighthouse 12.4.0

בחלונית Lighthouse פועלת עכשיו גרסת Lighthouse 12.4.0.

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

במאמר Lighthouse: אופטימיזציה של מהירות האתר מוסבר על היסודות של השימוש בחלונית Lighthouse ב-DevTools.

בעיה ב-Chromium: 40543651.

רגעי שיא שונים

ריכזנו כאן כמה מהתיקונים והשיפורים החשובים בגרסה הזו:

  • ביצועים > סיכום: החלפנו את שתי השורות סה"כ זמן ו-זמן עצמי בשורה אחת של משך זמן, שבה מוצג גם (self time) בסוגריים, אם יש כזה (crbug.com/395572753).
  • בעיות: נוספו סוגי בעיות חדשים: בעיות <select> בעץ הנגישות ושגיאות בחתימה של הודעות SRI שמתרחשות במהלך הניתוח או האימות בשירות הרשת (crbug.com/381044049, ‏ crbug.com/347890366).
  • נגישות: בכרטיסייה Elements (רכיבים) > Styles (סגנונות) מופיעים עכשיו קווים שמסמנים את הרכיבים שאפשר לעבור ביניהם באמצעות ניווט במקלדת (crbug.com/396311936).
  • אלמנטים: יש עכשיו תמיכה בבעיות שקשורות ל-<select>, והן מודגשות בקו תחתון אדום ומתפתל (crbug.com/378738916).
  • רשת: סמל הנקודה לשינוי ברירת המחדל וסמלי האזהרה לגבי קובצי cookie מוצגים עכשיו מימין לשם הכרטיסייה, במקום משמאל (crbug.com/390556283).

מורידים את הערוצים של התצוגה המקדימה.

מומלץ להשתמש ב-Chrome Canary, ב-Dev או ב-Beta כדפדפן הפיתוח שמוגדר כברירת מחדל. ערוצי התצוגה המקדימה האלה מעניקים לכם גישה לתכונות העדכניות ביותר של DevTools, מאפשרים לכם לבדוק ממשקי API מתקדמים לפלטפורמות אינטרנט ולמצוא בעיות באתר לפני שהמשתמשים שלכם יעשו זאת.

יצירת קשר עם צוות כלי הפיתוח ל-Chrome

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

מה חדש בכלי הפיתוח

רשימה של כל מה שנדון בסדרה מה חדש ב-DevTools.