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

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

سابقه چت مداوم هوش مصنوعی

پانل کمک هوش مصنوعی اکنون به صورت محلی سابقه چت شما را در طول جلسات حفظ می کند، بنابراین می توانید مکالمات قبلی خود را با Gemini حتی پس از بارگیری مجدد DevTools یا Chrome مشاهده کنید.

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

این نسخه تعدادی بهبود در پنل Performance به ارمغان می آورد.

بینش تحویل تصویر

تب Performance > Insights اکنون می‌تواند تصاویری را که می‌توانید اندازه فایل آنها را بهینه کنید، برجسته کنید. روی یک تصویر در بینش کلیک کنید تا آن را در مسیر شبکه برجسته کنید.

پانل عملکرد با بینش تحویل تصویر برجسته شده است.

برای کسب اطلاعات بیشتر در مورد نحوه بهینه سازی تحویل تصویر، به رمزگذاری کارآمد تصاویر مراجعه کنید.

ناوبری صفحه کلید کلاسیک و مدرن

اکنون پانل عملکرد به شما امکان می دهد سبک دلخواه خود را برای پیمایش صفحه کلید، با تفاوت های اصلی زیر انتخاب کنید:

  • کلاسیک : زوم با چرخ ماوس (پد لمسی بالا یا پایین) و اسکرول عمودی با Shift + چرخ ماوس.
  • مدرن : اسکرول عمودی با چرخ ماوس، اسکرول افقی با Shift + چرخ ماوس و زوم با Command/Control + چرخ ماوس.

برای انتخاب سبک دلخواه خود، در گوشه سمت راست بالای پانل، روی Show shortcuts کلیک کنید و کلاسیک یا مدرن را انتخاب کنید. گفتگوی میانبرها همچنین یک شیت از میانبرهای موجود را در اختیار شما قرار می دهد.

گفتگوی میانبرها با میانبرهای موجود برای پانل عملکرد.

اسکریپت های نامربوط در نمودار شعله را نادیده بگیرید

برای تمرکز بهتر روی کد خود، اکنون می توانید اسکریپت های نامربوط را برای نادیده گرفتن لیست درست در پنل عملکرد اضافه کنید. پانل به طور خودکار لانه سازی بیش از حد را جمع می کند.

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

DevTools قوانین فهرست نادیده گرفته شده را که در تنظیمات > فهرست نادیده می‌افزایید ذخیره می‌کند و می‌توانید آن‌ها را به دلخواه در گفتگو روشن و خاموش کنید.

نشانگر خط زمانی و برجسته‌سازی محدوده در شناور

برای کمک به درک بهتر ردیابی عملکرد، اکنون پنل عملکرد موارد زیر را انجام می دهد:

  • نشانگر عمودی را به شما نشان می‌دهد که وقتی ماوس را روی خط زمانی می‌برید، کل ردیابی عملکرد را در بر می‌گیرد.
  • هنگامی که ماوس را روی موارد در مسیر اصلی نگه می دارید، محدوده ای را در خط زمانی برجسته می کند.

تنظیمات دریچه گاز توصیه شده

اکنون پانل Performance تنظیمات throttling را هم در معیارهای زنده و هم در مربوطه در منوهای کشویی تنظیمات ضبط را توصیه می کند.

قبل و بعد از افزودن توصیه های throttling به منوهای تنظیمات.

کاهش سرعت CPU توصیه شده (در حال حاضر) پرکاربردترین 4x slowdown است و توصیه شبکه بر اساس داده‌های گزارش Chrome UX است، اگر در معیارهای زنده روشن باشد.

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

نشانگرهای زمان بندی در یک پوشش

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

قبل و بعد از حرکت نشانگرها به پایین ردیابی.

آهنگ Timeings فراخوانی های mark() و measure() سفارشی شما را حفظ می کند.

ردپاهای فراخوانی جاوا اسکریپت را در خلاصه جمع کنید

تب Performance > Summary اکنون به شما نشان می‌دهد که ردپایی از تماس‌های جاوا اسکریپت، از جمله تماس‌های ناهمگام را روی هم قرار می‌دهد.

قبل و بعد از افزودن stack traces به برگه Summary.

تنظیمات نشان به منوی عناصر منتقل شد

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

قبل و بعد از انتقال تنظیمات نشان به منو.

پانل جدید "چه خبر است".

پانل What's new ظاهر جدیدی پیدا می کند که طراحی کروم را با دقت بیشتری دنبال می کند.

ظاهر قدیمی و جدید پانل "چه خبر است".

شماره Chromium: 325441858 .

فانوس دریایی 12.3.0

پنل Lighthouse اکنون Lighthouse 12.3.0 را اجرا می کند.

این به‌روزرسانی، در میان چیزهای دیگر، ممیزی‌های جدیدی را اضافه می‌کند که با COOP و سیاست HSTS قوی، جداسازی مبدأ مناسب را بررسی می‌کند. لیست کامل تغییرات را ببینید.

برای یادگیری اصول اولیه استفاده از پنل Lighthouse در DevTools، به Lighthouse: Optimize website speed مراجعه کنید.

شماره Chromium: 40543651 .

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

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

  • منابع : در صورت توقف موقت، اشکال‌زدا اکنون به طور غیرمنتظره‌ای به بافت سرویس‌کار تغییر نمی‌کند، اگر پس از توقف ایجاد شود ( 373893057 ).
  • عملکرد :
    • به محض نگه داشتن ماوس روی اسکریپت ها، راهنمایی های ابزار در نمودار شعله اکنون URL ها را در صورت وجود نشان می دهد ( 368541957 ).
    • خلاصه : نمودار دایره ای با نمایش میله ای جایگزین می شود.
    • چک باکس Extension data در تنظیمات Capture به Show tracks custom تغییر نام داده است.
    • اکنون برگه Insights دارای یک بخش Passed insights (N) است که به طور پیش‌فرض جمع شده است.
  • Application > Storage : می توانید ورودی های ذخیره سازی را با کلیدهای خالی ایجاد کنید زیرا از نظر فنی معتبر هستند ( 373703285 ).
  • اکنون حالت دستگاه برای صفحات chrome:// غیرفعال شده است ( 40186276 ).
  • شبکه :
    • وقتی تنظیم مربوطه روشن است ، یک بار بر روی Export HAR کلیک کنید، اکنون منویی با دو گزینه (غیر عفونی شده و با داده های حساس) باز می شود. قبلاً، منو با یک کلیک طولانی باز می شد ( 378076279 ).
    • Copy as cURL اکنون از ویژگی -b برای دور زدن کوکی‌ها و خوانایی بیشتر استفاده می‌کند، به جای -H 'cookie:...' ( 40791742 ).
  • دسترس‌پذیری : اکنون می‌توانید برگه‌های داخل پانل‌ها را با منوی زمینه به چپ یا راست حرکت دهید ( 383164782 ).
  • مسدود کردن درخواست شبکه : این تنظیمات منوی فرمان اکنون با کادر انتخاب مربوطه همگام است ( 378058733 ).

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

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

با تیم Chrome DevTools در تماس باشید

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

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

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