店小二登基:從 JavaScript 到 WebAssembly 的技術演義– 寫給企業主和 Vibe Coder

JavaScript 語法簡單卻混亂,技術界另建 WebAssembly ( Wasm ),AI 轉型老闆和 …

這是一場奇蹟可以繼續演下去的宮廷武俠故事,從 JavaScript 到 WebAssembly
這是一場奇蹟可以繼續演下去的宮廷武俠故事,從 JavaScript 到 WebAssembly

馬克吐溫說:「戒菸很容易,我已經戒了上千次了!」,web app 開發者說:「JS 很容易,我已經學了十幾次了!」,它語法簡單卻混亂,先天不足卻被迫繼承大統,全身打滿補丁!你難道不會想「全球技術界何等人才,焉能容得這語言獨霸飛速成長的 web 世界?」沒錯,所以 WebAssembly ( Wasm )來了,這可是有潛力一統江湖的明日之星。

身為 2025 年急於 AI 轉型的老闆,或是投入轉型的 vibe coders 一定要懂,但聽起來就很難!別擔心,我知道你們不想讀枯燥的文件,讓我娓娓道來,保證輕鬆暢意!

楔子:千秋萬代,始於十日

世人皆知,江山社稷,非一朝一夕可成。然而這網路世界的千秋霸業,竟真有人十日築基,笑煞天下英雄。

此文所記,乃是一位店小二如何黃袍加身、力不從心,又如何引來太子另立、風雲再起的傳奇。讀者若是技術中人,自可從中窺見門道;若是執掌商業大局者,亦能明白這場變革為何與你息息相關。

且聽我細細道來。


第一回:網景初開天下驚,彩色傳真動京城

【話說從頭】

上世紀九零年代,天下初定,一個名為「Web」的嬰孩呱呱墜地。

彼時有一霸主,喚作「網景領航員」(Netscape Navigator),一出世便席捲全球,萬民歸心。那時節,人人爭相傳頌:「這領航員真乃神器也!」

然而,明眼人看得出來——這神器其實就是個彩色傳真機

何出此言?只因這瀏覽器雖能顯示圖文並茂的頁面,卻是死的、靜的,你點它不動,你求它不應。無程式語言可用,無動態能力可言,就像一幅畫得再美的年畫,終究只能貼在牆上供人觀賞。

【技術白話】
早期的網頁就是純 HTML,只能展示靜態內容。想要表單驗證?想要互動效果?想要不刷新頁面就更新內容?——門都沒有。每一個動作都得回伺服器繞一圈,用戶體驗極差。

網景掌門人1看著這局面,眉頭深鎖:「若要這 Web 大業長久,網頁必須『活』起來!」

於是,一道急令傳下——


第二回:十日造語驚天下,布染臨危立奇功

【臨危受命】

掌門人馬安德急召艾布染入殿:「布染,我要你十日之內,造一門新語言出來!」就是「爪哇腳本」的由來

網景城中,有一西域色目人,姓艾名布染(Brendan Eich),平日裡默默無聞,不顯山不露水,你說他名布染可是染布工匠?不,他是個工程師!

這一日,掌門人急召艾布染入殿:「布染,我要你十日之內,造一門新語言出來!」

布染大驚:「十日?掌門人,這……程式語言乃是百年大計,豈可如此草率?」

掌門人擺手道:「不必那般複雜。僅需一簡單的語言,讓網頁動起來就好。不求它上天入地,只求它能跑能跳。簡單工作,用簡單語言,你就當是……給咱們請個店小二吧!」

艾布染銜命,閉關十日,焚膏繼晷。

第十日,城門大開,艾布染手捧一卷黃絹,上書四個大字——「爪哇腳本」(JavaScript)。

【技術白話】
JavaScript 誕生於 1995 年,由 Brendan Eich 在短短 10 天內設計完成。最初的定位非常簡單:在瀏覽器裡做一些輕量級的互動,比如表單驗證、簡單動畫。它被刻意設計得「易學易用」,語法借鑒了 Java(蹭熱度)、Scheme(函數式)和 Self(原型繼承),是個「混血兒」。

