最近好奇主流视频网站的播放器似乎不是我们习惯的video标签加上src属性上一个mp4的url，基本清一色的以blob:开头的一个纯前端的地址，鉴于此对前端的一些流媒体播放做了一些调研，写了这篇文章

实现这样的一个功能我们就需要引入`tensorflowjs`，使用官方训练好的`人体分割（Body Segmentation）`模型，在视频播放时将每一帧生成一直图片，放到弹幕的父元素上。

HLS（HTTP Live Streaming）是由 Apple 推出的一种基于 HTTP 的流媒体传输协议。它将音视频文件切片为多个小的 `.ts` 媒体文件，并通过 `.m3u8` 播放列表

用户在发帖等场景中上传视频，需要提取视频帧作为封面来暗示视频上传成功；本文采用HTML video + canvas的方法提取视频帧第0秒作为封面。

这篇文章通过 HLS 的方式介绍如何保护视频和插入视频广告。 有些视频是需要付费或者开通会员才能观看，那么怎么保护这些视频呢？

大家都说前端写页面较多，几乎用不到算法。本文愿从弹幕设计这个场景来描述算法在前端中的应用，我们先来看下实现效果： 开场之前我们先来描述弹幕开发的难度，再集中精力描述算法设计的思路。 如果弹幕采用相同的字号，碰撞的问题处理起来比较简单，只要考虑相邻弹幕的播放速度和偏移的位置就可以…

无任何第三方运行时依赖，兼容 IE11，支持 SSR。高度可定制，可二次开发。和 B 站一样体验的弹幕系统。可以接入任何流媒体。

HLS (HTTP Live Streaming) 是苹果公司开发的流媒体传输协议，它使用 HTTP 来传输视频，可以防止被防火墙屏蔽。DASH 一种自适应比特率流技术。

虽然 `video` 很强大，但是还有很多功能 `video` 并不支持，比如直播，即时切换视频清晰度，动态更新音频语言等功能。MSE（Media Source Extensions）就来解决这些问题