موارد جدید در DevTools، Chrome 127

سوفیا املیانوا
Sofia Emelianova
GitHub

برای کمک به شما در رفع اشکال ویژگی موقعیت یابی لنگر آسان تر، تب Styles اکنون شناسه های لنگر صریح و لنگرهای ضمنی را به گره های آنها پیوند می دهد.

قبل و بعد از پیوند دادن لنگرهای صریح و ضمنی.

علاوه بر این، مقدار ویژگی popovertarget اکنون به عنصر popover خود در DOM پیوند می‌یابد.

قبل و بعد از پیوند popovertarget به عنصر popover آن.

شماره Chromium: 289900232 ، 330306231 .

بهبود پنل منابع

این نسخه چندین پیشرفت را در پنل Sources به ارمغان می آورد.

بهبود یافته "هرگز اینجا مکث نکن"

گزینه "Never Pause Here" به شما این امکان را می دهد که مانع از مکث دوباره و دوباره Debugger در همان خط شوید. این کار با نقاط شکست نامربوط که به طور مکرر شلیک می شوند آسان تر می کند. این نسخه این قابلیت را افزایش می دهد و اکنون برای موارد زیر کار می کند:

  • استثناها یا رد کردن وعده از توابع داخلی.
  • "لغو" نقاط شکست DOM، واکشی/XHR و CSP.
  • در جداسازی قطعات Wasm.

گردش کار را در عمل مشاهده کنید:

شماره Chromium: 40924349 .

شنوندگان رویداد اسنپ اسکرول جدید

منابع > نقاط شکست شنونده رویداد > فهرست کنترل دو شنونده مرتبط با اسنپ اسکرول دریافت می کند: scrollsnapchange و scrollsnapchanging . این رویدادها زمانی فعال می شوند که محفظه اسکرول را به گونه ای اسکرول می کنید که باعث می شود به عنصر جدیدی بچسبد.

قبل و بعد از افزودن شنوندگان رویداد مرتبط با اسکرول.

شماره Chromium: 40286359 .

بهبود پنل شبکه

این نسخه چندین پیشرفت را در پنل شبکه به ارمغان می آورد.

از پیش تنظیم های کاهش فشار شبکه به روز شده است

پانل شبکه از پیش تنظیم های به روز شده دریافت می کند: Fast 4G جدید، Fast 3G به Slow 4G و Slow 3G تغییر نام به 3G . این بهتر با پیش تنظیم های Lighthouse هماهنگ می شود.

قبل و بعد از به‌روزرسانی از پیش تنظیم فشار شبکه.

شماره Chromium: 342406608 .

اطلاعات کارکنان خدمات در زمینه های سفارشی با فرمت HAR

هنگام صادرات ورود به شبکه به فرمت HAR، اکنون می توانید اطلاعات مربوط به کارکنان خدمات، از جمله زمان بندی را به عنوان فیلدهای سفارشی (با پیشوند زیرخط) مشاهده کنید. برای مثال، ممکن است فیلدهای جدید زیر را در گزارش پیدا کنید:

...
"response": {
  ...
  "_fetchedViaServiceWorker": true,
  "_responseCacheStorageCacheName": "V1",
  "_serviceWorkerResponseSource": "cache-storage"
}
...
"timings": {
  ...
  "_workerStart": -1,
  "_workerReady": -1,
  "_workerFetchStart": -1,
  "_workerRespondWithSettled": -1
}
...

شماره Chromium: 342406608 .

رویدادهای WebSocket را در پنل Performance ارسال و دریافت کنید

مشابه سایر رویدادهای WebSocket، پانل عملکرد اکنون رویدادهای Send WebSocket Message و Receive WebSocket Message را ضبط می کند و آنها را در ردیابی عملکرد نشان می دهد. مثلا:

رویداد «دریافت پیام WebSocket» در ردیابی عملکرد ثبت شده است.

شماره Chromium: 40286129 .

نکات برجسته متفرقه

