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

Sofia Emelianova
Sofia Emelianova
GitHub

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

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

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

בתובנה 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.

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

בעיה ב-Chromium: 40074843.

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

בגרסה הזו יש כמה שיפורים בחלונית 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 לחלונית Network.

בעיה ב-Chromium: 397481040.

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

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

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

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

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

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

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

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

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

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