الجديد في Chrome 107

Adriana Jara

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

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

الخصائص الجديدة في Screen Capture API

في هذا الإصدار، تضيف Screen Capture API خصائص جديدة لتحسين تجارب مشاركة الشاشة.

أضاف DisplayMediaStreamOptions السمة selfBrowserSurface. باستخدام هذا التلميح، يمكن للتطبيق إعلام المتصفّح بأنّه يجب استبعاد علامة التبويب الحالية عند استدعاء getDisplayMedia().

// Exclude the streaming tab
const options = {
  selfBrowserSurface: 'exclude',
};
const stream = await navigator
                    .mediaDevices
                    .getDisplayMedia(options);

ويساعد ذلك في منع التقاط صور ذاتية بدون قصد وتجنّب تأثير "قاعة المرايا" الذي رأيناه في مؤتمرات الفيديو.

أصبح لدى DisplayMediaStreamOptions الآن أيضًا السمة surfaceSwitching. يضيف هذا الموقع خيارًا للتحكّم آليًا في ما إذا كان Chrome يعرض زرًا لتبديل علامات التبويب أثناء مشاركة الشاشة. سيتم تمرير هذه الخيارات إلىgetDisplayMedia(). يتيح الزر Share this tab instead للمستخدمين التبديل إلى علامة تبويب جديدة بدون الرجوع إلى علامة تبويب اجتماع الفيديو أو الاختيار من قائمة طويلة من علامات التبويب، ولكن يتم عرض السلوك بشكل مشروط في حال عدم التعامل مع تطبيق الويب.

// Show the switch to this tab button
const options = {
  surfaceSwitching: 'include',
};
const stream = await navigator
                    .mediaDevices
                    .getDisplayMedia(options);

تضيف MediaTrackConstraintSet أيضًا السمة displaySurface. عند استدعاء getDisplayMedia()، يقدّم المتصفّح للمستخدم خيارات لسطح العرض: علامات تبويب أو نوافذ أو شاشات. باستخدام قيد displaySurface، يمكن الآن لتطبيق الويب أن يلمح إلى المتصفّح إذا كان يفضّل عرض أحد أنواع مساحات العرض بشكل أكثر بروزًا.

على سبيل المثال، يمكن أن يساعد ذلك في منع المشاركة المفرطة عن طريق الخطأ، لأنّ مشاركة علامة تبويب واحدة يمكن أن تكون الإعداد التلقائي. لقطات شاشة لطلبات أداة اختيار الوسائط القديمة والجديدة

تحديد الموارد التي تمنع عرض الإعلانات

إنّ الإحصاءات الموثوقة حول أداء الصفحة هي أمر بالغ الأهمية للمطوّرين من أجل توفير تجارب سريعة للمستخدمين، وقد اعتمد المطوّرون حتى الآن على أساليب استقرائية معقّدة لتحديد ما إذا كان المورد يعرقل العرض أم لا.

تشمل واجهة برمجة التطبيقات Performance API الآن السمة ReBlockStatus التي توفّر إشارة مباشرة من المتصفّح تحدّد الموارد التي تمنع صفحتك من الظهور إلى أن يتم تنزيلها.

يوضّح المقتطف البرمجي هنا كيفية الحصول على قائمة بجميع مواردك واستخدام السمة الجديدة renderBlockingStatus لعرض جميع الموارد التي تمنع العرض.

// Get all resources
const res = window.performance.getEntriesByType('resource');

// Filter to get only the blocking ones
const blocking =   res.filter(({renderBlockingStatus}) =>
      renderBlockingStatus === 'blocking');

يساعد تحسين طريقة تحميل الموارد في تحسين مؤشرات أداء الويب الأساسية وتقديم تجربة أفضل للمستخدمين. اطّلِع على مستندات MDN للتعرّف على مزيد من المعلومات حول Performance API، وابحث عن الموارد التي تمنع العرض وتحسينها.

مرحلة التجربة والتقييم لواجهة برمجة التطبيقات PendingBeacon API

تتيح واجهة برمجة تطبيقات PendingBeacon الوصفية للمتصفِّح التحكُّم في وقت إرسال الإشارات.

الإشارة هي حزمة من البيانات التي يتم إرسالها إلى خادم الخلفية بدون توقع استجابة معينة.

غالبًا ما تريد التطبيقات إرسال هذه الإشارات في نهاية زيارة المستخدم، ولكن لا يتوفّر وقت مناسب لإجراء طلب "الإرسال" هذا. تفوض واجهة برمجة التطبيقات هذه عملية الإرسال إلى المتصفّح نفسه، حتى تتمكّن من إتاحة إشارات المرور على page unload أو على page hide، بدون أن يحتاج المطوّر إلى تنفيذ طلبات الإرسال في الأوقات المناسبة تمامًا.

الاشتراك في مرحلة التجربة والتقييم، وتجربة واجهة برمجة التطبيقات، وإرسال ملاحظاتك وآرائك بهدف تحسين حالات الاستخدام

وغير ذلك

بالطبع، هناك الكثير من الميزات الأخرى.

  • تم إيقاف عنوان HTTP expect-ct نهائيًا.
  • أصبحت سمة rel متاحة الآن في عناصر <form>.
  • في المرة الأخيرة، ذكرتُ grid-template الاستقراء، وهذه المرة يجب تضمينه.

مراجع إضافية

لا يشمل ذلك سوى بعض النقاط الرئيسية. يمكنك الاطّلاع على الروابط أدناه للاطّلاع على التغييرات الإضافية في الإصدار 107 من Chrome.

اشتراك

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

اسمي أدريانا جارا، وفور طرح Chrome 108، سأكون على استعداد لإخبارك بالميزات الجديدة في Chrome.