hughfenghen.github.io

hughfenghen.github.io copied to clipboard

[Post]WebCodecs 性能表现及优化思路

2

https://hughfenghen.github.io/posts/2024/07/27/webcodecs-performance-benchmark/

hughfenghen

https://hughfenghen.github.io/posts/2024/07/27/webcodecs-performance-benchmark/

hughfenghen

js 构造 H264 自定义 SEI 信息

1

**背景** Webcodecs支持了Web编码，加上开源的muxer（如mp4box.js）就能使用原生js封装视频文件了； 而在直播场景经常需要在视频流中插入自定义SEI，开放对视频流的操作能力是Webcodecs的动机之一（WebRTC~~做不到~~）； 以下是为了 _验证_ 自定义SEI确实可行，仅是学习笔记，若想在生产使用，需完成标注未完成的任务； **NALU 组成结构**  SEI 是一种特殊的 NALU **SEI 组成结构**  **代码实现** ```js function buildStrSEINALU (str) { const txtEncoder = new TextEncoder() let uuidStr = ''...

hughfenghen

WebAV 晋升为公司(bilibili)开源项目啦

2

WebAV 是我的个人开源项目，不知多少日夜，变更 10w+ 行代码，获得 650 star。 今天被正式收入 Github **bilibili** 组织，欢迎 star 与贡献。   **WebAV** 是基于 **WebCodecs** 封装，提供简易 API 在浏览器中处理音视频数据；可应用于**视频合成、剪辑、录制、播放**等场景。 WebAV 项目链接：https://github.com/bilibili/WebAV 还有丰富的可在线体验 demo：https://bilibili.github.io/WebAV/demo --- 此外，笔者还撰写了一系列文章收录在 **Web 音视频知识图谱**项目，方便初学者（特别是前端开发）入门音视频。 https://github.com/hughfenghen/WebAV-KnowledgeGraph ---...

hughfenghen

https://hughfenghen.github.io/posts/2024/05/11/webcodecs-codec-string-explain/

hughfenghen

[Post]自集成式 HTTP 代理方案

2

https://hughfenghen.github.io/posts/2024/05/08/ff-proxy/

hughfenghen

MacOS 手动备份用户目录

2

因一些奇怪的原因，需要格盘才能重装系统，所以需要备份大量文件。 但 cp 命令 copy 文件到另一台电脑或硬盘非常的缓慢。 前端专属命令。。。 `tar --exclude='*/node_modules/*' -zcvf .tgz ` 打包过程速度很快，copy 单个文件的速度也非常快。 另外，过滤 .pnpm, .cache, temp 等目录，还能更快。 tar 命令： https://www.runoob.com/linux/linux-comm-tar.html

hughfenghen

https://hughfenghen.github.io/posts/2024/03/06/opfs-tools-tweet/

hughfenghen

https://hughfenghen.github.io/posts/2024/03/06/opfs-tools-tweet/

hughfenghen

JS 拖动元素（move drag）

1

 其实是一个很简单、常见的功能，但 js 实现起来却要写很多行代码。 这里封一个函数，支持移动端、PC 端拖动，作为备份参考。 ```ts function moveEl (el: HTMLElement) { let elStartX = 0 let elStartY = 0 let touchStartX = 0 let touchStartY = 0 const onStart...

hughfenghen