FirefoxのuserContent.cssでYouTubeを軽くする

Posted: 2026-05-20   |   Categories: ubuntu   |   Tags: css, firefox, ubuntu, youtube

FirefoxのuserContent.cssでYouTubeを軽くする

4GB RAM 級の古い PC や小型 tablet で YouTube を開くと、動画そのものより周辺 UI の重さが気になることがある。

広告、コメント、関連動画、Shorts、棚 UI、アニメーションなどを CSS で非表示にすると、JavaScript の実行自体は止められないが、描画負荷と見た目の密度は下げられる。

このメモでは、Stylus のような拡張機能ではなく Firefox 標準の userContent.css を使ってみた時のメモ。

方針

• JavaScript は使わない
• 外部 URL、@import、url(...) は使わない
• CSS は YouTube domain に限定する
• Firefox の policy で userContent.css を有効化する
• profile が snap 版と deb 版で分かれることを前提にする

CSS の外形は次のようになる。

@-moz-document domain("youtube.com") {
  ytd-rich-section-renderer,
  ytd-reel-shelf-renderer,
  ytd-rich-shelf-renderer[is-shorts],
  ytd-comments,
  #comments {
    display: none !important;
  }
}

実際には YouTube の DOM 変更に備え、Shorts 系、棚 UI、コメント、関連 UI を複数 selector で押さえる。

userContent.cssを使う理由

Stylus のような extension を使うと管理は楽だが、低メモリ端末では extension 自体も増やしたくないことがある。