الجديد في Chrome 80

يتم طرح Chrome 80 الآن، ويتضمّن العديد من الميزات الجديدة لمطوّري البرامج.

تتوفّر الميزات التالية:

اسمي بيتر ليب، لنطّلِع على التفاصيل ونتعرّف على الميزات الجديدة للمطوّرين في الإصدار Chrome 80.

عاملو الوحدة

يتوفّر الآن وضع Module Workers، وهو وضع جديد للعاملين على الويب، مع ميزات بيئة العمل والأداء التي توفّرها وحدات JavaScript. تقبل دالة إنشاء "العامل" خيار {type: "module"} جديدًا، الذي يغير طريقة تحميل النصوص البرمجية وتنفيذها، لمطابقة <script type="module">.

const worker = new Worker('worker.js', {
  type: 'module'
});

ويتيح الانتقال إلى وحدات JavaScript أيضًا استخدام الاستيراد الديناميكي لترميز التحميل الكسول، بدون حظر تنفيذ العامل. يمكنك الاطّلاع على مشاركة "جايسون" بعنوان Threading the web with بمكاتب الوحدات على web.dev للحصول على مزيد من التفاصيل.

التسلسل الاختياري

قد تكون محاولة قراءة الخصائص المتداخلة بشدة في أحد الكائنات عرضة للخطأ، خاصةً إذا كانت هناك احتمال بأن لا يتم تقييم شيء ما.

// Error prone-version, could throw.
const nameLength = db.user.name.length;

إنّ التحقّق من كل قيمة قبل المتابعة يؤدي بسهولة إلى عبارة if متداخلة بعمق، أو يتطلّب حظر try / catch.

// Less error-prone, but harder to read.
let nameLength;
if (db && db.user && db.user.name)
  nameLength = db.user.name.length;

يضيف Chrome 80 دعمًا لميزة جديدة من JavaScript تُدعى التسلسل الاختياري. باستخدام التسلسل الاختياري، إذا عرضت إحدى الخصائص قيمة فارغة أو غير محددة، بدلاً من طرح خطأ، فإن الأمر برمته يُرجع قيمة غير محددة.

// Still checks for errors and is much more readable.
const nameLength = db?.user?.name?.length;

يمكنك الاطّلاع على مشاركة المدونة السلسلة الاختيارية على المدونة الإصدار 8 لمعرفة جميع التفاصيل.

إكمال مرحلة التجربة والتقييم

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

المزامنة الدورية في الخلفية

أولاً، هناك مزامنة دورية في الخلفية، تعمل على مزامنة البيانات بشكل دوري في الخلفية، بحيث عندما يفتح المستخدم تطبيق الويب التقدّمي (PWA) المثبَّت، يحصل دائمًا على أحدث البيانات.

منتقي جهات الاتصال

بعد ذلك، هناك واجهة برمجة تطبيقات Contact Picker، وهي واجهة برمجة تطبيقات عند الطلب تتيح للمستخدمين اختيار إدخالات من قائمة جهات الاتصال الخاصة بهم ومشاركة تفاصيل محدودة حول الإدخالات المحددة مع موقع إلكتروني.

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

وأخيرًا، تتيح طريقة تثبيت التطبيقات ذات الصلة لتطبيق الويب التحقق مما إذا كان تطبيقك الأصلي مثبّتًا على جهاز المستخدم.

إذا لم يكن تطبيقك الأصلي مثبّتًا، من أكثر حالات الاستخدام شيوعًا تحديد ما إذا كنت تريد الترويج لتثبيت تطبيق الويب التقدّمي (PWA) الخاص بك. أو قد ترغب في إيقاف بعض وظائف أحد التطبيقات إذا تم توفيره من خلال التطبيق الآخر.

تجارب مصادر جديدة

واجهة برمجة تطبيقات فهرسة المحتوى

كيف تُعلِم المستخدمين بالمحتوى الذي خزّنته مؤقتًا في تطبيق الويب التقدّمي (PWA)؟ هناك مشكلة اكتشاف هنا. هل سيعرفون كيفية فتح تطبيقك؟ أو ما المحتوى المتاح؟

إنّ Content Indexing API هو إصدار تجريبي جديد يتيح لك إضافة عناوين URL وبيانات وصفية لمحتوى يمكن استخدامه بلا اتصال بالإنترنت إلى فهرس محلي يحفظه المتصفّح ويمكن للمستخدمين الاطّلاع عليه بسهولة.

const registration = await navigator.serviceWorker.ready;
await registration.index.add({
  id: 'article-123',
  launchUrl: '/articles/123',
  title: 'Article title',
  description: 'Amazing article about things!',
  icons: [{
    src: '/img/article-123.png',
    sizes: '64x64',
    type: 'image/png',
  }],
});

لإضافة محتوى إلى الفهرس، أحتاج إلى الحصول على تسجيل مشغّل الخدمات، ثم الاتصال بـ index.add وتقديم بيانات وصفية حول المحتوى.

بعد تعبئة الفهرس، يتم عرضه في منطقة مخصصة من Chrome لصفحة "عمليات التنزيل" على نظام التشغيل Android. يمكنك الاطّلاع على المشاركة التي نشرها جيف فهرسة الصفحات التي يمكن استخدامها بلا اتصال بالإنترنت باستخدام Content Indexing API على web.dev للحصول على تفاصيل كاملة.

مشغّلات الإشعارات

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

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

const swReg = await navigator.serviceWorker.getRegistration();
swReg.showNotification(title, {
  tag: tag,
  body: "This notification was scheduled 30 seconds ago",
  showTrigger: new TimestampTrigger(timestamp + 30 * 1000)
});

لتحديد موعد لإرسال إشعار، يُرجى الاتصال بالرقم showNotification عند تسجيل مشغّل الخدمات. في خيارات الإشعارات، أضِف السمة showTrigger مع TimestampTrigger. وعندما يحين الموعد، سيعرض المتصفح إشعارًا.

من المخطط أن يتم تنفيذ مرحلة التجربة والتقييم في Chrome 83، لذا يمكنك الاطّلاع على مشاركة عوامل تشغيل الإشعارات التي وضعها توم على web.dev للحصول على التفاصيل الكاملة.

تجارب المصدر الأخرى

تتوفّر بعض تجارب التجربة والتقييم الأخرى التي تبدأ في Chrome 80:

  • الرقم التسلسلي على الويب
  • إمكانية تسجيل تطبيقات الويب التقدّمية (PWA) كمعالجات للملفات
  • سمات جديدة لأداة اختيار جهات الاتصال

اطّلِع على القائمة الكاملة للميزات في مرحلة التجربة والتقييم.

والمزيد

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

  • يمكنك الآن الربط مباشرةً بأجزاء النص على إحدى الصفحات، باستخدام #:~:text=something. سينتقل Chrome إلى المثال الأول لجزء النص ويميزه. على سبيل المثال https://en.wikipedia.org/wiki/Rickrolling#:~:text=New%20York
  • يؤدي ضبط display: minimal-ui على تطبيق الويب التقدّمي (PWA) على أجهزة الكمبيوتر المكتبي إلى إضافة زر الرجوع وإعادة التحميل إلى شريط عناوين تطبيق الويب التقدّمي (PWA) المثبَّت.
  • ويدعم Chrome الآن استخدام صور SVG كرموز مفضّلة.

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

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

اشتراك

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

اسمي بيت ليب، وبعد طرح الإصدار 81 من Chrome، سأكون على أتمّ استعداد لإطلاعك على آخر الأخبار في متصفِّح Chrome.