برخی از اصلاحات و بهبودهای قابل توجه در این نسخه عبارتند از:

  • دسترس‌پذیری : اکنون صفحه‌خوان‌ها محتوای پیام‌ها را در کنسول هنگام پیمایش در گزارش با کلیدهای جهت‌دار بالا و پایین ( 344484979 ) اعلام می‌کنند.
  • منابع :
    • صفحه : گزینه منوی Save as اکنون فایل‌های ماژول Wasm را به‌جای متن Base64 ( 40784130 ) به‌عنوان باینری‌های معتبر wam ذخیره می‌کند.
    • پشته تماس : پسوند (async) از توضیحات قاب تماس Async حذف کرد، برجسته آنها را از مورب به پررنگ تغییر داد ( 343750870 ).
  • حافظه : InternalNodes غیرضروری با اندازه صفر را از خلاصه عکس پشته‌ای ( 340200025 ) حذف کرد.
  • شبکه : رفع اشکالی که از پیش‌نمایش محتوای پاسخ جریانی برای درخواست‌هایی که تازه شروع شده‌اند اما هنوز responseReceived دریافت نکرده‌اند، رفع شده است ( 338340752 ).
  • کارایی :
    • آمار انتخابگر : یک راهنمای ابزار توضیحی برای ستون %-of-Slow-Path-Non-Matches اضافه شد ( 324282954 ).
    • حالت پیکربندی آهنگ : دکمه Finish configuring tracks به سمت راست پایین ( 345256274 ) منتقل شده است.
  • کنسول : رفع اشکالی که چندین پیام کنسول یکسان را هنگام پیمایش با استفاده از حافظه پنهان پشت و رو به جلو نشان می داد ( 40894153 ).
  • تنظیمات : اضافه شدن نمادهای کمکی در کنار همه برگه ها ( 330213867 ).

کانال های پیش نمایش را دانلود کنید

استفاده از Chrome Canary ، Dev یا Beta را به عنوان مرورگر توسعه پیش‌فرض خود در نظر بگیرید. این کانال‌های پیش‌نمایش به شما امکان می‌دهند به جدیدترین ویژگی‌های DevTools دسترسی داشته باشید، APIهای پلت‌فرم وب پیشرفته را آزمایش کنید و قبل از اینکه کاربرانتان این کار را انجام دهند، مشکلات موجود در سایت خود را پیدا کنید!

تماس با تیم Chrome DevTools

از گزینه های زیر برای بحث در مورد ویژگی ها و تغییرات جدید در پست یا هر چیز دیگری مربوط به DevTools استفاده کنید.

  • پیشنهاد یا بازخورد خود را از طریق crbug.com برای ما ارسال کنید.
  • با استفاده از گزینه های بیشتر ، مشکل DevTools را گزارش کنیدبیشتر > راهنما > گزارش مشکلات DevTools در DevTools.
  • توییت در @ChromeDevTools .
  • نظرات خود را در مورد ویدیوهای YouTube DevTools یا نکات DevTools در YouTube ما بنویسید.

چیزهای جدید در DevTools

فهرستی از همه چیزهایی که در سری چیزهای جدید در DevTools پوشش داده شده است.

کروم 127

کروم 126

کروم 125

کروم 124

کروم 123

کروم 122

کروم 121

کروم 120

کروم 119

کروم 118

کروم 117

کروم 116

کروم 115

کروم 114

کروم 113

کروم 112

کروم 111

کروم 110

کروم 109

کروم 108

کروم 107

کروم 106

کروم 105

کروم 104

کروم 103

کروم 102

کروم 101

کروم 100

کروم 99

کروم 98

کروم 97

کروم 96

کروم 95

کروم 94

کروم 93

کروم 92

کروم 91

کروم 90

کروم 89

کروم 88

کروم 87

کروم 86

کروم 85

کروم 84

کروم 83

کروم 82

Chrome 82 لغو شد .

کروم 81

کروم 80

کروم 79

کروم 78

کروم 77

کروم 76

کروم 75

کروم 74

کروم 73

کروم 72

کروم 71

کروم 70

کروم 68

کروم 67

کروم 66

کروم 65

کروم 64

کروم 63

کروم 62

کروم 61

کروم 60

کروم 59