as

Settings
Sign out
Notifications
Alexa
亚马逊应用商店
AWS
文档
Support
Contact Us
My Cases
新手入门
设计和开发
应用发布
参考
支持

网页应用工作线程最佳实践

网页应用工作线程最佳实践

工作线程是现代网页浏览器中的一项功能,它允许JavaScript独立于主浏览器线程在后台运行。有关更多信息,请参阅使用Web Workers

执行模型属于真正的并行性而非并发性,后者管理主线程上的异步操作。工作线程通过卸载工作来明确防止用户界面阻塞,而如果异步任务的计算量很大,则并发代码不会阻止用户界面阻塞。这样,如果使用得当,工作线程就会成为一个强大的工具。

并发与并行比较图

Blink是Chromium使用的渲染引擎。它使用线程池算法,旨在最大限度地提高网页应用的性能。它比固定式或缓存式更复杂,而且在小型工作线程的突发调用方面表现出色。Blink可平衡CPU核心之间的并行性和并发性,以最大限度地提高核心使用率。这意味着线程和资源,包括资源限制和沙箱,都由Chromium管理。网页应用的作用是根据任务类型、复杂性和可用系统资源来确定要创建的工作线程的适当数量。网页应用需要管理工作线程和主线程之间的通信。网页应用还必须通过使用批处理、确定优先级等策略来最大限度地减少通信开销,并限制一次发出的工作线程数量。

Vega WebView中的工作线程

Vega通常在资源不足的设备上运行,因此线程数量应限制为设备上的核心数量。JavaScript提供navigator.hardwareConcurrency来确定设备包含多少核心。最低水平的设备有4个核心,而我们的高端设备则包含更多核心。使用的算法是number_of_workers = (2 * number_of_cores) + 1。例如,如果一台设备有4个核心,则工作线程最多不能超过9个。在某些情况下,根据工作线程的行为,系统可以支持的核心数会低于或高于此值。工作线程生命周期有助于解释其中一些案例以及为什么资源超额订阅会出现问题。

工作线程的正常生命周期包括1) 主线程创建新工作线程,2) 发布消息,3) 工作线程处理消息,4) 它为主线程发送新消息,以及5) 之后由主线程处理返回的消息。与主线程的通信会影响主线程性能。这意味着,如果创建了许多小型工作线程并大约在同一时间完成,并且它们都将数据发送回主线程进行处理,则主线程将受到影响。即使同时处理响应,也是如此。以下是一些最大限度地提高工作线程性能的策略。

Vega的工作线程指南

  • 使用工作线程完成真正有益的任务,并注意哪些事件会触发这些任务。工作线程太多可能会让资源不足的设备崩溃,例如Fire TV Stick 4K Select。
  • 减少工作线程和主线程之间传递的数据量。
    • 使用可传输的对象来避免复制大量数据。

      已复制到剪贴板。

      // 使用可传输的对象来避免复制大量数据
      const data = new Uint8Array(1024 * 1024); // 1MB of data
      worker.postMessage(data, [data.buffer]); // 传输底层ArrayBuffer
      
  • 管理您的工作线程,知道何时不再需要它们。通过终止来移除不再需要的工作线程,以避免其运行完毕后涌入主线程。

    已复制到剪贴板。

    // 在不再需要工作线程时将其终止
    worker.terminate();
    
  • 尽可能重复使用工作线程或工作线程池,而不是生成新的工作线程。

    已复制到剪贴板。

    const worker = new Worker('worker.js');
    worker.postMessage('Hello from main thread');
      
    // ... 片刻之后 ...
      
    // 通过发布新任务来重复使用工作线程
    worker.postMessage('New task');
    
  • 使用缓存来减少重新计算。

    已复制到剪贴板。

    const cache = new Map<string, CachedData>(); // 使用映射进行高效的基于ID的查询
      
    self.onmessage = async (event: MessageEvent) => {
      const { type, payload } = event.data;
      const { id, forceRefresh } = payload;
      
      // 检查数据是否已经在缓存中
      if (cache.has(id) && !forceRefresh) {
        self.postMessage({ type: 'DATA_RESPONSE', payload: cache.get(id).data });
        return;
      }
      // ...
    
  • 知道在给定数量的核心上可以正常运行多少个工作线程。四核CPU可以很好地运行1-9个简单工作线程,若达到9-15个,会对用户界面产生一定的影响,而达到15-30个则会产生明显的影响,除此之外的任何工作都会遇到困难。
    • 您可以使用以下算法:
      • 永远安全:number_of_workers = navigator.hardwareConcurrency - 2
      • 基本安全:number_of_workers = (2 * navigator.hardwareConcurrency) + 1
    • 对于持续存在或任务繁重的工作线程,可以考虑同时运行2-4个工作线程。
    • 如果您有CPU密集型任务,请确保同时运行的工作程序数量不多,这可能会导致问题,或者手动管理处理以防止系统过载。
  • 确保您的标题已设置完毕,这样它们就不会重新下载相同的文件。一些库使用工作线程来缓存图像或其他内容,许多库使用预定义的策略范例。
    • 当图像不存在时,电视应用通常会触发工作线程进行导航,以预加载信息而提高流畅度。如果这些图像未被缓存,快速导航通常会导致工作线程大量涌入系统,从而导致卡顿或冻结。确保标题设置正确,以便正确缓存图像。
    • 几种缓存策略。这些库中有许多使用“仅缓存”、“缓存优先”、“仅限网络”、“网络优先”或“重新验证时过期”,以及其他选项,例如到期。

Last updated: 2025年10月7日