Edge B站卡死


TL;DR: 装了 HEVC 视频扩展的锅,仅在 Edge 下出现问题。删掉扩展解决,或用下面的 UserScript 缓解。

B 站打开视频大约 5s 左右卡死,首页预览视频的时候也会较随机地卡死。开了 F12 的 Profiling ,看到大部分时间花在 canPlayType 上。

profiling

出问题的代码:

getBrowserCodecInfo = function() {
  var e = document.createElement("video")
    , t = {};
  return ['video/mp4; codecs="av01"', 'video/mp4; codecs="av01.0.10M.08"', 'video/mp4; codecs="av01.0.10M.10"', 'video/mp4; codecs="av01.0.10M.12"', 'video/mp4; codecs="av01.1.31M.08"', 'video/mp4; codecs="av01.2.31H.12"', 'video/mp4; codecs="hev1.1.6.L93.B0"', 'video/mp4; codecs="vp09.00.50.08"'].forEach((function(n, r) {
      try {
          var o = e.canPlayType(n), i = window.MediaSource && window.MediaSource.isTypeSupported(n);
          t[r] = "".concat(o, ";").concat(i)
      } catch (e) {}
  }
  )),
  t
}

修改跑一下发现是 e.canPlayType('video/mp4; codecs="hev1.1.6.L93.B0"') 的问题,且在其他浏览器里不复现,怀疑是 HEVC 视频编码软件包的问题,删掉果然就不卡了。

如果还需要这个软件包的话,可以做一下缓存当作缓解措施:

// ==UserScript==
// @name         Bilibili Edge HEVC fix
// @namespace    https://azuk.top/proj/edge-hevc-fix
// @version      2023-12-20
// @description  Fix edge hanging in HEVC detection
// @author       Azuk 443
// @match        *://*.bilibili.com/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=bilibili.com
// @run-at       document-start
// @grant        unsafeWindow
// ==/UserScript==

(function() {
    'use strict';
    const videoEl = document.createElement('video');
    videoEl.__proto__.canPlayType2 = videoEl.__proto__.canPlayType;
    videoEl.__proto__.canPlayType = function(x) {
        const result = unsafeWindow.localStorage.getItem('__bilifix_canPlay_'+x) || this.canPlayType2(x);
        unsafeWindow.localStorage.setItem('__bilifix_canPlay_'+x, result);
        return result;
    };
})();