群臣議論紛紛:「十天?會不會太隨便了?」

掌門人不以為意:「無妨,無妨。店小二罷了,只是個端茶倒水的活兒,要何百年修為?能幹活就行!」下令「着令爪哇小二上線」!

誰知這一句話,竟成了日後最大的伏筆。


第三回:Web 大興金滿堂,店小二竟坐龍床

【風雲突變】

八大門派(Google、Microsoft、Apple、Mozilla、Opera……)齊聚議事廳,店小二瑟瑟發抖

世事難料,造化弄人。

那 Web 原只是江湖小門派,誰知短短數年間,竟大紅大紫,聲勢滔天!

天下資金如潮水般湧來,各路諸侯爭相把自家產業搬上瀏覽器。電子商務、社交網路、影音串流、線上辦公……凡你想得到的,都要往 Web 上搬。

這一搬,問題來了。

八大門派(Google、Microsoft、Apple、Mozilla、Opera……)齊聚議事廳,環顧四周,驚覺一個殘酷的事實——「這瀏覽器裡,能用的語言竟只有一個」。

那個十天趕工出來的店小二 JavaScript,此刻正瑟瑟發抖地站在大殿中央。

八大門派的目光,齊刷刷地望向它。

JavaScript 嚇得連連後退:「各位大俠饒命!我……我真不是這塊料啊!我就是個端盤子的,您們要我扛鼎?別逼我!」

【技術白話】
隨著 Web 應用越來越複雜,JavaScript 需要承擔的任務遠超當初設計。從簡單的表單驗證,到複雜的單頁應用(SPA)、3D 遊戲、視訊編輯、機器學習……這門「十天語言」被迫承擔起它從未被設計來承擔的重任。


第四回:黃袍加身非我願,諸葛整形救天子

【強推上位】

八大門派見狀,相視一笑。

「小二莫慌,」為首的 Google 大俠上前拍拍 JavaScript 的肩,「你弱,我們強。你只管坐穩這位子,其他的,靠我們!」

說罷,眾人一擁而上,將一件明黃龍袍披在 JavaScript 身上。

就這麼著,店小二黃袍加身,當了皇帝

既然被奉為正統,天下諸葛亮們便紛紛前來效力。你有缺陷?我來補!你有短板?我來填!

  • V8 引擎出山,將 JavaScript 的執行速度提升了數十倍
  • Node.js 橫空出世,讓 JavaScript 殺出瀏覽器,攻入伺服器領地
  • TypeScript 應運而生,給這位野路子皇帝套上了類型系統的禮服
  • 無數框架前仆後繼:jQuery、Angular、React、Vue……

經過幾百次整形手術,就算當初鼻歪眼斜,也被硬生生整成了帝王之相。

【技術白話】
JavaScript 生態系統的爆發式成長是技術史上的奇蹟。Google 的 V8 引擎用 JIT(即時編譯)技術讓 JS 速度暴增;Node.js 讓 JS 可以寫後端;TypeScript 加入靜態類型檢查;各種框架和工具鏈不斷完善……整個社群都在努力「修補」這門語言的先天不足。

然而,明眼人都看得出來——

JavaScript 出巡時虎虎生風,皮袍底下卻滿是刀傷。脫了金裝,它還是那個十天趕工的店小二。那些「整形手術」留下的疤痕,在深夜裡隱隱作痛。

它,終究是被時代推上了一個它扛不動的位子。


第五回:八派齊聚光明頂,密謀另立新太子

【暗流湧動】

八大門派何等眼光?

他們看著 JavaScript 光是應付眼前的任務就已經左支右絀,心中暗暗盤算:未來的艱鉅任務,它挺得住嗎?

  • 想跑 3A 級遊戲?它喘。
  • 想做視訊即時編碼?它抖。
  • 想執行機器學習模型?它直接躺平。

