چیزهای جدید در DevTools (Chrome 58)

به اولین قسمت از یادداشت های انتشار DevTools خوش آمدید! از اینجا به بعد، اولین باری که نسخه جدیدی از Chrome را باز می کنید، DevTools کشوی What's New را با پیوندی به یادداشت های انتشار برای آن نسخه باز می کند.

نکات برجسته

  • پانل Timeline به پنل Performance تغییر نام داده است.
  • پانل پروفایل ها به پانل حافظه تغییر نام داده است.
  • اکنون مقادیر کوکی قابل ویرایش هستند.
  • DevTools اکنون به طور خودکار قبل از خطاهای خارج از حافظه مکث می کند.

ویژگی های جدید

کوکی های قابل ویرایش

برای ویرایش آن مقدار، روی یک سلول در تب کوکی ها دوبار کلیک کنید.

در حال ویرایش یک کوکی
شکل 1 . در حال ویرایش یک کوکی

با تشکر از kdzwinel برای مشارکت!

متغیرهای CSS قابل بازرسی و ویرایش در قسمت Styles

اکنون می توانید متغیرهای CSS را در قسمت Styles بررسی و ویرایش کنید. CSS Variables Demo را ببینید تا خودتان آن را امتحان کنید.

نقاط شکست خارج از حافظه

هنگامی که یک برنامه حافظه زیادی را در مدت زمان کوتاهی اختصاص می دهد، DevTools اکنون به طور خودکار مکث می کند و محدودیت پشته را افزایش می دهد. این به شما امکان می دهد تا heap را بررسی کنید، دستوراتی را در کنسول برای آزاد کردن حافظه اجرا کنید و به رفع اشکال ادامه دهید. برای اطلاعات بیشتر به One Small Step For Chrome, One Giant Heap For V8 مراجعه کنید.

در نقطه شکست حافظه بدون حافظه متوقف شد
شکل 2 . در نقطه شکست حافظه بدون حافظه متوقف شد

نقاط شکست در ایجاد بوم

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

نقاط انفصال ایجاد بوم از طریق کادر بررسی ایجاد زمینه بوم در پنجره Event Liner Breakpoints
شکل 3 . نقاط انفصال ایجاد بوم از طریق کادر بررسی ایجاد زمینه بوم در پنجره Event Liner Breakpoints

آمار زمان شروع در برگه زمان‌بندی

در بالای برگه زمان‌بندی، اکنون می‌توانید ببینید چه زمانی یک درخواست در صف قرار گرفته و شروع شده است.

آمار زمان شروع در برگه زمان‌بندی.
شکل 4 . آمار زمان شروع در برگه زمان‌بندی

آمار سرور در تب زمان بندی

اکنون می توانید آمار سرور سفارشی را در برگه زمان بندی وارد کنید. برای مثال به نسخه نمایشی مقادیر زمان بندی سرور مراجعه کنید.

آمار سرور در تب زمان بندی
شکل 5 . آمار سرور در تب زمان بندی

با تشکر از sroussey برای کمک!

تغییرات

پانل Timeline اکنون به پنل Performance تبدیل شده است

پانل Timeline به پانل Performance تغییر نام داده است تا هدف خود را بهتر نشان دهد.

پانل Profiles اکنون پانل حافظه است

پانل پروفایل ها به پانل حافظه تغییر نام داده است تا هدف خود را بهتر نشان دهد.

CPU Profiler پشت یک پنل مخفی قرار دارد

اکنون که پنل Profiles پنل حافظه نامیده می شود، دیگر وجود پروفایلر CPU در آن پنل منطقی نیست. علاوه بر این، هدف بلندمدت این است که همه کاربران از پنل عملکرد نمایه شوند. در ضمن، همچنان می‌توانید از تنظیمات > ابزارهای بیشتر > نمایه‌ساز جاوا اسکریپت به نمایه‌ساز قدیمی CPU دسترسی داشته باشید.

به Chrome DevTools: JavaScript CPU Profileing در Chrome 58 مراجعه کنید تا با نحوه ایجاد نمایه CPU در پانل عملکرد آشنا شوید.

رابط کاربری جدید کنسول

پنل کنسول و کشو دستخوش تغییراتی در رابط کاربری شده است. برخی از ویژگی‌های نامطلوب به مکان‌های مخفی‌تر منتقل شده‌اند و ویژگی‌های محبوب اکنون به راحتی قابل دسترسی هستند.

  • روی تنظیمات کنسول کلیک کنید تنظیمات کنسول برای دسترسی به تنظیمات برای سفارشی کردن رفتار کنسول.
  • گزارش حفظ اکنون در تنظیمات کنسول پنهان است.
  • دکمه و صفحه فیلترها از بین رفته است. به جای آن از منوی کشویی استفاده کنید.
  • کادر متنی برای فیلتر کردن گزارش‌ها اکنون همیشه نشان داده می‌شود. قبلاً در قسمت فیلترها پنهان شده بود.
  • کادر متنی فیلتر به طور خودکار RegEx را می پذیرد، بنابراین چک باکس Regex از بین می رود.
  • چک باکس پنهان کردن نقض ها حذف شده است. برای مشاهده موارد نقض، کشویی سطح گزارش را روی Verbose تنظیم کنید.
  • برداشتن علامت چک باکس نمایش همه پیام‌ها در رابط کاربری قدیمی برابر است با علامت زدن کادر فقط زمینه انتخاب شده در تنظیمات کنسول در رابط کاربری جدید.
رابط کاربری جدید کنسول
شکل 6 . رابط کاربری جدید کنسول

نقاط شکست شنونده رویداد WebGL تغییر کرده است

نقاط شکست شنونده رویداد WebGL از دسته WebGL به دسته Canvas منتقل شده است. دسته WebGL حذف شده است.