☰

YouTube - Pause background videos

Pause videos playing in background tabs when a video starts

如何安裝

您需要先安裝使用者腳本管理器擴展，如 Tampermonkey、Greasemonkey 或 Violentmonkey 之後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能，如 Tampermonkey 或 Violentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能，如 Tampermonkey或 Violentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能，如 Tampermonkey或 Userscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展，比如 Tampermonkey，才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

（我已經安裝了使用者腳本管理器，讓我安裝！）

如何安裝

你需要先安裝一款使用者樣式管理器擴展，比如 Stylus，才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展，比如 Stylus，才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展，比如 Stylus，才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

（我已經安裝了使用者樣式管理器，讓我安裝！）

作者
Sue Smith MD
今日安裝
0
安裝總數
7
評價
1 0 0
版本
1.2.0
建立日期
2025-09-06
更新日期
2025-09-12
尺寸
2.8 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.