更要命的是——全世界最頂尖的技術人才,難道都要被綁死在這個十天寫出來的語言上?

  • C++ 的高手來了,得學 JavaScript。
  • Rust 的大神來了,得學 JavaScript。
  • Go 的專家來了,還是得學 JavaScript。

甭管你高手何來,嫺熟降龍十八掌、六脈神劍,還是吸星大法,只要來我 web 國,皆得下拜 JavaScript,這成何體統?

於是,在一個月黑風高的夜晚,八大門派密使齊聚光明頂(W3C 標準委員會)。

「JavaScript 這孩子,心是好的,也確實盡力了,」Google 的代表嘆了口氣,「但……」

「但它終究不是帝王之才,」Mozilla 的代表接話,「我們需要另立太子。」

眾人點頭。

「這新太子,必須根正苗紅,出身名門。」

「這新太子,必須允文允武,上馬能戰,下馬能治。」

「這新太子,絕不能再犯當年『十日造語』的急躁之錯!」

經過數年密議,終於—— WebAssembly,橫空出世。

【技術白話】
WebAssembly(簡稱 WASM)於 2015 年首次發布,2017 年獲得四大瀏覽器(Chrome、Firefox、Safari、Edge)的一致支持。它的設計目標非常明確:成為 Web 平台上的「第二語言」,為需要高效能的場景提供解決方案,同時允許開發者使用 C/C++、Rust、Go 等語言開發 Web 應用。


第六回:新太子出身不凡,允文允武震朝綱

【太子亮相】

新太子 WebAssembly 果然不同凡響

這新太子 WebAssembly,果然不同凡響。

第一,家學淵源。

它的設計者們記取了當年的教訓,不敢有絲毫懈怠。從提出概念到正式發布,歷時數年,反覆推敲,廣納百川。這可不是什麼「十日速成」,而是深謀遠慮的曠世之作

第二,根基深厚。

WASM 是什麼?它是組合語言(Assembly),是人類肉眼看不懂、但電腦硬體直接認得的二進位碼。

之前 JavaScript 的問題在哪?它是高階語言,寫起來方便,但電腦要執行它,得先翻譯、再優化、再執行,繞了好大一圈。而且 JavaScript 語法太過靈活(說難聽點叫「放飛自我」),翻譯官們(引擎們)為了猜測程式設計師的意圖,累得半死。

WASM 不一樣。它直接面對 CPU,少了那些彎彎繞繞,速度自然快如閃電。

【技術白話】
JavaScript 是解釋型語言,需要 JIT 編譯器在運行時進行優化。而 WASM 是預編譯的二進位格式,載入後幾乎可以直接執行,省去了解析和編譯的開銷。在計算密集型任務上,WASM 的效能可以接近原生程式碼(native code)。

第三,海納百川。

這才是最厲害的地方——

之前,不管你用什麼語言開發,最後都得轉成 JavaScript 才能在瀏覽器裡跑。JavaScript 就是那個瓶頸,就是那塊短板。天下英雄,皆受其制。

WASM 打破了這個枷鎖。

只要你的語言能編譯成 WASM,你就能在瀏覽器裡跑!

  • C/C++ 可以
  • Rust 可以
  • Go 可以
  • AssemblyScriptZigSwift……通通可以!

這意味著什麼?意味著全世界的頂尖人才,終於可以用自己最擅長的語言來開發 Web 應用了

三十年來被 JavaScript 壟斷的局面,一朝打破。

【技術白話】
WASM 是一個編譯目標(compilation target),而非一門需要手寫的語言。開發者用熟悉的語言(如 Rust、C++)編寫程式碼,然後編譯成 WASM 格式,就能在瀏覽器中高效執行。這讓 Web 開發不再被 JavaScript 綁架。


第七回:舊主封公仍當差,各司其職保太平

【新舊交替】

讀到此處,諸位看官或許要問:那 JavaScript 怎麼辦?被廢為庶人了嗎?

非也,非也。

