تحديثات الوسائط في إصدار Chrome 63/64

François Beaufort
François Beaufort
GitHub

Media Capabilities - Decoding Info API

في الوقت الحالي، يعتمد مطوّرو الويب على isTypeSupported() أو canPlayType() لمعرفة ما إذا كان يمكن فك ترميز بعض الوسائط أم لا. لكن السؤال الحقيقي الذي يجب طرحه هو: "ما مدى جودة أدائه على هذا الجهاز؟"

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

في ما يلي ملخّص لطريقة عمل واجهة برمجة التطبيقات Decoding Info API في الوقت الحالي. يمكنك الاطّلاع على العيّنة الرسمية.

const mediaConfig = {
  type: 'media-source', // or 'file'
  audio: {
    contentType: 'audio/webm; codecs=opus',
    channels: '2', // audio channels used by the track
    bitrate: 132266, // number of bits used to encode a second of audio
    samplerate: 48000 // number of samples of audio carried per second
  },
  video: {
    contentType: 'video/webm; codecs="vp09.00.10.08"',
    width: 1920,
    height: 1080,
    bitrate: 2646242, // number of bits used to encode a second of video
    framerate: '25' // number of frames used in one second
  }
};

navigator.mediaCapabilities.decodingInfo(mediaConfig).then(result => {
  console.log('This configuration is' +
      (result.supported ? '' : ' NOT') + ' supported,' +
      (result.smooth ? '' : ' NOT') + ' smooth and' +
      (result.powerEfficient ? '' : ' NOT') + ' power efficient.');
});

يمكنك تجربة إعدادات وسائط مختلفة إلى أن تجد الإعداد الأفضل (smooth وpowerEfficient) واستخدامه لتشغيل بث الوسائط المناسب. بالمناسبة، يعتمد التنفيذ الحالي في Chrome على معلومات التشغيل التي تم تسجيلها سابقًا. يتم تحديد قيمة smooth على أنّها صحيحة عندما تكون نسبة اللقطات التي تم إسقاطها أقل من% 10، بينما يتم تحديد قيمة powerEfficient على أنّها صحيحة عندما يتم فك تشفير أكثر من% 50 من اللقطات بواسطة الجهاز. تُعدّ اللقطات الصغيرة دائمًا فعّالة من حيث استهلاك الطاقة.

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

function isMediaConfigSupported(mediaConfig) {

  const promise = new Promise((resolve, reject) => {
    if (!('mediaCapabilities' in navigator)) {
      return reject('MediaCapabilities API not available');
    }
    if (!('decodingInfo' in navigator.mediaCapabilities)) {
      return reject('Decoding Info not available');
    }
    return resolve(navigator.mediaCapabilities.decodingInfo(mediaConfig));
  });

  return promise.catch(_ => {
    let fallbackResult = {
      supported: false,
      smooth: false, // always false
      powerEfficient: false // always false
    };
    if ('video' in mediaConfig) {
      fallbackResult.supported = MediaSource.isTypeSupported(mediaConfig.video.contentType);
      if (!fallbackResult.supported) {
        return fallbackResult;
      }
    }
    if ('audio' in mediaConfig) {
      fallbackResult.supported = MediaSource.isTypeSupported(mediaConfig.audio.contentType);
    }
    return fallbackResult;
  });
}

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

للحصول على أكبر قدر ممكن من الملاحظات من المطوّرين الذين يستخدمون واجهة برمجة التطبيقات Decoding Info (وهي جزء من Media Capabilities) في المجال، أضفنا هذه الميزة سابقًا في Chrome 64 كإصدار تجريبي.

انتهت الفترة التجريبية بنجاح في أبريل 2018.

Intent to Experiment | Intent to Ship | Chromestatus Tracker | Chromium Bug

تشغيل فيديوهات HDR على Windows 10

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

مقارنة بين النطاق العادي الديناميكية المحاكى والنطاق العالي الديناميكية (يتطلّب عرض النطاق العالي الديناميكية شاشة متوافقة معه)
مقارنة بين النطاق الديناميكي العادي والنطاق العالي الديناميكية (يتطلّب عرض النطاق العالي الديناميكية شاشة متوافقة)

