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

Sofia Emelianova
Sofia Emelianova

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

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

תובנה לגבי מקורות עם קישור מקדים ב 'עץ תלות ברשת'

בתובנה Performance > Insights > Network dependency tree מוצגת עכשיו רשימה של מקורות שבוצעה אליהם התחברות מראש או מקורות פוטנציאליים להתחברות מראש, אם יש כאלה.

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

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

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

זמני התגובה של השרת וההפניה האוטומטית בתובנה 'זמן האחזור של בקשת מסמך'

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

התובנה 'זמן האחזור של בקשת המסמך' לפני ואחרי הוספת ההפניה האוטומטית וזמני התגובה של השרת.

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

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

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

בעיה ב-Chromium: ‏ 402353313.

הפחתת רעשים בנתוני המעקב אחר הביצועים

בחלונית ביצועים לא יוצגו יותר אירועים מהקטגוריה compile של מנוע JavaScript v8. בעבר, האירועים האלה גרמו להרבה תקורה ורעשי רקע מיותרים, במיוחד האירוע compile code.

התצוגה לפני ואחרי ההסרה של האירועים 'compile code' מנתוני הביצועים.

אם שמתם לב שחסרים אירועים מסוימים שחשובים לכם, אתם מוזמנים לשלוח משוב בכתובת crbug.com/414330508.

האפשרות 'השבתה של דגימות JavaScript' הוצאה משימוש

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

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

בעיה ב-Chromium: 414734883.

פרמטר הדיוק של המיקום הגיאוגרפי בחיישנים

עכשיו אפשר להגדיר את רמת הדיוק בחיקוי של מיקום גיאוגרפי בחלונית Sensors. כך תוכלו לבדוק את הטיפול ברמות שונות של דיוק GPS.

התמונה משמאל מציגה את החלונית Sensors לפני הוספת הפרמטר Accuracy (דיוק) לחיקוי של מיקום גיאוגרפי, והתמונה מימין מציגה את החלונית אחרי ההוספה.

בעיה ב-Chromium: 40074843.

שיפורים בחלונית Elements

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

ניפוי באגים של ערכי CSS מורכבים בקלות רבה יותר

כדי לעזור לכם לנפות באגים בערכי CSS מורכבים, בכרטיסייה Elements > Styles מוצג עכשיו הסבר קצר כשמעבירים את העכבר מעל:

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

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

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

בעיה ב-Chromium: 396080529.

@function תמיכה ב-Elements > Styles

לקראת הוספת תמיכה ב-@function ב-Chrome, בכרטיסייה Elements > Styles יש עכשיו קישור משמות הפונקציות המותאמות אישית להגדרות שלהן בקטע ייעודי.

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

שיפורים בחלונית 'רשת'

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

מסנן אחד (has-request-header)

החלונית Network תומכת עכשיו במסנן has-request-header, שמאפשר לסנן לפי שם ספציפי של כותרת בקשה.

התמונה מציגה את חלונית הרשת לפני ואחרי הוספת המסנן has-request-header.

בעיה ב-Chromium: ‏ 397481040.

Direct Sockets באפליקציות אינטרנט מבודדות (IWA)

בחלונית Network, אפשר עכשיו לעקוב אחרי התנועה של Isolated Web Apps (IWAs) דרך TCPSocket, ‏ UDPSocket (במצב inbound), ‏ UDPSocket (במצב connected).

כדי לעשות את זה, בוחרים חיבור directscoket ליד בקשות רגילות בטבלה, ובכרטיסייה הודעות בוחרים הודעה.

התמונה מציגה את חלונית הרשת לפני ואחרי הוספת תמיכה ב-Direct Sockets ב-IWA.

אפליקציות אינטרנט מבודדות (IWA) מספקות מודל אבטחה ברמת מהימנות גבוהה לאפליקציות אינטרנט. מידע נוסף זמין במאמר תחילת העבודה עם אפליקציות אינטרנט מבודדות (IWA). אפשר גם לעיין באפליקציית ההדגמה שמטמיעה את Direct Sockets API.

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

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

  • אפליקציה > אחסון: הוסרה האפשרות Web SQL שהוצאה משימוש (crbug.com/412707590).
  • Elements:
  • רשת: הוסרה כותרת ה-HTTP‏ Referrer-Policy מהאפשרות העתקה כבקשת אחזור כי זו כותרת תגובה שנועדה לשלוט בהתנהגות הדפדפן, ולא הוראה בצד הלקוח (crbug.com/413904896).
  • ביצועים: הוסרו אזהרות לגבי 'משימות ארוכות' מ-worker threads כי הן לא חוסמות main threads (crbug.com/40248589).
  • בעיות. דוחות עכשיו:
    • אם יש משאבים שמעוררים חשד למעקב אחרי משתמשים, הם נחסמים.
    • הקלות במעקב אחר עזיבה מהדף הראשון, בלי קשר לשאלה אם הם ניגשים לאחסון במהלך ההפניה או לא.
  • נגישות. הרכיבים הבאים בElements > Styles ניתנים עכשיו למיקוד באמצעות המקלדת:

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

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

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

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

  • אתם מוזמנים לשלוח לנו משוב ובקשות להוספת תכונות בכתובת crbug.com.
  • אפשר לדווח על בעיה בכלי פיתוח באמצעות הסמל אפשרויות נוספות > עזרה > דיווח על בעיה בכלי פיתוח בכלי הפיתוח.
  • שולחים ציוץ אל ‎@ChromeDevTools.
  • להשאיר תגובות בסרטונים What's new in DevTools YouTube videos או DevTools Tips YouTube videos.

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

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