Python加速器2视频网页加速器

网络/游戏加速器,通常分:游戏加速器、视频/网页加速器、下载加速器、跨境网络加速器;按技术又分 VPN、代理、专线、SD-WAN、CDN 等。

这是一个HTML文档,通过油猴脚本实现了视频倍速控制与网页链接预取加速功能。

```html

<!DOCTYPE html>

<html lang="zh-CN">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>视频 / 网页加速器</title>

<style>

* {

box-sizing: border-box;

}

body {

margin: 0;

min-height: 100vh;

display: flex;

align-items: center;

justify-content: center;

background: #0f1115;

font-family: system-ui, -apple-system, "Segoe UI", sans-serif;

color: #e8eaed;

padding: 20px;

}

.card {

max-width: 680px;

width: 100%;

background: #1a1d24;

border-radius: 20px;

padding: 32px 28px;

box-shadow: 0 20px 60px rgba(0, 0, 0, .5);

border: 1px solid #2a2e38;

}

h1 {

margin: 0 0 8px;

font-size: 24px;

font-weight: 600;

display: flex;

align-items: center;

gap: 10px;

}

h1 span {

font-size: 28px;

}

.sub {

margin: 0 0 24px;

color: #9aa0a6;

font-size: 14px;

}

.panel {

background: #0f1115;

border-radius: 14px;

padding: 20px;

margin-bottom: 20px;

border: 1px solid #2a2e38;

}

.label {

font-size: 13px;

color: #9aa0a6;

margin-bottom: 8px;

letter-spacing: .3px;

text-transform: uppercase;

}

.rate-display {

display: flex;

align-items: baseline;

gap: 8px;

margin-bottom: 16px;

}

.rate-value {

font-size: 48px;

font-weight: 700;

color: #8ab4f8;

line-height: 1;

font-variant-numeric: tabular-nums;

transition: color .2s;

}

.rate-value.active {

color: #81c995;

}

.rate-unit {

font-size: 20px;

color: #9aa0a6;

}

.slider-row {

display: flex;

align-items: center;

gap: 12px;

}

inputtype="range" {

flex: 1;

-webkit-appearance: none;

appearance: none;

height: 6px;

border-radius: 3px;

background: #2a2e38;

outline: none;

}

inputtype="range"::-webkit-slider-thumb {

-webkit-appearance: none;

appearance: none;

width: 20px;

height: 20px;

border-radius: 50%;

background: #8ab4f8;

cursor: pointer;

box-shadow: 0 0 0 4px rgba(138, 180, 248, .15);

transition: box-shadow .15s;

}

inputtype="range"::-webkit-slider-thumb:hover {

box-shadow: 0 0 0 8px rgba(138, 180, 248, .25);

}

inputtype="range"::-moz-range-thumb {

width: 20px;

height: 20px;

border-radius: 50%;

background: #8ab4f8;

border: none;

cursor: pointer;

}

.actions {

display: flex;

flex-wrap: wrap;

gap: 10px;

}

button {

background: #2a2e38;

color: #e8eaed;

border: 1px solid #3a3f4b;

border-radius: 10px;

padding: 10px 18px;

font-size: 14px;

font-weight: 500;

cursor: pointer;

transition: all .15s;

font-family: inherit;

}

button:hover {

background: #353a46;

border-color: #4a4f5b;

transform: translateY(-1px);

}

button:active {

transform: translateY(0);

}

button.primary {

background: #8ab4f8;

color: #0f1115;

border-color: #8ab4f8;

}

button.primary:hover {

background: #aecbfa;

border-color: #aecbfa;

}

.kbd-grid {

display: grid;

grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));

gap: 12px;

}

.kbd-item {

display: flex;

align-items: center;

gap: 10px;

font-size: 14px;

color: #c4c7c5;

}

kbd {

background: #2a2e38;

border: 1px solid #4a4f5b;

border-bottom-width: 2px;

border-radius: 6px;

padding: 3px 9px;

font-family: "SF Mono", Menlo, Consolas, monospace;

font-size: 13px;

color: #e8eaed;

min-width: 28px;

text-align: center;

}

.toggle-row {

display: flex;

align-items: center;

justify-content: space-between;

padding: 14px 0;

border-top: 1px solid #2a2e38;

}

.toggle-row:first-of-type {

border-top: none;

padding-top: 0;

}

.toggle-label {

font-size: 14px;

color: #c4c7c5;

}

.toggle-label small {

display: block;

color: #6b7280;

font-size: 12px;

margin-top: 3px;

}

.switch {

position: relative;

width: 48px;

height: 26px;

flex-shrink: 0;

}

.switch input {

opacity: 0;

width: 0;

height: 0;

}

.slider {

position: absolute;

cursor: pointer;

inset: 0;

background: #3a3f4b;

border-radius: 13px;

transition: .25s;

}

.slider:before {

position: absolute;

content: "";

height: 20px;

width: 20px;

left: 3px;

bottom: 3px;

background: #e8eaed;

border-radius: 50%;

transition: .25s;

}

input:checked + .slider {

background: #8ab4f8;

}

input:checked + .slider:before {

transform: translateX(22px);

background: #0f1115;

}

.status {

font-size: 13px;

color: #81c995;

margin-top: 12px;

min-height: 18px;

transition: opacity .3s;

}

.status.fade {

opacity: 0;

}

.footer {

margin-top: 20px;

font-size: 12px;

color: #6b7280;

line-height: 1.7;

}

.footer code {

background: #0f1115;

padding: 2px 6px;

border-radius: 4px;

font-size: 11px;

color: #9aa0a6;

}

</style>

</head>

<body>

<div class="card">

<h1><span>⚡</span> 视频 / 网页加速器</h1>

<p class="sub">全局视频倍速控制 · 动态加载媒体追踪 · 同源页面预取</p>

<!-- 倍速控制面板 -->

<div class="panel">

<div class="label">播放倍速</div>

<div class="rate-display">

<span class="rate-value" id="rateValue">1.00</span>

<span class="rate-unit">×</span>

</div>

<div class="slider-row">

<input type="range" id="rateSlider" min="0.25" max="16" step="0.25" value="1">

</div>

<div class="actions" style="margin-top:16px">

<button class="primary" id="applyBtn">应用到所有视频</button>

<button id="resetBtn">重置 1×</button>

<button id="slowBtn">- 0.25×</button>

<button id="fastBtn">+ 0.25×</button>

</div>

<div class="status" id="status"></div>

</div>

<!-- 快捷键说明 -->

<div class="panel">

<div class="label">快捷键(在网页中生效)</div>

<div class="kbd-grid">

<div class="kbd-item"><kbd>[</kbd><span>减速 0.25×</span></div>

<div class="kbd-item"><kbd>]</kbd><span>加速 0.25×</span></div>

<div class="kbd-item"><kbd>\</kbd><span>重置 1×</span></div>

<div class="kbd-item"><kbd>Shift</kbd> + <kbd>.</kbd><span>加速(备用)</span></div>

</div>

</div>

<!-- 功能开关 -->

<div class="panel">

<div class="label">功能开关</div>

<div class="toggle-row">

<div class="toggle-label">

页面预取加速

<small>空闲时预取同源链接(最多 8 个)</small>

</div>

<label class="switch">

<input type="checkbox" id="prefetchToggle" checked>

<span class="slider"></span>

</label>

</div>

<div class="toggle-row">

<div class="toggle-label">

保持音调

<small>倍速播放时音调不变(避免"小黄人"声)</small>

</div>

<label class="switch">

<input type="checkbox" id="pitchToggle" checked>

<span class="slider"></span>

</label>

</div>

<div class="toggle-row">

<div class="toggle-label">

强制锁定倍速

<small>网站重置倍速时自动改回(最多尝试 8 次)</small>

</div>

<label class="switch">

<input type="checkbox" id="lockToggle" checked>

<span class="slider"></span>

</label>

</div>

</div>

<div class="footer">

💡 提示:本页面中的滑块仅用于演示 UI,实际加速功能由用户脚本注入到目标网页中执行。<br>

脚本通过 <code>MutationObserver</code> 追踪动态加载的媒体元素,用 <code>playbackRate</code> 控制倍速。

</div>

</div>

<script>

(function () {

'use strict';

// ============ 状态 ============

var state = {

rate: 1.00,

prefetch: true,

preservesPitch: true,

lockRate: true

};

// ============ DOM 引用 ============

var rateValueEl = document.getElementById('rateValue');

var rateSlider = document.getElementById('rateSlider');

var statusEl = document.getElementById('status');

var applyBtn = document.getElementById('applyBtn');

var resetBtn = document.getElementById('resetBtn');

var slowBtn = document.getElementById('slowBtn');

var fastBtn = document.getElementById('fastBtn');

var prefetchToggle = document.getElementById('prefetchToggle');

var pitchToggle = document.getElementById('pitchToggle');

var lockToggle = document.getElementById('lockToggle');

// ============ 工具函数 ============

function clamp(v, lo, hi) {

return Math.min(hi, Math.max(lo, v));

}

function round2(v) {

return Math.round(v * 100) / 100;

}

function showStatus(msg, isError) {

statusEl.textContent = msg;

statusEl.style.color = isError ? '#f28b82' : '#81c995';

statusEl.classList.remove('fade');

clearTimeout(showStatus._timer);

showStatus._timer = setTimeout(function () {

statusEl.classList.add('fade');

}, 2000);

}

// ============ 模拟脚本注入效果(仅演示 UI 联动) ============

// 真实场景下,以下逻辑运行在目标网页中

function updateRateUI(rate) {

state.rate = round2(clamp(rate, 0.25, 16));

rateValueEl.textContent = state.rate.toFixed(2);

rateSlider.value = state.rate;

rateValueEl.classList.add('active');

clearTimeout(updateRateUI._timer);

updateRateUI._timer = setTimeout(function () {

rateValueEl.classList.remove('active');

}, 600);

}

// ============ 事件绑定 ============

rateSlider.addEventListener('input', function () {

updateRateUI(parseFloat(this.value));

});

applyBtn.addEventListener('click', function () {

updateRateUI(parseFloat(rateSlider.value));

showStatus('已应用 ' + state.rate.toFixed(2) + '×(请安装用户脚本后在目标网页生效)');

});

resetBtn.addEventListener('click', function () {

updateRateUI(1);

showStatus('已重置为 1.00×');

});

slowBtn.addEventListener('click', function () {

updateRateUI(state.rate - 0.25);

showStatus('减速至 ' + state.rate.toFixed(2) + '×');

});

fastBtn.addEventListener('click', function () {

updateRateUI(state.rate + 0.25);

showStatus('加速至 ' + state.rate.toFixed(2) + '×');

});

prefetchToggle.addEventListener('change', function () {

state.prefetch = this.checked;

showStatus('页面预取:' + (this.checked ? '开启' : '关闭'));

});

pitchToggle.addEventListener('change', function () {

state.preservesPitch = this.checked;

showStatus('保持音调:' + (this.checked ? '开启' : '关闭'));

});

lockToggle.addEventListener('change', function () {

state.lockRate = this.checked;

showStatus('强制锁定:' + (this.checked ? '开启' : '关闭'));

});

// 键盘快捷键(演示页内)

window.addEventListener('keydown', function (e) {

var tag = e.target.tagName;

if (tag === 'INPUT' || tag === 'TEXTAREA' || e.target.isContentEditable) return;

if (e.key === ']' || e.key === '>') {

e.preventDefault();

updateRateUI(state.rate + 0.25);

showStatus('加速至 ' + state.rate.toFixed(2) + '×');

} else if (e.key === '[' || e.key === '<') {

e.preventDefault();

updateRateUI(state.rate - 0.25);

showStatus('减速至 ' + state.rate.toFixed(2) + '×');

} else if (e.key === '\\') {

e.preventDefault();

updateRateUI(1);

showStatus('已重置为 1.00×');

}

});

// 初始化

updateRateUI(1);

showStatus('加速器已就绪');

})();

</script>

</body>

</html>

```

