الميزات الجديدة في إصدار Chrome 122

Adriana Jara

وفي ما يلي ما تحتاج إلى معرفته:

أنا أدريانا جارا لنطّلِع على التفاصيل ونتعرّف على الميزات الجديدة للمطوّرين في الإصدار 122 من Chrome.

واجهة برمجة تطبيقات حزم التخزين

توفّر Storage Buckets API مستوى أعلى من الدقة لإدارة مساحة التخزين الدائمة بشكل أفضل.

وفقًا التقليدية، عندما تنفد مساحة التخزين لدى المستخدم على جهازه، يتم فقدان البيانات المخزَّنة باستخدام واجهات برمجة التطبيقات، مثل IndexedDB أو localStorage، بدون أن يتمكّن المستخدم من التدخل. تتمثل إحدى طرق الحفاظ على مساحة التخزين الدائمة في استخدام طريقة persist() في واجهة StorageManager. ومع ذلك، فإن طريقة طلب أن تكون مساحة التخزين دائمة

تعتمد الفكرة الأساسية لواجهة برمجة التطبيقات Storage Storage API على منح المواقع الإلكترونية إمكانية إنشاء حِزم تخزين متعددة، حيث قد يختار المتصفّح حذف كل حزمة بشكل مستقل عن الحِزم الأخرى. لذا، يمكنك تحديد أولوية الإخلاء للتأكّد من عدم حذف البيانات الأكثر أهمية.ويمكن أن تحتوي كل حزمة تخزين على بيانات مرتبطة بواجهات برمجة التطبيقات التي تم إنشاؤها للتخزين مثل IndexedDB وذاكرة التخزين المؤقت.

انتقِل إلى المقالة ليست كل مساحة التخزين متساوية: تقديم "حِزم التخزين" لمزيد من التفاصيل وعيّنات التعليمات البرمجية لبدء استخدام "حِزم التخزين".

تحسينات على "أدوات مطوري البرامج" في لوحة الأداء

في "أدوات مطوري البرامج في Chrome 122"، تتضمَّن "أدوات مطوري البرامج" التحسينات التالية في لوحة الأداء.

أولاً، يتيح لك الآن المخطّط الزمني أعلى لوحة الأداء ضبط أشرطة التنقّل والتنقّل بينها. لضبط شريط تنقّل، اختَر نطاقًا في المخطّط الزمني ومرِّر مؤشر الماوس فوقه، ثم انقر على زر zoom_in N ms المقابل. يمكنك إنشاء عدة أشرطة تنقّل مدمجة على التوالي. للانتقال بين مستويات التكبير أو التصغير، انقر على شريط التنقّل المقابل في السلسلة أعلى المخطط الزمني. شاهد الفيديو التالي للتعرف على كيفية عمل أشرطة التنقل.

وتتوفّر أيضًا الآن أدوات بدء الأحداث في المسار الرئيسي. يعرض الأداء > المسار الرئيسي تلقائيًا الأسهم التي تربط بين إجراءات البدء والأحداث التالية التي تسببت فيها.

  • إلغاء صلاحية النمط أو التنسيق -> إعادة حساب الأنماط أو التنسيق
  • طلب إطار صورة متحركة -> تم تنشيط إطار الصورة المتحركة
  • طلب معاودة الاتصال غير المستخدَمة -> تنشيط معاودة الاتصال غير المستخدَمة حاليًا
  • تثبيت الموقّت -> تم تنشيط الموقِّت
  • إنشاء WebSocket -> إرسال... وتلقي تأكيد الاتصال بخادم WebSocket أو إزالة WebSocket

للاطّلاع على الأسهم، ابحث عن هذا الحدث في سجلّ التتبُّع وانقر عليه.

سهم من الطلب وتنشيط معاودة الاتصال غير المستخدَمة

يمكنك العثور على المزيد من التعديلات على "أدوات مطوري البرامج" في مقالة الميزات الجديدة في الإصدار 122 من Devtools.

الخيار unsanitized غير المتزامنة للحافظة API

عند النسخ واللصق باستخدام واجهة برمجة تطبيقات الحافظة غير المتزامنة، يسمح الخيار unsanitized لطريقة read() للتطبيقات والمواقع الإلكترونية بالحصول على ملف HTML لم يتم التحقق منه. ما لم تتضمّن المواقع هذه السمة، سيتم تصحيح قراءة HTML من الحافظة.

وفقًا للإعدادات التلقائية، عند قراءة أنواع MIME text/html باستخدام واجهة برمجة التطبيقات غير المتزامنة، يتم استدعاء برنامج المعقّم لإزالة المحتوى من ترميز HTML بسبب مشاكل تتعلّق بالأمان، ويتم تضمين الأنماط في ملف HTML الناتج. ويؤدي هذا إلى حِمل HTML كبير وفقدان دقة محتوى HTML عند قراءته من قِبل مطوّري الويب أو التطبيقات للأجهزة الجوّالة.

يمكنك مشاهدة الفرق في الإخراج في المثال التالي.

الإدخال:

<style>p { color: blue; }</style><p>Hello, World!</p>'

المصحَّح (الإعداد التلقائي):

<p style='color: blue; font-size: medium; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: normal; text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;'>Hello, World!</p>

باستخدام خيار "unsanitized":

<html><head><style>p { color: blue; }</style></head><body><p>Hello, World!</p></body></html>

انتقِل إلى مقالة إزالة حظر الوصول إلى الحافظة للتعرّف على أساسيات واجهة برمجة تطبيقات الحافظة.

ومقاييس أخرى

بالطبع هناك المزيد.

  • في CSS، لا تتطابق أبدًا طلبات بحث الحاوية التي تحتوي على ميزات غير متوافقة. على سبيل المثال، لن يتطابق الاستعلام التالي بسبب الميزة غير المعروفة:
@container (width > 0px) or (unknown) {}

  • لا تؤثر dataTransfer.clearData() في كائنات الملفات، بل تحذف كائنات أنواع النصوص فقط.

  • باستخدام drawingBufferStorage في WebGL، يمكنك تجنُّب تحميل نسخة إضافية عند تحويل العرض إلى التنسيق التلقائي لوحدات بكسل المخزن المؤقت للرسم ورسم محتوى بدقة تزيد عن 8 بت.

محتوى إضافي للقراءة

يتناول هذا الدليل بعض الميزات الرئيسية فقط. تحقَّق من الروابط التالية بحثًا عن تغييرات إضافية في Chrome 122.

اشتراك

للاطّلاع على آخر الأخبار، اشترِك في قناة Chrome Developers على YouTube، وستتلقّى إشعارًا عبر البريد الإلكتروني عندما ننشر فيديو جديدًا.

مرحبًا أدريانا جارا، وفور إطلاق Chrome 123، سأكون هنا لإخبارك بالجديد في Chrome.