TransformStream 現在跨瀏覽器支援

更新於 發佈於 閱讀時間約 3 分鐘

TransformStream is now supported cross-browser (web.dev)

raw-image

現在串流轉換在 Chrome, Safari 和 Firefox 都已支援, 他們終於準備好迎接黃金時代!

Streams API 讓你分解資源, 特別是你想要收發或轉換成小小的片段, 然後每 bit 去處理這些片段. Firefox 102 最近 開始支援TransformStream, 代表 TransformStream 現在終於可以跨瀏覽器使用. 串流轉換讓你從一個 ReadableStream 通到一個 WritableStream, 在片段上執行轉換, 或是直接消耗轉換後的結果, 如以下範例所示:

class UpperCaseTransformStream {
constructor() {
return new TransformStream({
transform(chunk, controller) {
controller.enqueue(chunk.toUpperCase());
},
});
}
}

button.addEventListener('click', async () => {
const response = await fetch('/script.js');
const readableStream = response.body
.pipeThrough(new TextDecoderStream())
.pipeThrough(new UpperCaseTransformStream());

const reader = readableStream.getReader();
pre.textContent = '';
while (true) {
const { done, value } = await reader.read();
if (done) {
break;
}
pre.textContent += value;
}
});
留言
avatar-img
留言分享你的想法!
avatar-img
Chaol Liu的沙龍
0會員
5內容數
Chaol Liu的沙龍的其他內容
2022/08/15
Typescript: It's not actually validating your types. - DEV Community 👩‍💻👨‍💻 有時他會讓你誤解: 我遇到一個相信 typescript 保證型別就是你說的那樣. 但我必須告訴你: Typescript 不是這樣做的.
Thumbnail
2022/08/15
Typescript: It's not actually validating your types. - DEV Community 👩‍💻👨‍💻 有時他會讓你誤解: 我遇到一個相信 typescript 保證型別就是你說的那樣. 但我必須告訴你: Typescript 不是這樣做的.
Thumbnail
2022/08/12
當你買一輛車或腳踏車, 你第一件事會先調整座位的位置和手把的高度到適合你的身體大小. 這就跟 git 配置是一樣的. 在這篇文章, 我會分享一些 git 的設定, 而且是我一直都在使用的.
Thumbnail
2022/08/12
當你買一輛車或腳踏車, 你第一件事會先調整座位的位置和手把的高度到適合你的身體大小. 這就跟 git 配置是一樣的. 在這篇文章, 我會分享一些 git 的設定, 而且是我一直都在使用的.
Thumbnail
2022/08/12
今天我們引入了 Build Output API, 一個檔案系統為基底的規格, 允許任何框架都可以讓 Vercel 建置, 並且取用了 Vercel 的優勢, 也就是 Vercel 的 infrastructure building blocks, 像是 Edge Functions, Edge M
Thumbnail
2022/08/12
今天我們引入了 Build Output API, 一個檔案系統為基底的規格, 允許任何框架都可以讓 Vercel 建置, 並且取用了 Vercel 的優勢, 也就是 Vercel 的 infrastructure building blocks, 像是 Edge Functions, Edge M
Thumbnail
看更多
你可能也想看
Thumbnail
TOMICA第一波推出吉伊卡哇聯名小車車的時候馬上就被搶購一空,一直很扼腕當時沒有趕緊入手。前陣子閒來無事逛蝦皮,突然發現幾家商場都又開始重新上架,價格也都回到正常水準,估計是官方又再補了一批貨,想都沒想就立刻下單! 同文也跟大家分享近期蝦皮購物紀錄、好用推薦、蝦皮分潤計畫的聯盟行銷!
Thumbnail
TOMICA第一波推出吉伊卡哇聯名小車車的時候馬上就被搶購一空,一直很扼腕當時沒有趕緊入手。前陣子閒來無事逛蝦皮,突然發現幾家商場都又開始重新上架,價格也都回到正常水準,估計是官方又再補了一批貨,想都沒想就立刻下單! 同文也跟大家分享近期蝦皮購物紀錄、好用推薦、蝦皮分潤計畫的聯盟行銷!
Thumbnail
每年4月、5月都是最多稅要繳的月份,當然大部份的人都是有機會繳到「綜合所得稅」,只是相當相當多人還不知道,原來繳給政府的稅!可以透過一些有活動的銀行信用卡或電子支付來繳,從繳費中賺一點點小確幸!就是賺個1%~2%大家也是很開心的,因為你們把沒回饋變成有回饋,就是用卡的最高境界 所得稅線上申報
Thumbnail
每年4月、5月都是最多稅要繳的月份,當然大部份的人都是有機會繳到「綜合所得稅」,只是相當相當多人還不知道,原來繳給政府的稅!可以透過一些有活動的銀行信用卡或電子支付來繳,從繳費中賺一點點小確幸!就是賺個1%~2%大家也是很開心的,因為你們把沒回饋變成有回饋,就是用卡的最高境界 所得稅線上申報
Thumbnail
PairDrop 免費、開源的網頁版檔案傳輸工具,無須註冊免安裝,將裝置連線同一個 WiFi 網路,打開網站會自動建立連線,點選裝置名稱即可開始傳送檔案,使用 WebRTC 技術進行傳輸,服務穩定且傳檔速度,各種系統置都能方便、安全地傳送檔案。
Thumbnail
PairDrop 免費、開源的網頁版檔案傳輸工具,無須註冊免安裝,將裝置連線同一個 WiFi 網路,打開網站會自動建立連線,點選裝置名稱即可開始傳送檔案,使用 WebRTC 技術進行傳輸,服務穩定且傳檔速度,各種系統置都能方便、安全地傳送檔案。
Thumbnail
TapSwap完完全全複製了NotCoin的操作模式,只要以手指快速輕輕點擊螢幕,就能獲取免費代幣。
Thumbnail
TapSwap完完全全複製了NotCoin的操作模式,只要以手指快速輕輕點擊螢幕,就能獲取免費代幣。
Thumbnail
Goingbus是一個集結了許多串流平臺的網站,提供的服務是這些串流平臺的共享,讓個人也可以輕鬆用超優惠的價格,訂閱串流平臺。他們提供的平臺都是經由正規管道途徑取得的,並且提供24小時客服服務。價格優惠非常多,可以讓使用者訂閱多種不同串流平臺,並且提供了退款服務。歡迎點擊連結加入串流共享的旅程!
Thumbnail
Goingbus是一個集結了許多串流平臺的網站,提供的服務是這些串流平臺的共享,讓個人也可以輕鬆用超優惠的價格,訂閱串流平臺。他們提供的平臺都是經由正規管道途徑取得的,並且提供24小時客服服務。價格優惠非常多,可以讓使用者訂閱多種不同串流平臺,並且提供了退款服務。歡迎點擊連結加入串流共享的旅程!
Thumbnail
疫情對觀影習慣帶來重大改變,串流平臺應運而生。但多平臺訂閱帶來負擔,GoingBus提供解決方案。以低價訂閱高品質串流服務,並擁有安全、便利、一站式管理等特點。加碼優惠代碼「yykk」9折優惠,讓你一勞永逸!
Thumbnail
疫情對觀影習慣帶來重大改變,串流平臺應運而生。但多平臺訂閱帶來負擔,GoingBus提供解決方案。以低價訂閱高品質串流服務,並擁有安全、便利、一站式管理等特點。加碼優惠代碼「yykk」9折優惠,讓你一勞永逸!
Thumbnail
▌促使韓國串流踩油門整併的不是 Netflix 的競爭壓力,而是串流泡沫化的危機 ▌ #葉郎每日讀報 20240226 一年多前韓國的 CJ 娛樂旗下的串流服務 Tving 以用戶數第三名的身份吃下排名第六的 Seezn,藉以一躍成為第二名。近日則傳出Tving 即將和目前排名第四的另一家本土
Thumbnail
▌促使韓國串流踩油門整併的不是 Netflix 的競爭壓力,而是串流泡沫化的危機 ▌ #葉郎每日讀報 20240226 一年多前韓國的 CJ 娛樂旗下的串流服務 Tving 以用戶數第三名的身份吃下排名第六的 Seezn,藉以一躍成為第二名。近日則傳出Tving 即將和目前排名第四的另一家本土
Thumbnail
▌分析師:串流大戰已經結束的三個證據 ▌ #葉郎每日讀報 20240108 從2023年底到才剛開始的2024年,短短幾個星期內已經有連續三家國際媒體的資深產業記者發出了訊號,試圖推論串流大戰已經結束,而 Netflix 已經贏得這場牽連無數人的娛樂媒體戰爭。 證物一:Netflix 的
Thumbnail
▌分析師:串流大戰已經結束的三個證據 ▌ #葉郎每日讀報 20240108 從2023年底到才剛開始的2024年,短短幾個星期內已經有連續三家國際媒體的資深產業記者發出了訊號,試圖推論串流大戰已經結束,而 Netflix 已經贏得這場牽連無數人的娛樂媒體戰爭。 證物一:Netflix 的
Thumbnail
這篇高含金量喜歡請收藏,如果願意請支持我繼續寫作鼓勵,太棒了🤟 線上影片下載 ★買噹噹Mydowndown 支援facebook(含私人), Youtube, Dailymotion, Twitter, Tumblr, Instagram, Vimeo, Vine, Xuite ★y2mate.c
Thumbnail
這篇高含金量喜歡請收藏,如果願意請支持我繼續寫作鼓勵,太棒了🤟 線上影片下載 ★買噹噹Mydowndown 支援facebook(含私人), Youtube, Dailymotion, Twitter, Tumblr, Instagram, Vimeo, Vine, Xuite ★y2mate.c
Thumbnail
Web3 知識產權的擁有!建議把「☆」擴充成正港的「瀏覽器」,減少一次跳轉。
Thumbnail
Web3 知識產權的擁有!建議把「☆」擴充成正港的「瀏覽器」,減少一次跳轉。
Thumbnail
TransformStream is now supported cross-browser (web.dev) 現在串流轉換在 Chrome, Safari 和 Firefox 都已支援, 他們終於準備好迎接黃金時代!
Thumbnail
TransformStream is now supported cross-browser (web.dev) 現在串流轉換在 Chrome, Safari 和 Firefox 都已支援, 他們終於準備好迎接黃金時代!
Thumbnail
來源:Stream high-quality real-time graphics through your browser with our new WebRTC framework 透過Unity先進的圖像串流技術,你可以不再受限於裝置的硬體效能,設計畫面更炫麗的遊戲了!
Thumbnail
來源:Stream high-quality real-time graphics through your browser with our new WebRTC framework 透過Unity先進的圖像串流技術,你可以不再受限於裝置的硬體效能,設計畫面更炫麗的遊戲了!
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News