JavaScript 原本就是個店小二出身,這個本職工作它還是做得不錯的。那些操作網頁元素(DOM)、處理用戶事件、跟伺服器打交道的活,它幹得熟門熟路,換誰來都未必有它順手。

於是,新太子登基之日,特下一旨:

「封 JavaScript 為『御前帶刀小二加封輔國公』,繼續掌管 DOM 操作、事件處理、API 調用諸般事宜。至於那些需要高效能運算、開疆拓土、苦民所不能苦的艱鉅任務,就交給本宮來承擔吧!」

JavaScript 聞言,長舒一口氣,連忙謝恩。

它心裡明白:這些年頂著皇冠,壓力山大,現在終於可以回歸本職了。當店小二,它是專業的。

【技術白話】
在現代 Web 應用中,JavaScript 和 WASM 通常協同工作。JavaScript 負責:

  • DOM 操作與渲染
  • 事件監聽與處理
  • 網路請求(fetch、WebSocket)
  • 與瀏覽器 API 互動

WASM 負責:

  • 計算密集型任務(影像處理、加密解密、物理模擬)
  • 需要高效能的核心邏輯
  • 移植現有的 C/C++/Rust 程式庫

兩者透過 JavaScript 呼叫 WASM 模組的方式配合,各司其職。


第九回:太子困如籠中鳥,欲出宮牆無門道

【龍困淺灘】

話說新太子 WASM 在瀏覽器中大展拳腳,算得快、跑得穩,朝野上下無不稱讚。

然而,太子心中卻有一塊積鬱,不足為外人道也。

這日深夜,太子獨立窗前,望著宮牆外的萬家燈火,長嘆一聲。

貼身太監小心問道:「殿下何故嘆息?您如今風頭正健,滿朝文武哪個不服?」

太子搖頭:「你不懂。這瀏覽器雖大,終究是個籠子。我想讀個檔案——不許。我想開個網路——不許。我想問問現在幾點鐘——還是不許!」

太子一拳砸在窗框上:「我堂堂太子,竟連這宮門都出不去,算什麼一統天下?」

【技術白話】 瀏覽器裡的 WASM 運行在嚴格的沙箱中,無法存取檔案系統、網路、系統時間等資源。這是安全設計,但也限制了 WASM 走出瀏覽器的可能。

消息傳到八大門派耳中,眾人又聚光明頂。

「太子說得對,」Mozilla 的長老捋著鬍子,「咱們費這麼大勁培養他,總不能讓他一輩子困在瀏覽器裡當宅男吧?」

「得給他配一把鑰匙,」Google 的代表說,「一把能開系統大門的鑰匙,但也不能讓他為所欲為。」封疆大吏終究不放心。

眾人商議三日三夜,終於拿出一套方案——

WASI,WebAssembly System Interface,系統介面欽差。

這欽差的規矩很簡單:太子想讀檔案?可以,但得先拿到「檔案通行令牌」。想開網路?行,但得有「網路許可令牌」。沒令牌?那就乖乖待著。

如此一來,太子既能出宮辦事,又不至於闖禍。進退有據,收放自如。

太子接過這把鑰匙,喜不自勝:「有此神器,天下何處去不得?」

當夜,太子便換了便裝,悄悄出了宮門。

【技術白話】 WASI 採用「能力導向安全模型」(capability-based security):程式只能存取明確授權的資源。這讓 WASM 可以安全地運行在瀏覽器之外——伺服器、邊緣設備、IoT,處處皆可。


第十回:諸侯割據言語異,太子修書萬國通

【巴別塔困局】

太子出得宮來,放眼天下,豪情萬丈,策馬遊四境。

然而走了沒幾步,就碰上一件頭痛事。

話說天下諸侯,各據一方,講的語言五花八門。魯國說 Rust 語,虢國說 Go 語,熙加加(C++)老帝國更是方言無數。太子想讓他們合作?門都沒有,雞同鴨講,誰也聽不懂誰。

這日,太子召見魯國將軍和虢國丞相,想讓他們聯手打造一套系統。

