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

Sofia Emelianova

חלונית הפרטיות והאבטחה

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

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

בעיה ב-Chromium: ‏ 352364594.

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

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

הגדרות קבועות מראש מכוילות של ויסות נתונים (throttle) של מעבד (CPU)

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

בתפריט הנפתח Performance (ביצועים) > CPU throttling (הגבלת מהירות המעבד), בוחרים באפשרות Calibrate...‎ (כיול), ואז בSettings (הגדרות) לוחצים על Calibrate (כיול) ועל Continue (המשך), ומחכים עד שכלי הפיתוח יחשב את שיעורי ההאטה של המכשיר. אפשרויות ההגבלה המכוילות מופיעות שוב בתפריט הנפתח ביצועים > הגבלת מהירות המעבד.

בחירה של אירועי ביצועים שונים באותו צ'אט עם AI

עכשיו אפשר לשנות את האירוע שנבחר בנתוני הביצועים באותו צ'אט בחלונית עזרה מבוססת-AI. במילים אחרות, לא צריך להתחיל צ'אט חדש כדי לדבר על אירוע אחר.

הדגשה של נתונים מאינטראקציה ישירה (First-Party) ונתונים מצד שלישי בדף 'ביצועים'

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

מעבירים את העכבר מעל רשומות בטבלה כדי לראות את האירועים הרלוונטיים מודגשים בנתוני הביצועים. כדי להתמקד רק בנתונים מאינטראקציה ישירה (First-Party), מסמנים את התיבה החלשת נתונים מצד שלישי.

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

נתוני שדות בהסברים קצרים על סמנים ובתובנות

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

בעיה ב-Chromium: 368135130.

תובנה לגבי 'אילוץ של הזרמה חוזרת'

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

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

בעיה ב-Chromium: ‏ 369766156.

תובנה לגבי 'אופטימיזציה של גודל DOM'

תובנה חדשה נוספת היא אופטימיזציה של גודל DOM. עץ DOM גדול יכול להאט את הביצועים של הדף.

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

הרחבת עקבות הביצועים באמצעות console.timeStamp

‫Extensibility API תומך עכשיו ב-console.timeStamp. בנוסף ל-performance.measure ול-performance.mark, עכשיו אפשר ליצור מסלולים מותאמים אישית ב-Performance Trace ולתעד סימנים מותאמים אישית באמצעות console.timeStamp, כחלופה קלה יותר שלא מוסיפה רשומות לציר הזמן של הביצועים הפנימי של הדפדפן, אלא רק מציגה אותן ב-Performance Trace.

לדוגמה, אפשר להשתמש בתחביר הבא:

console.timeStamp("Start");
// Some time later ...
console.timeStamp("End");
// Some time later ...
console.timeStamp("Measure 1", "Start", "End", "Track 1");
// Some time later ...
console.timeStamp("Measure 2", "Start", undefined, "Track 1");

אם תבחרו באפשרות הגדרות ללכידה > check_box הצגת מסלולים מותאמים אישית, המסלול המותאם אישית יופיע בנתוני המעקב:

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

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

ערכים בזמן אמת של סגנונות אנימציה

בכרטיסייה Elements (רכיבים) > Styles (סגנונות), הערכים של סגנונות מונפשים מתעדכנים עכשיו בזמן אמת.

תמיכה במחלקת פסאודו :open ובאלמנטים שונים של פסאודו

החלונית Elements תומכת עכשיו במחלקת פסאודו :open בקטע Styles > :hov > Force specific element state עבור רכיבי HTML מסוימים כמו <details>, ‏<select>, ‏<dialog> ו-<input>.

בנוסף, החלונית Elements תומכת עכשיו גם בכמה פסאודו-אלמנטים חדשים: ::checkmark,‏ ::picker-icon וקרוסלה ::column,‏ ::scroll-button,‏ ::scroll-marker ו-::scroll-marker-group.

בעיות ב-Chromium: 383157184, ‏ 379805728.

העתקת כל ההודעות במסוף

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

בנוסף, אפשר למצוא אפשרות דומה להעתקה בתפריט ההקשר של Network (רשת) > Request Payload (מטען ייעודי למטען בקשה).

בעיות ב-Chromium: 40206460, 384967020.

יחידות בייט בחלונית הזיכרון

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

בעיה ב-Chromium: 388589515.

מידע חשוב נוסף

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

• ביצועים:
  • הערות: עכשיו אפשר ללחוץ על התווית כדי לבחור את הרשומה המתאימה (crbug.com/388224764).
  • תובנות: כשלוחצים על CLS בכרטיסייה תובנות, נבחר עכשיו האשכול הגרוע ביותר במקום השינוי הגרוע ביותר.
• רשימת ההתעלמות: כברירת מחדל, המערכת מתעלמת עכשיו מנתונים פנימיים של Node שמתחילים ב-node: (crbug.com/382453615).
• ביטויים בזמן אמת: תוקן באג שגרם לביטוי בזמן אמת להשפיע על הפקודה $_ (crbug.com/388437265).
• Elements > Styles: לאורכים יחסיים יש עכשיו חלון קופץ שמציג את הערך המוחלט (crbug.com/40778486).
• נגישות: כותרות העמודות מודיעות עכשיו אם אפשר למיין אותן.
• סמלי הכרטיסיות מוצגים עכשיו בצד שמאל ליד שמות הכרטיסיות, במקום בצד ימין.

הורדת ערוצי התצוגה המקדימה

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

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

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

• אתם מוזמנים לשלוח לנו משוב ובקשות להוספת תכונות בכתובת crbug.com.
• אפשר לדווח על בעיה בכלי פיתוח באמצעות הסמל more_vert אפשרויות נוספות > עזרה > דיווח על בעיה בכלי פיתוח בכלי הפיתוח.
• שולחים ציוץ אל ‎@ChromeDevTools.
• אפשר להוסיף תגובות לסרטונים מה חדש בכלי הפיתוח ב-YouTube או טיפים לשימוש בכלי הפיתוח ב-YouTube.

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

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