بما أنّ Chrome يتيح الآن تشغيل فيديوهات VP9 Profile 2 10-bit على نظام التشغيل Windows 10 Fall Creator Update، يتيح Chrome أيضًا تشغيل فيديوهات HDR عندما يكون نظام التشغيل Windows 10 في وضع HDR. من الناحية الفنية، يتوافق الإصدار 64 من Chrome الآن مع ملف تعريف الألوان scRGB، ما يتيح تشغيل الوسائط باستخدام تقنية HDR.

يمكنك تجربة هذه الميزة من خلال مشاهدة The World in HDR in 4K (ULTRA HD)‎ على YouTube والتأكّد من تشغيل الفيديو بنطاق عالي الديناميكية من خلال التحقّق من إعدادات جودة مشغّل YouTube.

إعداد جودة مشغّل YouTube الذي يتضمّن HDR
إعداد جودة مشغّل YouTube الذي يتضمّن النطاق العالي الديناميكية

كل ما تحتاج إليه الآن هو الإصدار Fall Creator Update من نظام التشغيل Windows 10، وبطاقة رسومات وشاشة متوافقتان مع النطاق العالي الديناميكية (HDR) (مثل بطاقة NVIDIA من السلسلة 10 أو تلفزيون أو شاشة LG HDR)، وتفعيل وضع النطاق العالي الديناميكية (HDR) في إعدادات العرض في Windows.

يمكن لمطوّري الويب رصد نطاق الألوان التقريبي الذي يتيحه جهاز الإخراج باستخدام طلب البحث عن الوسائط color-gamut الأخير وعدد البتات المستخدَمة لعرض لون على الشاشة باستخدام screen.colorDepth. في ما يلي إحدى طرق استخدامها لمعرفة ما إذا كان VP9 HDR متوافقًا مثلاً:

// Detect if display is in HDR mode and if browser supports VP9 HDR.
function canPlayVp9Hdr() {

  // TODO: Adjust VP9 codec string based on your video encoding properties.
  return (window.matchMedia('(color-gamut: p3)').matches &&
      screen.colorDepth >= 48 &&
      MediaSource.isTypeSupported('video/webm; codecs="vp09.02.10.10.01.09.16.09.01"'))
}

يجب تعديل سلسلة برنامج الترميز VP9 مع Profile 2 التي تم تمريرها إلى isTypeSupported() في المثال أعلاه استنادًا إلى خصائص ترميز الفيديو.

يُرجى العِلم أنّه لا يمكن حتى الآن تحديد ألوان النطاق العالي الديناميكية في صفحات الأنماط المتتالية (CSS) وcanvas والصور والمحتوى المحمي. يعمل فريق Chrome على حلّ هذه المشكلة. يُرجى متابعة أخبارنا باستمرار.

تراخيص دائمة لنظامَي التشغيل Windows وMac

تشير رخصة الاستخدام الدائمة في إضافات الوسائط المشفرة (EME) إلى إمكانية تخزين رخصة الاستخدام على الجهاز، ما يتيح للتطبيقات تحميلها في الذاكرة بدون إرسال طلب آخر إلى الخادم. في ما يلي كيفية إتاحة التشغيل بلا إنترنت في EME.

حتى الآن، كان نظاما التشغيل ChromeOS وAndroid هما النظامان الأساسيان الوحيدان اللذان يتيحان استخدام التراخيص الدائمة. لم يعُد هذا صحيحًا. أصبح بإمكانك الآن تشغيل المحتوى المحمي من خلال EME عندما يكون الجهاز غير متصل بالإنترنت في الإصدار 64 من Chrome على أجهزة Windows وMac أيضًا.

const config = [{
  sessionTypes: ['persistent-license'],
  videoCapabilities: [{
    contentType: 'video/webm; codecs="vp09.00.10.08"',
    robustness: 'SW_SECURE_DECODE' // Widevine L3
  }]
}];

