☰

YouTube Live Cpu Tamer

降低超级聊天的高CPU利用率。外观完全没有变化。

当前为 2020-03-09 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name        YouTube Live Cpu Tamer
  3. // @name:ja     YouTube Live Cpu Tamer
  4. // @name:zh-CN  YouTube Live Cpu Tamer
  5. // @description It reduces the high CPU usage on Super Chats with nothing to lose.
  6. // @description:ja スーパーチャットによる高いCPU使用率を削減します。見た目は何も変わりません。
  7. // @description:zh-CN 降低超级聊天的高CPU利用率。外观完全没有变化。
  8. // @namespace   knoa.jp
  9. // @include     https://www.youtube.com/live_chat*
  10. // @include     https://www.youtube.com/live_chat_replay*
  11. // @version     1.1.1
  12. // @grant       none
  13. // ==/UserScript==
  14.  
  15. /*
  16. [update] 1.1.1
  17. minor fix.
  18. */
  19. (function(){
  20.   const THROTTLE = 1000;
  21.   let site = {
  22.     get: {
  23.       items: () => document.querySelector('yt-live-chat-ticker-renderer #items'),
  24.       containers: (items) => items.querySelectorAll('#container'),
  25.       container: (node) => node.querySelector('#container'),
  26.     },
  27.   };
  28.   let core = {
  29.     initialize: function(){
  30.       let items = site.get.items();
  31.       if(items === null) return setTimeout(core.initialize, 1000);
  32.       let containers = site.get.containers(items);
  33.       Array.from(containers).forEach(container => {
  34.         core.observeContainer(container);
  35.       });
  36.       observe(items, function(records){
  37.         records.forEach(r => r.addedNodes.forEach(node => {
  38.           let container = site.get.container(node);
  39.           core.observeContainer(container);
  40.         }));
  41.       });
  42.       core.addStyle();
  43.     },
  44.     observeContainer: function(container){
  45.       container.parentNode.style.background = container.style.background;
  46.       let lastUpdated = Date.now();
  47.       observe(container, function(records){
  48.         let now = Date.now();
  49.         if(now - lastUpdated < THROTTLE) return;
  50.         lastUpdated = now;
  51.         container.parentNode.style.background = container.style.background;
  52.       }, {attributes: true, attributeFilter: ['style']});
  53.     },
  54.     addStyle: function(name = 'style'){
  55.       if(core.html[name] === undefined) return;
  56.       let style = createElement(core.html[name]());
  57.       document.head.appendChild(style);
  58.     },
  59.     html: {
  60.       style: () => `
  61.         <style type="text/css">
  62.           yt-live-chat-ticker-renderer #items > *{
  63.             border-radius: 999px;
  64.           }
  65.           yt-live-chat-ticker-renderer #items > * > #container{
  66.             background: none !important;
  67.           }
  68.         </style>
  69.       `,
  70.     },
  71.   };
  72.   const createElement = function(html = '<span></span>'){
  73.     let outer = document.createElement('div');
  74.     outer.innerHTML = html;
  75.     return outer.firstElementChild;
  76.   };
  77.   const observe = function(element, callback, options = {childList: true, attributes: false, characterData: false, subtree: false}){
  78.     let observer = new MutationObserver(callback.bind(element));
  79.     observer.observe(element, options);
  80.     return observer;
  81.   };
  82.   core.initialize();
  83. })();