Web Workers：无口吃的 Youtube 视频的解决方案？答案

【问题标题】：Web Workers: A solution for stutter-free Youtube video?Web Workers：无口吃的 Youtube 视频的解决方案？
【发布时间】：2015-04-20 17:01:43
【问题描述】：

我目前已经完成了一个可以播放 Youtube 视频的网络应用程序。 Youtube HTML5 视频播放超级流畅（即使 CPU 处于 90+ 活动状态也没有明显的滞后或故障），而我的应用程序（使用 jQuery UI）接受表单输入或实现元素操作（用户或动态触发）。然而，当 Youtube 用 Flash 视频强行输入我的应用程序时，只要有表单输入、DOM 操作或光标在 UI 上快速移动，Flash 视频就会卡顿、咳嗽、打嗝并暂时停止（无论 CPU 级别如何。但音频还可以）直到 GUI 操作停止。

我的客户端 Web 应用是使用 Javascript 和 jQuery 2.10 构建的，并通过 Youtube 的 Data API v3 访问 Youtube 视频。

问题：无论 Youtube 当前通过其数据 API（版本3)?

问题：如果 Web Workers 不能帮助我，我可以通过什么明智的方式实施客户端（除了避免使用 Youtube Flash 视频）来解决这个困境？

任何明智的提示/解决方案将不胜感激。谢谢。

【问题讨论】：

这里需要注意几点：Web Workers 不能以任何方式与 DOM 交互，您可以通过消息传递信息，并在单独的线程中进行计算，但所有数据都必须通过消息传递与工人。因此，在这种情况下，Worker 将无法为您提供帮助。
我不确定网络工作者是否会对嵌入 Flash 视频有所帮助？
@WakeskaterX 那么通过 Web Workers 访问执行 UI 操作的 js 脚本是不可能的吗？在本地存储中缓存这些脚本怎么样？
@koolness 是的，全局作用域与窗口是分开的，所以你无法访问 web worker 中的 DOM。

标签： javascript jquery flash youtube web-worker

【解决方案1】：

Web Workers 在这里不会有太大帮助（用于处理与 UI 相关的任何事情）。

https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Using_web_workers

Web Worker 的全局范围与窗口是分开的，因此您无法从 Worker 内部访问 DOM。

您可能需要考虑为 Loading State 创建一个变量切换，并且仅在当前未加载时才允许 GUI 事件。否则，除了优化 JavaScript 之外，我不太确定您可以针对第二个问题做什么。

编辑：就在worker中加载视频而言，您可以通过发出XMLHttpRequest并获取数据，然后将数据以块的形式发送到主线程一次你缓冲一些。查看这篇文章了解更多信息：http://techslides.com/html5-web-workers-for-ajax-requests

【讨论】：

缓存这些 js 脚本并通过本地存储访问它们会有帮助吗？
对于您的主要脚本中的一般用途，您可以缓存和稍后引用的任何内容都会有所帮助。基本上，您可能只想尽可能优化您的脚本。
是的，我收集了链接内容。在“更多示例”部分，“Workers 主要用于允许您的代码在不阻塞用户界面线程的情况下执行处理器密集型计算”。但我的问题是我的用户界面线程完整性不是问题，而是相反（Flash 视频）哈哈。
但是您需要在浏览器中播放您的视频，对吧？您可能能够伸出手并开始在工作人员中流式传输数据......看起来工作人员可能能够发出 XMLHttpRequest 来获取数据，但是您必须在工作人员获得数据时联系工作人员数据并对其进行缓冲，以将来自 worker 的数据分块加载到 DOM 中。
是的。需要在 Youtube 的嵌入式 iFrame 播放器中播放。可以从 Worker 开始流式传输，但是如何通过本地存储（或类似）流式传输缓冲（缓存）的视频？