מה חדש בכלי הפיתוח (Chrome 61)

Kayce Basques

התכונות החדשות והשינויים המשמעותיים שנוספו לכלי הפיתוח ב-Chrome 61 כוללים:

• סימולציה של ויסות נתונים במכשירים ניידים. אפשר להגדיר ויסות נתונים של המעבד (CPU) ושל הרשת בו-זמנית, כדי לדמות מכשירים ניידים ברמה בינונית או נמוכה.
• נפח האחסון בשימוש. אפשר לראות כמה נפח אחסון מקור מסוים תופס, עם פירוט לפי טכנולוגיה (IndexedDB, מטמון, מקומי, סשן וכו').
• חותמות זמן של מטמון. לראות מתי קובץ שירות (service worker) שמר תשובה במטמון.
• הפעלת מדד ה-FPS מתפריט הפקודות
• שינוי ההתנהגות של גלגל העכבר ולוח המגע בחלונית Performance
• ניפוי באגים במודולים של ES6 באופן מקורי.

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

סימולציה של מכשירים ניידים ברמה נמוכה ובינונית במצב המכשיר (Device Mode)

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

איור 1. תפריט ויסות הנתונים

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

צפייה בניצול נפח האחסון

בקטע Usage החדש בכרטיסייה Clear Storage בחלונית Application מוצג נפח האחסון שבו נעשה שימוש בorigin, וגם המכסה המקסימלית של ה-origin במכשיר הזה.

איור 3. בקטע Usage (שימוש) אפשר לראות ש-https://airhorner.com משתמש ב-66.9KB מתוך מכסת המקור של 15,214MB.

איך רואים מתי עובד שירות שמר תגובות במטמון

בעמודה החדשה Time Cached בכרטיסייה Cache Storage מוצג מתי ה-service worker שמר תשובות במטמון.

איור 4. העמודה Time Cached

הפעלת מדד ה-FPS מתפריט הפקודות

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

איור 5. הפעלת מדד ה-FPS מתפריט הפקודות

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

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

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

איור 6. ההגדרה פעולה של גלגלת העכבר בתרשים הלהבות

תמיכה בניפוי באגים במודולים של ES6

מודולים של ES6 נשלחים באופן מקורי ב-Chrome 61. אין הרבה מה לראות כאן בנוגע ל-DevTools, חוץ מזה שהניפוי באגים פועל כמו שציפיתם. כדי לראות בעצמכם, נסו להגדיר כמה נקודות עצירה ולעבור שלב אחר שלב ב-ES6-Module-implementation של פול איריש של TodoMVC.

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

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

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

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

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

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

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