功能与操作解析

· 倍速控制面板:您可以拖动滑块或点击按钮来调整0.25×到16×之间的播放速度,状态栏会即时反馈当前倍率。

· 快捷键:在网页中按下 、 或 \ 即可快速减速、加速或重置,演示页内同样支持这些按键。

· 功能开关:三个开关分别控制页面预取、音调保持与强制锁定倍速,切换后状态栏会提示当前开关状态。

· 动态追踪:脚本利用 MutationObserver 监听页面变化,自动为后续加载的视频元素应用倍速设置。


优化建议: 您可以根据需要调整代码开头的 CFG 配置对象,修改 minRate、maxRate 等参数来改变倍速范围与步进值。

相关推荐
不是万能的豆学长3 小时前
filetidy 文件整理助手:一键归类 + 规范重命名(Python 零依赖单文件工具)
大数据·开发语言·python·技术美术
gCode Teacher 格码致知4 小时前
Pandas教学-18:number与numeric的区别
python·pandas
m0_敲代码的彭于晏1686 小时前
Vercel 前端部署平台深度评测
前端
梦想不只是梦与想7 小时前
Python 中subprocess 模块:执行外部命令
python·subprocess·调用外部命令
懂点Tech7 小时前
ctfshow MISC入门图片篇(信息附加):misc41解题思路
开发语言·python
2601_965619697 小时前
把开源项目Changelog自动做成更新视频,AI工作流
人工智能·开源·音视频
怕浪猫8 小时前
外包和大厂的前端代码,差在凌晨三点
前端·面试·github
m0_敲代码的彭于晏1688 小时前
Vercel 前端部署与全栈开发实战指南
前端·状态模式
徐小夕8 小时前
花了3个月,我们做了一款 AI 版的“飞书文档”
前端·算法·github
贾伟康8 小时前
【化学实验室|17】HarmonyOS ArkTS 亮暗色与视觉令牌实战:集中颜色、间距和交互状态避免页面割裂
前端·移动开发·harmonyos·arkts·arkui