تاریخ انتشار: ۲۰ اکتبر ۲۰۲۶
Chrome 155 و Chrome 156 در ماه اکتبر به نسخه پایدار منتقل شدند و مجموعه‌ای جدید از قابلیت‌های اشکال‌زدایی و تألیف را در ماه نوامبر به مرورگر شما آوردند: بازرسی سبک CSS در DevTools برای عامل‌ها، ویرایشگر تعاملی position-area برای موقعیت‌یابی لنگر CSS در عناصر، و مانیفست نصب وب و تشخیص منشأ آگهی در برنامه. همچنین می‌توانید متغیرهای بافت مرده را در حافظه شناسایی کنید، هشدارهای پیش‌بارگیری Early Hints و لغوهای دائمی را در شبکه بررسی کنید، و خطوط زمان را به‌طور روان‌تر در عملکرد پیمایش کنید.
DevTools برای عامل‌ها
سرور MCP در Chrome DevTools بازرسی سبک CSS، پشتیبانی از فایل پیکربندی، و تجزیه ردیابی تکه‌تکه را برای عامل‌های کدنویسی اضافه می‌کند:
- بازرسی سبک CSS: سبک‌های محاسبه‌شده و مطابقت‌داده‌شده را با ابزار
get_css_stylesبازرسی کنید که از صفحه‌بندی (pageSizeوpageIdx) پشتیبانی می‌کند و قوانین مطابقت‌داده‌شده، قوانین موروثی، شبه‌عناصر،@keyframes، و قوانین@(@position-try،@property، و@function) را قالب‌بندی می‌کند. - کنترل‌های مسیر و فایل پیکربندی: پرچم‌های سرور را با فایل پیکربندی اختصاصی مدیریت کنید، ریشه‌های سیستم فایل سفارشی را پیکربندی کنید، و به‌طور پیش‌فرض از
--allow-unrestricted-pathsدر CLI استفاده کنید. - تجزیه میان‌گیر ردیابی تکه‌تکه: ضبط‌های عملکرد بزرگ را با تجزیه‌کننده میان‌گیر ردیابی تکه‌تکه و میان‌گیر ردیابی پیش‌فرض ۱٫۲ گیگابایتی تجزیه کنید. DevTools همچنین نمونه‌های موتور ردیابی را برای هر تجزیه محدود می‌کند تا از نشت حافظه جلوگیری کند.
- مدیریت کادر گفتگو و پایداری کنسول: کادرهای گفتگوی JavaScript را که درطول کنش‌های ابزار ورودی فعال می‌شوند به‌طور خودکار مدیریت کنید و سابقه پیام کنسول را در پیمایش‌های سند یکسان حفظ کنید.
- به‌روزرسانی منو: روی دریافت Chrome DevTools برای عامل‌ها در منو اصلی DevTools کلیک کنید تا دستورالعمل‌های راه‌اندازی باز شود.
در مخزن chrome-devtools-mcp بیشتر بدانید.
عناصر: ویرایشگر دیداری ناحیه موقعیت، انتخاب لنگر ضمنی، و به‌روزرسانی‌های تألیف CSS
پانل عناصر ابزار بصری برای موقعیت‌یابی لنگر CSS معرفی می‌کند و بازرسی CSS را گسترش می‌دهد:
- ویرایشگر
position-areaدیداری: روی نمونه رنگ درون‌خطی کنارposition-areaاعلامیه در برگه سبک‌ها کلیک کنید تا مناطق شبکه لنگر را به‌صورت دیداری انتخاب کنید، محورها را به‌طور هم‌زمان یا جداگانه پیکربندی کنید، کلیدواژهselfرا روشن/خاموش کنید، و کلیدواژه‌های بدون محور را کوتاه کنید. - انتخاب لنگر ضمنی در تزئین‌کننده‌های popover: وقتی عنصری چند لنگر ضمنی دارد، روی تزئین‌کننده popover در درخت DOM کلیک راست کنید تا هر عنصر لنگر مرتبط را بازرسی کنید و به آن بروید.
- برافزایی جعبه موقعیت‌یابی لنگر: هنگام اشکال‌زدایی عناصر موقعیت‌یابی‌شده لنگر، حاشیه، لایه داخلی، مرز، و جعبه‌های محتوای بلوک حاوی اصلاح‌شده با درج (IMCB) را مستقیماً در برافزایی نمای هدف بازرسی کنید.
wrap-reverseدر ویرایشگر Flexbox:flex-wrap: wrap-reverseرا مستقیماً از ویرایشگر Flexbox دیداری در برگه سبک‌ها تغییر دهید.- سبک‌های غیرفعال CSS برای
@starting-styleو قوانین موروثی: قوانین غیرفعال@starting-styleو بخش‌هایInherited fromرا با حفظ حالت‌های گسترش و جمع کردن دستی در به‌روزرسانی‌ها بازرسی کنید. - ویژگی‌های سفارشی چندخط‌تیره‌ای و تکمیل خودکار کلاس: ویژگی‌های سفارشی CSS را که با سه خط‌تیره یا بیشتر شروع می‌شوند (مثل
---theme-color) بازرسی و ویرایش کنید و کلاس‌های ازقبل اعمال‌شده را از پیشنهادهای تکمیل خودکار افزودن کلاس جدید فیلتر کنید.
مشکلات Chromium: ۵۵۳۳۳۵۵۶۱، ۴۳۸۷۲۴۵۷۰، ۴۱۳۰۶۱۴۱۳، ۳۹۷۱۸۴۳۹۲، ۵۳۹۴۲۴۱۱۶، ۵۳۳۷۸۳۹۸۸
برنامه: عیب‌یابی مانیفست «نصب وب»، منشأ آگهی، و به‌روزرسانی‌های جدول فضای ذخیره‌سازی
پانل‌های برنامه و مشکلات عیب‌یابی را برای مانیفست‌های «نصب وب»، منشأ اسکریپت آگهی، و بازرسی فضای ذخیره‌سازی اضافه می‌کنند:
- عیب‌یابی مانیفست «نصب وب»: خطاهای مانیفست «نصب وب» (
navigator.installو<install>) را در پانل مشکلات بررسی کنید—شامل خطاهای واکشی، خطاهای نحوی، مقادیرstart_urlنامعتبر، نام‌ها یا شناسه‌های ناموجود، و مانیفست‌های ناموجود—با پیوندهای مستقیم به فایل مانیفست تحت‌تأثیرقرارگرفته. - اسناد سنجه و ستون منشأ آگهی: ستون جدید منشأ آگهی را در بخش آگهی‌ها در پانل برنامه بررسی کنید تا ببینید آیا اسکریپت آگهی با زنجیره اسکریپت اجدادی یا قانون فهرست فیلتر مطابقت دارد یا نه، و همچنین نکته‌ابزارهای اسناد و پیوندهای بیشتر بدانید را در سنجه‌های آگهی ببینید.
- ارگونومی جدول IndexedDB و کوکی‌ها: اشیای تودرتو را در شبکه داده IndexedDB با ارتفاع ردیف پویا که موقعیت پیمایش شما را حفظ می‌کند، گسترش دهید و ردیف‌های انتخاب‌شده را در جدول کوکی‌ها بااستفاده از صفحه‌کلید یا منوِ بافت حذف کنید.
مشکلات Chromium: ۳۳۳۷۹۵۲۶۵، ۵۵۳۴۲۸۲۰۰، ۵۱۴۹۵۷۱۳۴، ۵۵۵۳۰۴۸۱۷، ۵۵۵۳۰۴۸۱۴، ۵۶۲۱۴۲۱۵۵
شبکه: هشدارهای پیش‌بارگذاری «نکات اولیه» و لغوهای دائمی
پانل شبکه عیب‌یابی «نکات اولیه»، لغوهای محلی، و گردش‌های کاری سرصفحه سفارشی را بهبود می‌بخشد:
- هشدار پیش‌بارگذاری «نکات اولیه» هنگام غیرفعال بودن حافظه پنهان: وقتی پاسخ‌های
103 Early Hintsحاوی پیوندهای پیش‌بارگذاری است و غیرفعال کردن حافظه پنهان فعال است، هشداری در بخش سرصفحه‌های نکات اولیه مشاهده کنید که توضیح می‌دهد چرا Chrome این پیش‌بارگذاری‌ها را نادیده می‌گیرد. - ملغی کردن‌های محلی پایدار و ستون‌های سرایند سفارشی: ملغی کردن‌های بدنه پاسخ محلی را در پیمایش‌های صفحه ارائه دهید، پیکربندی‌های ستون سرایند درخواست و پاسخ سفارشی و ترتیب مرتب‌سازی را در بارگیری‌های مجدد حفظ کنید، و محموله‌های درخواست خام کوتاه شده را از منوِ بافت کپی کنید.
مشکلات Chromium: ۵۴۸۷۰۱۰۳۸، ۵۵۹۹۲۵۵۱۰، ۵۶۳۵۴۲۹۰۲، ۵۵۶۲۶۹۵۴۲، ۳۷۷۴۱۰۰۸۲
حافظه: تشخیص فیلد بافت مرده در تصویرهای کلی پشته
پانل حافظه اکنون متغیرهای بسته استفاده‌نشده را که در زمینه‌های اجرای V8 باقی مانده‌اند شناسایی می‌کند. DevTools فراداده‌های محدوده V8 را که در تصاویر کلی پشته جاسازی شده‌اند تجزیه می‌کند تا بستارها را با اشیای Context هم‌رسانی‌شده مرتبط کند. سپس فیلدهای بافت مرده را که توسط بستارهای هم‌نیا با عمر طولانی زنده نگه داشته شده‌اند، زمانی که هیچ بستار زنده‌ای به آن‌ها دسترسی ندارد، برجسته می‌کند و آن‌ها را براساس تأثیر حافظه مرتب می‌کند.
مشکلات Chromium: ۴۹۷۸۵۵۶۵۸
عملکرد: پیمایش روان‌تر خط زمان و حفظ وضعیت درخت تماس
پانل عملکرد پیمایش نمودار شعله‌ای واکنش‌گراتری ارائه می‌دهد و بافت تحلیلی شما را در پانل‌ها حفظ می‌کند:
- پیمایش روان‌تر خط زمان: بزرگ‌نمایی، حرکت افقی، و کشیدن نقشه کوچک خط زمان دیگر تأخیر ندارد.
- حفظ وضعیت «درخت فراخوانی» و «پایین به بالا»: بین پانل‌های DevTools جابه‌جا شوید بدون اینکه گره‌های گسترش‌یافته، انتخاب، یا موقعیت پیمایش را در برگه‌های درخت فراخوانی و پایین به بالا ازدست بدهید.
مشکلات Chromium: ۵۵۳۸۳۱۶۵۳، ۵۶۱۳۹۶۵۹۰
موارد برجسته دیگر
Chrome 155 و Chrome 156 همچنین شامل بهبودهای زیر در پانل‌های DevTools هستند:
- حسگرها:
navigator.cpuPerformanceرا مستقیماً از کنترل جدید سطح عملکرد واحد پردازش مرکزی در پانل حسگرها لغو کنید، یا اجازه دهید پیش‌تنظیم‌های فعال محدودسازی واحد پردازش مرکزی را منعکس کند. (مشکلات Chromium: ۴۴۹۷۶۰۲۵۲، ۵۲۶۸۵۶۲۳۴، ۵۲۶۸۵۷۸۲۰) - حالت دستگاه: اولویت‌های بزرگ‌نمایی تنظیم خودکار و مقیاس را برای هر دستگاه شبیه‌سازی‌شده حفظ کنید و هنگام تغییر وضعیت نوارابزار دستگاه، لغو
Save-Dataرا حفظ کنید. (مشکلات Chromium: ۵۶۱۳۰۶۸۴۱، ۵۵۵۱۶۰۴۸۳) - انتخابگر رنگ: پیشنهادهای رنگ کنتراست APCA را برای نوشتار روشن در پس‌زمینه‌های تیره مشاهده کنید و رنگ‌های خارج از گاموت را به
oklab()وoklch()بدون مقادیرNaNتبدیل کنید. (مشکلات Chromium: ۵۶۰۳۲۵۶۶۹، ۵۵۸۸۲۱۲۵۸) - دسترس‌پذیری: کلیدهای فیلتر عبارت باقاعده فعال را با نقطه نشانگر غیررنگی شناسایی کنید، نام‌های ویژگی قلم را که توسط صفحه‌خوان‌ها در نمای کلی CSS اعلام می‌شود بشنوید، و با حلقه‌های تمرکز صفحه‌کلید بهبودیافته و نمایان بودن «کنتراست بالا» در پانل‌ها پیمایش کنید. (مشکلات Chromium: ۵۵۶۷۶۴۸۸۲، ۵۵۵۸۴۸۵۳۵، ۵۵۵۵۹۹۸۲۵، ۵۵۳۸۰۴۶۵۴)
مشکلات Chromium: ۴۴۹۷۶۰۲۵۲، ۵۲۶۸۵۶۲۳۴، ۵۲۶۸۵۷۸۲۰، ۵۶۱۳۰۶۸۴۱، ۵۵۵۱۶۰۴۸۳، ۵۶۰۳۲۵۶۶۹، ۵۵۸۸۲۱۲۵۸، ۵۵۶۷۶۴۸۸۲، ۵۵۵۸۴۸۵۳۵، ۵۵۵۵۹۹۸۲۵، ۵۵۳۸۰۴۶۵۴