Video.js 博客

马修·麦克卢尔2015-06-08

来了:5.0 发布候选版本!

今天我们发布了我们的第一个官方 5.0 发布候选版本。我们非常高兴能将其推向市场,但底层代码已发生很大变化。它在正常使用下应该很稳定,但我们拥有的测试设备(以及测试人员)数量有限,所以我们现在需要大家多多使用 5.0,并告诉我们有哪些问题!

您可以从 Github 获取 master 分支并运行 grunt 来创建您自己的构建,或者我们会将每个新的发布候选版本推送到 CDN。我们会快速推进,并在发现/修复错误时推送新的候选版本,所以请务必检查新版本!截至本帖子发布时,最新版本是 5.0-rc.2。如果您想查看演示,我们JSBin 上提供了一个。

有何不同?

全新基础主题

您加载发布候选版本时最明显的区别可能就是新的基础主题。我们将看到的是新的基础主题。我们一直努力简化主题,并使其尽可能地纯粹通过 CSS 实现。

screenshot

控制栏中有一些元素默认不显示,但只需覆盖少量 CSS 即可显示。例如,如果您默认不显示,但只需覆盖少量 CSS 即可显示。例如,如果您宁愿使用内联音量控制而不是弹出菜单,您可以进行以下更改:

css .video-js .vjs-volume-menu-button { display: none; } .video-js .vjs-mute-control, .video-js .vjs-volume-control { display: flex; }

这只是隐藏了 .vjs-volume-menu-button 控件,并取消隐藏了静音控制/内联音量控制。其他可用但默认隐藏的元素包括时间分隔符 (.vjs-time-devider)、总时长 (.vjs-duration) 和一个间隔器 (.vjs-custom-control-spacer)。

ES6

多亏了出色的 Babel 项目,我们能够编写 ES2015 代码并将其转译为 ES5。.这太棒了,意味着我们可以使用字符串插值等出色的功能,因此阅读我们的代码库 变得更棒了 ${_.sample(['更好', '更棒', '更精彩', '更简洁'])}

在我们的 Wiki 上,有一个页面专门介绍了我们 广泛使用的 ES6 特性。可能还有一些小细节没有提及,但如果您熟悉这些特性,阅读 Video.js 源代码应该会感到轻松自如。

我们也使用了 Browserify (带 Babelify 转换),所以现在我们能够利用 NPM 提供的所有浏览器包。这使我们能够改进的一个重要领域是实用函数,这些函数现在由 Lodash 提供。

插件

插件的初始化时间比以前更早,这让插件开发者对播放器体验有了更多的控制权。它们现在在其他组件(如控制栏)添加之前,但在播放器 div 创建之后初始化。请记住,您现在需要等待 ready 事件才能执行诸如向控制栏添加项目之类的操作。

插件开发世界也应该变得更加可预测,因为我们对代码的压缩程度有所降低。请记住,当您想在外部(不使用 ES2015)子类化一个组件时,您会想使用 videojs.extends

您可以在我们的 5.0 更改详情 Wiki 页面上找到更多信息。

想帮忙吗?

使用它!我们在开发过程中花费了数月时间以非常特定的方式使用这个播放器,但总是存在这个问题:“只见树木,不见森林”。如果您在测试播放器时发现问题,请在 问题追踪器 上告诉我们。