☰

YouTube - Pause background videos

Pause videos playing in background tabs when a video starts

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

如何安装

您需要先安装一个扩展，例如 篡改猴、Greasemonkey 或 暴力猴，之后才能安装此脚本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安装一个扩展，例如 篡改猴 或 暴力猴，之后才能安装此脚本。

您需要先安装一个扩展，例如 篡改猴 或 Userscripts ，之后才能安装此脚本。

您需要先安装一款用户脚本管理器扩展，例如 Tampermonkey，才能安装此脚本。

您需要先安装用户脚本管理器扩展后才能安装此脚本。

（我已经安装了用户脚本管理器，让我安装！）

如何安装

您需要先安装一款用户样式管理器扩展，比如 Stylus，才能安装此样式。

您需要先安装一款用户样式管理器扩展，比如 Stylus，才能安装此样式。

您需要先安装一款用户样式管理器扩展，比如 Stylus，才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

（我已经安装了用户样式管理器，让我安装！）

作者
Sue Smith MD
评分
0 0 0
版本
1.1.0
创建于
2025-09-06
更新于
2025-09-06
大小
2.0 KB
许可证
GPLv3
适用于

YouTube - Pause Background Videos

A userscript that pauses background YouTube videos when a video starts playing in the active tab.
This prevents multiple videos from playing simultaneously across tabs.

📖 Overview

  • Name: YouTube - Pause background videos
  • Namespace: anhkhoakz
  • Version: 1.1.0
  • Author: anhkhoakz
  • Description: Ensures that only the foreground tab continues playing a video by pausing any background videos.
  • Runs on: *://www.youtube.com/*
  • Execution time: document-start
  • Grants: none

⚙️ How It Works

The script leverages:

  1. MutationObserver – Waits for YouTube's dynamically loaded video elements.
  2. BroadcastChannel API – Efficient cross-tab communication.
    • When a video starts in the active tab, a pause message is broadcast to other tabs.
    • Background tabs receive the message and pause their videos if they’re playing.
  3. Video State Detection – Ensures accurate play state by checking:
    • video.currentTime > 0
    • !video.paused
    • !video.ended
    • video.readyState >= HAVE_ENOUGH_DATA
  4. YouTube SPA Handling – Detects navigation between videos using:
    • popstate, pushstate, replacestate events
    • Intercepted history.pushState / history.replaceState
    • Periodic setInterval fallback

🧩 Key Components

findElement(selector: string): Promise<Element>

Waits for a DOM element (YouTube video player) to appear before attaching listeners.

isVideoPlaying(video: HTMLVideoElement): boolean

Checks if a video is actively playing.

isTabInFocus(): boolean

Returns true if the current tab is active.

shouldPauseVideo(message: string, video: VideoWithIsPlaying): boolean

Determines if a background video should be paused when a pause message is received.

📡 Event Handling

  • Video Events
    • playing, loadeddata, canplay → Broadcast pause message when in focus.
  • Tab Visibility
    • visibilitychange → Sends pause when tab regains focus.
  • Navigation Detection
    • History API interception (pushState, replaceState)
    • Fallback setInterval check every second
    • Native events: popstate, pushstate, replacestate
  • Cross-tab Communication
    • Uses BroadcastChannel("video-channel")
    • Background tabs listen for pause messages and stop their video.

🚀 Installation

  1. Install a userscript manager:
  2. Create a new script and paste the code.
  3. Save and reload YouTube.

✅ Features

  • Ensures only one YouTube video plays at a time.
  • Works across multiple YouTube tabs.
  • Handles YouTube’s single-page app (SPA) navigation.
  • Lightweight and efficient using native browser APIs.

📝 Changelog

1.1.0

  • Added multiple navigation detection methods.
  • Improved handling of new video loads.
  • Bugfix: original version only listened to playing event.

1.0.0

  • Initial release.