魯將軍拱手道:「末將的兵馬,講究所有權、生命週期,令行禁止,絕不容半點差池。」

虢國丞相捻鬚笑道:「老夫的部下,走的是垃圾回收、協程輕量那一套,輕裝上陣,靈活機動。」

兩人對視一眼,同時搖頭:「道不同,不相為謀啊。」一時間劍拔弩張。

太子氣得差點掀桌:「本宮要你們合作,何要吵架!」

【技術白話】 不同程式語言有不同的記憶體模型、呼叫慣例、資料表示方式。讓 Rust 模組直接呼叫 Go 模組?在傳統架構下幾乎是噩夢——得寫大量膠水程式碼,還容易出錯。

八大門派見狀,又開始頭痛。

「這樣不行,」蘋果的長老說,「太子想一統天下,總不能每收服一國就學一門語言吧?」

「得造一套通用官話,」微軟的代表提議,「不管你母語是什麼,朝堂之上,都說官話。」

於是,一項浩大的工程啟動了——

WALI,WebAssembly Language Interface,萬國通用語。

這套官話的規矩是這樣的:每個諸侯國把自己的本事寫成「國書」(叫做 WIT,介面描述),載明「我能做什麼、需要什麼、回報什麼」。只要國書格式統一,太子就能調度自如。

Rust 國的加密術、Go 國的網路功、Python 國的資料煉丹術……通通可以像積木一樣拼在一起,組成無敵艦隊。

太子看著藍圖,龍顏大悅:「如此一來,天下英雄盡可為我所用,何愁大業不成?」

【技術白話】 WALI(前身為 Component Model)定義了統一的介面描述語言(WIT)和二進位呼叫慣例(Canonical ABI)。不同語言編譯出的 WASM 模組,可以像樂高一樣互相組合,無需膠水程式碼。


第十一回:北境鐵王坐雲端,聞風識得勁敵來

【搭可的危機感】

話分兩頭。

在遙遠的雲端北境,有一位鐵王,喚作搭可(Docker)

這鐵王何許人也?十餘年前,他發明了一種神奇的「貨櫃術」:不管你是什麼貨物,通通打包進標準貨櫃,走遍天下都能卸貨使用。「一次打包,處處運行」,何等霸氣!

憑著這門絕學,搭可鐵王打下了雲端半壁江山。Kubernetes 是他的左膀,CI/CD 是他的右臂,天下 DevOps 無人不識鐵王旗號。

然而這日,鐵王正在殿上批閱奏章,忽有探子來報:

「稟王上!南方出了個新太子,號稱 WebAssembly,近日厲兵秣馬,屢屢在邊境試探!」

「哼,」鐵王冷笑,「什麼太子?能有我的貨櫃穩當?能有我的生態龐大?」

謀士低聲道:「王上,這太子……確有幾分本事。他的包袱比咱們的貨櫃輕百倍,啟動比咱們快千倍。」

「輕?快?那能怎樣?」鐵王不以為意。

謀士繼續道:「而且……從瀏覽器到伺服器到樹莓派,他同一個包袱都能跑。咱們的貨櫃到了邊疆小城,可就水土不服了。」

鐵王臉色微變,放下了手中的奏章。

他想起了十年前自己說過的一句話——那是在一次酒後失言——

「如果 WASM + WASI 在 2008 年就存在,我們就不需要創造 Docker 了。」

此言一出,殿上鴉雀無聲。

謀士們面面相覷,大氣都不敢出。

鐵王沉默良久,終於開口:「傳令下去,密切關注南方動向。再派人去……學學他的路數。」

【技術白話】 Docker 容器映像檔動輒數百 MB,啟動需要數秒。WASM 模組通常只有幾 MB 甚至幾百 KB,啟動時間以毫秒計。在 Serverless、邊緣運算、IoT 等場景,WASM 的優勢非常明顯。Docker 創辦人 Solomon Hykes 確實說過那句話。

這場雲端爭霸,才剛剛拉開序幕。