navigator.requestMediaKeySystemAccess('com.widevine.alpha', config)
.then(access => {
  // User will be able to watch encrypted content while being offline when
  // license is stored locally on device and loaded later.
})
.catch(error => {
  // Persistent licenses are not supported on this platform yet.
});

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

  1. انتقِل إلى https://biograf-155113.appspot.com/ttt/episode-2/
  2. انقر على "إتاحة الفيديو بلا اتصال بالإنترنت" وانتظِر إلى أن يتم تنزيله.
  3. أوقِف اتصالك بالإنترنت.
  4. انقر على زر "تشغيل" واستمتع بالفيديو.

الإعدادات التلقائية للتحميل المُسبَق للوسائط هي "البيانات الوصفية"

تماشيًا مع عمليات التنفيذ في المتصفّحات الأخرى، يضبط متصفّح Chrome على أجهزة الكمبيوتر الآن القيمة التلقائية للتحميل المسبق للعنصرَين <video> و<audio> على "metadata" من أجل تقليل استخدام النطاق الترددي والموارد. بدءًا من الإصدار 64 من Chrome، لا ينطبق هذا السلوك الجديد إلا على الحالات التي لم يتم فيها ضبط قيمة التحميل المُسبَق. يُرجى العِلم أنّه يتم تجاهل تلميح سمة التحميل المُسبَق عند إرفاق MediaSource بعنصر الوسائط لأنّ الموقع الإلكتروني يتعامل مع التحميل المُسبَق بنفسه.

بعبارة أخرى، أصبحت قيمة التحميل المُسبَق <video> هي "metadata"، بينما تبقى قيمة التحميل المُسبَق <video preload="auto"> هي "auto". جرِّب العيّنة الرسمية.

Intent to Ship | Chromestatus Tracker | Chromium Bug

يؤدي ضبط قيمة غير صالحة للسمة playbackRate إلى حدوث استثناء

بعد تغيير في مواصفات HTML، عندما يتم ضبط playbackRate لعناصر الوسائط على قيمة غير متوافقة مع Chrome (مثل قيمة سالبة)، يتم عرض الخطأ "NotSupportedError" DOMException في الإصدار 63 من Chrome.

const audio = document.querySelector('audio');
try {
  audio.playbackRate = -1;
} catch(error) {
  console.log(error.message); // Failed to set the playbackRate property
}

بالمناسبة، يطرح التنفيذ الحالي في Chrome هذا الاستثناء عندما تكون قيمة playbackRate سالبة أو أقل من 0.0625 أو أكبر من 16. جرِّب العينة الرسمية للاطّلاع على كيفية عملها.

Intent to Ship | Chromestatus Tracker | Chromium Bug

تحسينات على مسار الفيديو في الخلفية

يسعى فريق Chrome دائمًا إلى إيجاد طرق جديدة لتحسين عمر البطارية، وقد تمكّن من تحقيق ذلك في الإصدار 63.

إذا لم يكن الفيديو يتضمّن أي مقاطع صوتية، سيتم إيقافه مؤقتًا تلقائيًا عند تشغيله في الخلفية (مثلاً، في علامة تبويب غير مرئية) على إصدار Chrome لأجهزة الكمبيوتر (Windows وMac وLinux وChromeOS). هذا التغيير هو متابعة لتغيير مماثل كان ينطبق فقط على فيديوهات MSE في الإصدار 62 من Chrome.

خطأ في Chromium

إزالة كتم الصوت عند استخدام سرعات تشغيل قصوى

قبل الإصدار 64 من Chrome، كان يتم كتم الصوت عندما تكون قيمة playbackRate أقل من 0.5 أو أكبر من 4، لأنّ الجودة كانت تنخفض بشكل كبير. بعد أن أصبح Chrome يستخدم طريقة Waveform-Similarity-Overlap-Add (WSOLA) لخفض الجودة، لم يعُد من الضروري كتم الصوت. وهذا يعني أنّه يمكنك الآن تشغيل الصوت بسرعة بطيئة جدًا أو بسرعة فائقة.

خطأ في Chromium