mirror of
https://github.com/LCTT/TranslateProject.git
synced 2025-01-13 22:30:37 +08:00
Merge pull request #28719 from wxy/20221123.1-⭐️⭐️-Build-an-interactive-timeline-in-React-with-this-open-source-tool
RP:published/20221123.1 ⭐️⭐️ Build an interactive timeline in React with this open source tool.md
This commit is contained in:
commit
0c8170ee02
@ -3,13 +3,17 @@
|
||||
[#]: author: "Karol Kozer https://opensource.com/users/karolkozer"
|
||||
[#]: collector: "lkxed"
|
||||
[#]: translator: "geekpi"
|
||||
[#]: reviewer: " "
|
||||
[#]: publisher: " "
|
||||
[#]: url: " "
|
||||
[#]: reviewer: "wxy"
|
||||
[#]: publisher: "wxy"
|
||||
[#]: url: "https://linux.cn/article-15571-1.html"
|
||||
|
||||
用这个开源工具在 React 中建立一个互动的时间轴
|
||||
用这个开源工具在 React 中建立一个交互式时间轴
|
||||
======
|
||||
|
||||
![][0]
|
||||
|
||||
> Planby 是一个 JavaScript 组件,用于帮助创建流媒体服务、音乐和体育赛事等的时间表、时间线和电子节目指南(EPG)。
|
||||
|
||||
几年来,我在电视在线和视频点播(VOD)行业工作。在开发一个调度器网络应用时,我意识到在电子节目指南(EPG)和调度方面没有好的解决方案。诚然,对于大多数网络开发者来说,这是一个小众的功能,但对于电视应用来说,这是一个常见的需求。我看到并分析了许多网站实现了他们自己的 EPG 或时间表,我经常想,为什么每个人似乎都在发明他们自己的解决方案,而不是致力于开发一个大家都能使用的共享解决方案。这就是我开始开发 Planby 的时候。
|
||||
|
||||
[Planby][1] 是一个 React(JavaScript)组件,帮助你为在线电视和视频点播(VOD)服务、音乐和体育赛事等创建计划、时间线和电子节目指南(EPG)。Planby 使用自定义的虚拟视图,允许你对大量的数据进行操作,并以友好和有用的方式呈现给你的观众。
|
||||
@ -18,11 +22,11 @@ Planby 有一个简单的 API,你可以与第三方 UI 库集成。组件的
|
||||
|
||||
### 时间线性能
|
||||
|
||||
实现时间线功能时,最重要的是性能。你基本上可能会处理许多不同渠道的无穷无尽的数据流。应用可能难以刷新、移动和滚动。你希望用户与内容的互动是流畅的。
|
||||
实现时间线功能时,最重要的是性能。你有可能在许多不同频道处理无穷无尽的数据流。应用可能不断地在刷新、移动和滚动。你希望用户与内容的互动是流畅的。
|
||||
|
||||
还有一个潜在的问题是设计不当。有时,一个应用以列表的形式实现 EPG 时间线,你必须垂直滚动,这意味着你必须点击按钮在时间上左右移动,这很快就会变得很累。更重要的是,有时与 EPG 互动的自定义功能(如评级、选择你最喜欢的频道、从右到左(RTL)阅读等)根本无法使用,或者当它们可用时,会导致性能问题。
|
||||
还有一个潜在的问题是设计不当。有时,一个应用以列表的形式实现 EPG 时间线,你必须垂直滚动,这意味着你必须点击按钮在时间上左右移动,这很快就会变得很累。更重要的是,有时与 EPG 互动的自定义功能(如评级、选择你最喜欢的频道、从右到左(RTL)阅读等)根本无法使用,或者即便它们可用,也会导致性能问题。
|
||||
|
||||
我经常面临的另一个问题是,一个应用的数据传输过于冗长。当一个应用在你滚动浏览 EPG 的时候请求数据,时间线会感觉很慢,甚至会崩溃。
|
||||
我经常面临的另一个问题是,应用的数据传输过于冗长。当一个应用在你滚动浏览 EPG 的时候请求数据,时间线会感觉很慢,甚至会崩溃。
|
||||
|
||||
### 什么是 Planby?
|
||||
|
||||
@ -30,7 +34,7 @@ Planby 有一个简单的 API,你可以与第三方 UI 库集成。组件的
|
||||
|
||||
Planby 有一个简单的界面,包括所有必要的功能,如侧边栏、时间轴本身、愉快的布局和实时节目刷新。此外,还有一个可选的功能,允许你隐藏任何你不想包括在布局中的元素。
|
||||
|
||||
Planby 有一个简单的 API,允许你作为开发者实现你自己的项目以及用户的偏好。你可以使用 Planby 的主题来开发新的功能,也可以制作自定义的样式来配合你选择的设计。你可以很容易地整合其他功能,如日历、评级选项、用户最喜欢的列表、滚动、“now” 按钮、录制计划、追播内容等等。更重要的是,你可以添加自定义的全局样式,包括 RTL 功能。
|
||||
Planby 有一个简单的 API,允许你作为开发者实现你自己的项目以及用户的偏好。你可以使用 Planby 的主题来开发新的功能,也可以制作自定义的样式来配合你选择的设计。你可以很容易地整合其他功能,如日历、评级选项、用户最喜欢的列表、滚动、“现在” 按钮、录制计划、追播内容等等。更重要的是,你可以添加自定义的全局样式,包括 RTL 功能。
|
||||
|
||||
最重要的是,它在 MIT 许可下开源。
|
||||
|
||||
@ -45,10 +49,11 @@ via: https://opensource.com/article/22/11/react-timeline-planby
|
||||
作者:[Karol Kozer][a]
|
||||
选题:[lkxed][b]
|
||||
译者:[geekpi](https://github.com/geekpi)
|
||||
校对:[校对者ID](https://github.com/校对者ID)
|
||||
校对:[wxy](https://github.com/wxy)
|
||||
|
||||
本文由 [LCTT](https://github.com/LCTT/TranslateProject) 原创编译,[Linux中国](https://linux.cn/) 荣誉推出
|
||||
|
||||
[a]: https://opensource.com/users/karolkozer
|
||||
[b]: https://github.com/lkxed
|
||||
[1]: https://github.com/karolkozer/planby
|
||||
[0]: https://img.linux.net.cn/data/attachment/album/202302/24/092229kgr2rqm6326rgdbl.jpg
|
Loading…
Reference in New Issue
Block a user