第十二回:三十年河東西,店小二笑看潮起

【大結局:新舊交替】

話說這場風雲,從一個十天趕工的店小二開始,歷經三十載,終於走到了這一步。

這日,JavaScript 店小二——如今該叫「輔國公」了——在府中設宴,宴請新太子 WASM。

酒過三巡,菜過五味。

輔國公舉杯道:「太子殿下,老臣有句心裡話,憋了許久,不吐不快。」

「國公請講。」

輔國公放下酒杯,苦笑道:「當年老臣被趕鴨子上架,坐了那不該坐的位子。這些年東補西貼,臉都整歪了,苦不堪言吶。」

它指了指自己的臉:「您瞧瞧,這是 V8 整的,這是 TypeScript 貼的,這塊是 React 補的……老臣這張臉,早就不是自己的了。」

太子聽罷,沉默片刻,正色道:「國公言重了。若無國公這三十年披荊斬棘,哪有今日之 Web 盛世?殿內操持之功,本宮銘記在心。」

輔國公老淚縱橫:「殿下這話,老臣這輩子值了。」

它又灌了一杯酒,擦了擦眼角:「往後開疆拓土的大事,就看殿下的了。老臣嘛……繼續當我的店小二,伺候好這 DOM 一畝三分地,也就知足了。」

太子站起身,走到窗邊,望著遠方。

「國公,」太子說,「這天下,大得很。Docker 鐵王在北境厲兵秣馬,Java 老皇在東土閉關自守,還有無數邊疆小城等著我們去開拓。」

「您是說……」

「瀏覽器這一畝三分地,」太子轉過身,目光炯炯,「只是開始。」

窗外,夕陽西下,染紅了半邊天。

這場從瀏覽器開始的革命,正在向伺服器、向邊緣、向萬物互聯的世界蔓延。

至於最後鹿死誰手?

看官,這便是下一回故事了。

欲知後事如何,且聽下回分解。

【技術白話】 在可見的未來,JavaScript 和 WASM 會長期共存。JS 繼續負責 DOM 操作、事件處理、輕量互動;WASM 負責計算密集型任務和效能敏感場景。而在瀏覽器之外,WASM 正在挑戰 Docker 和 JVM 的地位,在 Serverless、邊緣運算、嵌入式系統等領域開疆拓土。


後記

本文戲謔講述一段嚴肅的技術演進史。

若您是技術人,希望這個視角能讓您會心一笑,並對 WASM 生態有更直觀的理解。

若您是企業主或決策者,希望這個故事能讓您明白:一場新的技術變革正在醞釀,而它可能深刻地影響您的技術選型和成本結構。

若您是 Vibe Coder,希望能讓您對新技術產生興趣——畢竟,能用自己喜歡的語言幹活,難道不是一件很美好的事嗎?

技術的歷史,本就是一部人類選擇與妥協的故事。

JavaScript 的崛起是一個美麗的意外,WebAssembly 的誕生則是深思熟慮的修正。

未來會怎樣?沒有人知道。

但有一點是確定的:懂得看風向的人,永遠不會被時代拋棄。


【註釋】

  1. 他不是別人,是鼎鼎大名 a16z 掌門人,矽谷知名投資人Marc Andreessen ↩︎

讓我們保持聯繫

推送 Push:有個資疑慮的您,按下網址列左方「鎖頭」開啟「通知」會收到通知

電子報 Subscribe:在上方框或側邊欄框中訂閱電子報,我會看到信箱,但不會發垃圾郵件。

合作 Cooperation:行銷、課程合作 請到 About 中填寫表單,留言、臉書專頁聯繫也可以

臉書專頁:疑問或聊天,請留言,或到臉書專頁「Simpro 學習控」關注及留言

訂閱電子報

約雙週更新,絕無垃圾郵件|記得到信箱查看驗證信

最有人氣

探索更多來自 Uncle6 Automatia 六叔自動症 的內容

立即訂閱即可持續閱讀,還能取得所有封存文章。

Continue reading