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

Kayce Basques

ویژگی‌های جدید و تغییرات عمده‌ای که به DevTools در Chrome 61 می‌آیند عبارتند از:

• شبیه سازی گاز دستگاه تلفن همراه CPU و throttling شبکه را به طور همزمان تنظیم کنید تا دستگاه های تلفن همراه سطح متوسط ​​یا پایین را شبیه سازی کنید.
• استفاده از ذخیره سازی مشاهده میزان فضای ذخیره سازی که منبع استفاده می کند، به تفکیک فناوری (IndexedDB، حافظه پنهان، محلی، جلسه و غیره).
• تمبرهای زمانی کش مشاهده زمانی که یک سرویس دهنده پاسخی را در حافظه پنهان ذخیره کرده است.
• FPS Meter را از منوی فرمان فعال کنید .
• رفتار چرخ ماوس و پد لمسی را در پانل عملکرد تغییر دهید .
• ماژول های ES6 را به صورت بومی اشکال زدایی کنید .

نسخه ویدیویی این یادداشت‌های انتشار را در زیر بررسی کنید یا برای کسب اطلاعات بیشتر به ادامه مطلب بروید.

دستگاه های تلفن همراه رده پایین و متوسط ​​را در حالت دستگاه شبیه سازی کنید

منوی Device Mode Throttling اکنون به طور پیش‌فرض در معرض دید قرار گرفته است و اکنون به شما امکان می‌دهد یک دستگاه تلفن همراه سطح پایین یا متوسط ​​را با چند کلیک شبیه‌سازی کنید.

شکل 1 . منوی تروتتلینگ

شکل 2 . ماوس را روی منوی Throttling نگه دارید یا منوی تنظیمات ضبط را باز کنید تا تعاریف را برای تلفن همراه میان‌رده و موبایل ارزان‌قیمت ببینید.

مشاهده میزان استفاده از فضای ذخیره سازی

بخش جدید Usage در برگه Clear Storage پنل Application به شما نشان می‌دهد که یک منبع از چه مقدار فضای ذخیره‌سازی استفاده می‌کند، و همچنین حداکثر سهمیه برای مبدا در این دستگاه.

شکل 3 . بخش استفاده نشان می دهد که https://airhorner.com از 66.9 کیلوبایت از سهمیه اصلی 15214 مگابایت استفاده می کند.

مشاهده زمانی که یک کارگر سرویس پاسخ‌ها را در حافظه پنهان ذخیره کرده است

ستون جدید Time Cached در برگه حافظه پنهان به شما نشان می دهد که یک سرویس دهنده پاسخ ها را در حافظه پنهان ذخیره می کند.

شکل 4 . ستون Time Cached

FPS Meter را از منوی فرمان فعال کنید

اکنون می توانید FPS Meter را از منوی فرمان فعال کنید.

شکل 5 . فعال کردن FPS Meter از منوی فرمان

رفتار چرخ ماوس را برای زوم یا پیمایش با ضبط‌های عملکرد تنظیم کنید

تنظیمات را باز کنید و تنظیم عملکرد چرخ ماوس Flamechart جدید را برای تغییر نحوه رفتار چرخ‌های ماوس در پانل عملکرد تنظیم کنید.

به عنوان مثال، وقتی از چرخ ماوس در بخش اصلی ضبط استفاده می‌کنید، یا وقتی با دو انگشت روی صفحه لمسی می‌کشید، رفتار پیش‌فرض بزرگ‌نمایی یا کوچک‌نمایی است. وقتی تنظیم را به اسکرول تغییر می‌دهید، این حرکت اکنون به سمت بالا یا پایین حرکت می‌کند.

شکل 6 . تنظیم عملکرد چرخ ماوس Flamechart

پشتیبانی از اشکال زدایی برای ماژول های ES6

ماژول‌های ES6 به صورت بومی در Chrome 61 ارسال می‌شوند. در اینجا چیز زیادی در رابطه با DevTools اتفاق نمی‌افتد، به غیر از اینکه اشکال‌زدایی همانطور که انتظار دارید کار می‌کند. سعی کنید چند نقطه انفصال را تعیین کنید و از پیاده‌سازی TodoMVC ES6-Module Paul Irish قدم بگذارید تا خودتان ببینید.

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

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

تماس با تیم Chrome DevTools

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

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

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

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