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

Sofia Emelianova
Sofia Emelianova
GitHub

היסטוריית צ'אט קבועה עם AI

מעכשיו, היסטוריית הצ'אטים נשמרת באופן מקומי בחלונית הסיוע מבוסס-ה-AI בין סשנים, כך שתוכלו לראות את השיחות הקודמות עם Gemini גם אחרי טעינה מחדש של DevTools או Chrome.

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

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

מדדי העברת תמונות

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

חלונית הביצועים עם הדגשת התובנה לגבי העברת תמונות.

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

ניווט קלאסי ומודרני במקלדת

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

  • קלאסית: שינוי מרחק התצוגה באמצעות גלגל העכבר (לוח מגע למעלה או למטה) וגלילה אנכית באמצעות Shift + גלגל העכבר.
  • מודרנית: גלילה אנכית באמצעות גלגל העכבר, גלילה אופקית באמצעות Shift + גלגל העכבר ושינוי מרחק התצוגה באמצעות Command/Control + גלגל העכבר.

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

תיבת הדו-שיח של מקשי הקיצור עם מקשי הקיצור הזמינים לחלונית הביצועים.

התעלמות מסקריפטים לא רלוונטיים בתרשים הלהבה

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

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

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

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

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

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

הגדרות מומלצות לוויסות הקצב

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

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

הגבלת המעבד המומלצת היא (בינתיים) 4x slowdown הנפוצה ביותר, וההמלצה לגבי הרשת מבוססת על נתונים מדוח חוויית המשתמש של Chrome, אם הוא מופעל במדדים בזמן אמת.

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

סימוני תזמון בשכבת-על

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

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

הטראק Timings שומר את הקריאות בהתאמה אישית של mark() ו-measure().

נתוני מעקב סטאק של קריאות JavaScript בקטע 'סיכום'

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

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

הגדרות התגים הועברו לתפריט ב-Elements

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

לפני ואחרי העברת ההגדרות של התגים לתפריט.

חלונית חדשה 'מה חדש'

לחלונית מה חדש יש מראה חדש שמתאים יותר לעיצוב של Chrome.

המראה הישן והחדש של החלונית 'מה חדש'.

בעיה ב-Chromium: ‏ 325441858.

Lighthouse 12.3.0

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

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

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

בעיה ב-Chromium: 40543651.

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

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

  • מקורות: כשהכלי לניפוי באגים מושהה, הוא לא עובר באופן בלתי צפוי להקשר של ה-service worker אם הוא נוצר אחרי ההשהיה (373893057).
  • ביצועים:
    • כשמעבירים את העכבר מעל סקריפטים, עכשיו מופיעות תיאורי מידע בתרשים הלהבות עם כתובות URL, אם יש כאלה (368541957).
    • סיכום: תרשים העוגה מוחלף בייצוג של עמודות.
    • שם התיבה Extension data (נתוני התוסף) בקטע Capture settings (הגדרות הצילום) השתנה ל-Show custom tracks (הצגת טראקים מותאמים אישית).
    • בכרטיסייה תובנות יש עכשיו קטע תובנות שעברו (N), שמכווץ כברירת מחדל.
  • Application‏ > Storage: אפשר ליצור רשומות אחסון עם מפתחות ריקים כי הם תקפים מבחינה טכנית (373703285).
  • מצב המכשיר מושבת עכשיו בדפים chrome:// (40186276).
  • Network:
    • אם ההגדרה המתאימה מופעלת, לחיצה אחת על ייצוא יומן HAR פותחת עכשיו תפריט עם שתי אפשרויות (לאחר ניקוי ועם מידע אישי רגיש). בעבר, התפריט נפתח בלחיצה ארוכה (378076279).
    • ב-העתקה כ-cURL נעשה עכשיו שימוש במאפיין -b כדי לעקוף קובצי cookie ולשפר את הקריאוּת, במקום ב--H 'cookie:...' (40791742).
  • נגישות: עכשיו אפשר להעביר כרטיסיות בתוך חלוניות ימינה או שמאלה באמצעות תפריט הקשר (383164782).
  • חסימה של בקשות רשת: ההגדרה הזו בתפריט הפקודות מסתנכרנת עכשיו עם תיבת הסימון המתאימה (378058733).

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

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

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

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

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

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