Web 音视频(一)基础知识

Web 音视频目录 阅读后续文章或开始使用 WebAV 处理音视频数据之前,需要一点点背景知识。 本篇主要简单介绍音视频最基础的知识,以及 WebCodecs 的核心 API。 视频结构 视频文件可以理解为容器包含了元数据和编码数据(压缩的音频或视频); 不同的容器格式有各种区别,比如用不同方式组织管理元数据和编码数据。 ![视频结 ...

Web 音视频(零)概览

Web 音视频目录 WebCodecs API 已经发布一段时间(chrome 94),在浏览器中处理音视频文件或实时视频流已经可行。 计划开一个系列介绍 Web 音视频基础知识,及如何在浏览器中处理视频文件(或视频流)。 作者也是音视频领域的新手,本系列文章也算是个人的学习总结,若发现错误内容可在评论区留言 _本系列适合有一定经验的前端 ...

JS 解析 SRT 字幕

SRT字幕格式介绍 copy 以下代码可在控制台测试效果 function srtTimeToSeconds (time) { const match = time.match(/(\d{2}):(\d{2}):(\d{2}),(\d{3})/) ...

WebGL Chromakey 实时绿幕抠图

20 行核心(shader)代码实现实时绿幕抠图 先体验 DEMO,基于 WebAV 实现 移除图片背景 移除视频背景 背景 因为视频相关标准及浏览器的实现问题,很难在主流浏览器中顺利播放背景透明的视频。 有两种方法可以为最通用的视频格式(MP4,H264)移除背景,实现透明效果: 原视频配上绿幕,使用本文介绍方法移 ...

DIY 游戏掌机

前言 对比分析了市场上的掌机,发现有些缺陷在当前是无解的。 所以想通过 mini主机 串流 手机 来扬长避短。 方案总结分析 优点 性能更强 自由度、可玩性更高 不受掌机平台限制 win主机游戏更多,也不限于只玩游戏 屏幕观感更舒服;分辨率、帧率、色彩吊打掌机 续航6小时以上(四年旧手机 无散热压力:零噪音,不烫手 - ...

JS 定时器时长控制细节

背景 JS 最常使用 setTimeout、setInterval 来延迟或定时循环执行函数,通常会传递第二个参数来控制延迟或间隔执行的时间。 但开发者必须意识到函数执行时间并非精确地符合预期,在以下场景中它会超出你的预期 CPU 繁忙(主线程被长时间占用),JS 无法按开发者设定的预期时间延迟函数 定时器过于频繁地执行(第二个参数 < 4),达到一定 ...