iT邦幫忙

鐵人檔案

2023 iThome 鐵人賽
回列表
Modern Web

網頁的另一個大腦:從基礎到進階掌握 Web Worker 技術 系列

Javascript 單執行緒模型使得程式的設計和邏輯相對簡單。開發者不需要擔心併發問題,避免了許多可能的錯誤。但隨著近年 AI、元宇宙、3d 技術的發展,需要利用 Javascript 大量運算的時候可能越來越多,這時就是擅長平行運算的 web worker 出場的時機了。希望藉由這一系列的文章介紹目前 web worker 的發展狀況,以及提出一些實例分析 web worker 適合用到的場景。

鐵人鍊成 | 共 30 篇文章 | 13 人訂閱 訂閱系列文 RSS系列文
DAY 21

Javascript 中的原子操作 - Atomic

昨天介紹了 SharedArrayBuffer,使用 SharedArrayBuffer 可以在不同的線程中共享記憶體,達到高效的運算功能,但隨之而來的缺點就是...

2023-10-05 ‧ 由 bcjohn 分享
DAY 22

在 Web worker 中處理音效 - AudioWorklet

什麼是 Worklet? 官方文件提到 Worklet 是輕量級的 web worker,使網路開發人員可以存取低階的渲染管道 Worklet 種類 MDN 上...

2023-10-06 ‧ 由 bcjohn 分享
DAY 23

瀏覽器中的消息傳遞 - postMessage

前幾天學習關於 Web worker 的知識時,我發現不同地方都會使用 postMessage 函式把訊息發送出去,但不同地方使用 postMessage 的方...

2023-10-07 ‧ 由 bcjohn 分享
DAY 24

將 Web worker 內嵌於 HTML 中 - Embedded worker

在 HTML 檔案中使用 Javascript 我們知道在 HTML 使用 Javascript 大致上有兩種方式 從另一個檔案引入 js (externa...

2023-10-08 ‧ 由 bcjohn 分享
DAY 25

使用 modulepreload 優先下載 module worker 檔案

使用 preload 優先下載資源 不知道大家有沒有使用過 preload,preload 用來明確告知瀏覽器,某一份資源是很重要的,所以請優先下載它,使用方式...

2023-10-09 ‧ 由 bcjohn 分享
DAY 26

小故事 - modulepreload 的來源

昨天介紹了使用 modulepreload 預先加載 module worker,可以較早取得重要的資源,用意跟 preload 是一樣的,但不知道有沒有人覺得...

2023-10-10 ‧ 由 bcjohn 分享
DAY 27

封裝 Web worker 的套件 - Comlink

今天與明天會介紹一些與 Web worker 相關的套件,今天介紹的 comlink 是 google 團隊開發的套件,目的是讓 Web worker 使用起來...

2023-10-11 ‧ 由 bcjohn 分享
DAY 28

使用多個 Web worker 進行平行運算 - workerpool

workerpool 是一個可以同時用在 node.js 跟 瀏覽器(web worker) 的套件,實作了 Thread pool 的概念,讓程式可以做到高效...

2023-10-12 ‧ 由 bcjohn 分享
DAY 29

在 Web worker 中使用 opencv.js

終於到了最後一個範例,在 第一天的文章 - 前言 提到最近工作上使用到 opencv.js,所以才有這 30 天的 web worker 系列文,有始有終,今天...

2023-10-13 ‧ 由 bcjohn 分享
DAY 30

Web worker 系列文 - 總結

一開始我們從最常使用的 web worker - Dedicated worker 開始,接著介紹使用 postMessage 在主線程與 worker 線程間...

2023-10-14 ‧ 由 bcjohn 分享