🍭「DPlayer」- 炒鸡好看的 HTML5 弹幕播放器

[DlYgod]

Demo ： http://diygod.github.io/DPlayer/demo

GitHub ： https://github.com/DIYgod/DPlayer

UI 参考了 YouTube 和 @wsph123 的鲁迅追番

快来开启大弹幕时代，乾杯OωO~

---

没有女朋友的 520 可以做什么？

🔘支持一下 DPlayer ⚪自己伤心地吃狗粮

[Zohar]

支持:-)

[qiaobeier]

@DlYgod 试试把文本放到一个层上面，然后使用 CSS 移动这个层。尽量减少 Dom 操作。

[dphdjy]

@DlYgod

[DlYgod]

@qiaobeier OωO 就是这样的呀，动画用的 CSS 动画，有硬件加速过程中不会重绘

[DlYgod]

@dphdjy OωO 移动端还没适配

[typcn]

@DlYgod 前端是有点坑的。。。。 比较理想的是开 WebGL 手动 rasterize 字符存到 cache 里，然后 resize 和 color 直接用 shader 做，把部分活丢给显卡， CPU 的活只有文字的 rasterize ，然后每次移动清画布重绘缓存无需重新生成文字，这样性能就会非常好了，估计同屏上百也不会超过 10% 的占用（虽说目前似乎还没有任何实现，我主要是写 native 的。。不太会 Web ）

当然，就算用 JS 加 style 移动 DOM 也比 Flashit 快得多。。。反编译 Flashit 让人看不下去。。。

[qa52666]

非常棒！

[tSQghkfhTtQt9mtd]

@DlYgod 资辞，另外回复别加 OωO 前缀，搞得我还以为你那个表情面板不支持。。

[nareix]

不错！但是弹幕实现文字用的 div + css transition ，这个 div 多了会卡的，文字加上阴影更卡。
typcn 的方法应该是最快的，但是略难写而且 webgl 目前坑多。
简单点的方法是用把文字缓存到 canvas 里然后在一个大的 canvas 里逐帧重绘。虽然没硬件加速不过 cpu 占用还是比 div + css transition 低不少。

[wsph123]

鲁迅追番播放器不是开源项目，也拒绝直接复制这种设计程度的「参考」。。。你 copy 我的设计作为自己的开源设计这也不是第一次了，能不能稍微注意些？

[wsph123]

鲁迅追番播放器不是开源项目，也拒绝直接复制设计这种程度的「参考」。。。你 copy 我的设计作为自己的开源项目这也不是第一次了，能不能稍微注意些？

改下错字 T_T

[msg7086]

打开鲁迅看了一眼，发现一大堆各组的字幕作品，窃以为站长也是一名版权自由主义者，希望弱化版权而将作品尽可能分享给更多的人。
然而看了上面的回帖，我顿时有点不太明白站长的立场了。

[wsph123]

@msg7086 鲁迅追番的播放器在解决性能问题后会作为开源项目维护，同时也欢迎借鉴和参考、但不欢迎复制。

[muyunyan]

这算是对鲁迅追番弹幕编辑框区域的像素级「参考」了，何况题主的开源遵循 MIT 协议允许「非自由软体」使用……假如这个项目被商业公司采用，对谁来说都是非常麻烦的一件事。
30L 从 @wsph123 的发言中已经获知这并不是一次授权的参考行为，不希望开源会成为侵权的借口。

嗯，不希望开源会成为侵权的借口。

[damao50]

英文不能打。 英文空格自动暂停！！！！！

[DlYgod]

@wsph123
@msg7086
@muyunyan 已经改了，真的很抱歉，以后会注意的

[msg7086]

@wsph123 参与开源项目的第一件事就是复制。
第二件事是按照自己希望的方式修改代码。
第三件事是将自己的修改开源回馈出来。
就是要注意一下协议的兼容性。

我给楼主出个设计好了，与其直接用一个大饼表示颜色，不如把弹幕方向也加入颜色图案，变成这样，就不是香酥鸡照抄了嘛。

[DlYgod]

@damao50 bug+1😂

[DlYgod]

@msg7086 赞赞赞，多谢啦~~~

[suikator]

@msg7086 666