在瀏覽器中本地運行Node.js

「來源: ｜React ID：react_native」

一切要從收到一封郵件開始

大早上，我收到一封郵件，StackBlitz說正在與Next.js和Google的團隊合作開發一項新技術

幾年前，StackBlitz意識到網路正朝著關鍵的拐點發展。WebAssembly和新功能API的出現使編寫基於WebAssembly的作業系統似乎變得可能，該作業系統功能強大到可以完全在瀏覽器中運行Node.js。我們設想了一個比本地環境更快，更安全和一致的高階開發環境，以實現無縫的程式碼協作而無需設定本地環境技術名為:WebContainers

WebContainers允許您創建完整的Node.js環境，這些環境可以在毫秒內啟動，並且一鍵即可立即聯機和連結共享。該環境具有VS Code強大的編輯經驗，完整的終端，npm等功能。它還可以完全在您的瀏覽器中運行，從而帶來一些關鍵的好處：比本地環境快。與yarn / npm相比，構建速度最多可提高20％，而卷裝安裝速度則可快5倍以上。瀏覽器中的Node.js偵錯。與Chrome DevTools的無縫整合可實現本機後端偵錯，無需安裝或擴展。預設為安全。所有程式碼執行都發生在瀏覽器的安全沙箱中，而不是在遠端VM或本地二進位制檔案上。同樣，這些環境不在遠端伺服器上運行。而是，每個環境都完全包含在您的Web瀏覽器中。沒錯：Node.js運行時本身第一次在瀏覽器中本機運行。從現在開始，WebContainers現在處於公開測試階段。當前支援包括Next.js，GraphQL和Vanilla Node.js，我們正在與其他開源項目合作以擴展支援

為什麼會有WebContainers

安全

StackBlitz通過利用瀏覽器中數十年來的速度和安全性創新來解決這些問題。StackBlitz中的所有計算都會在瀏覽器安全沙箱中立即發生，並且無法爆發到您的本地計算機上。該模型還釋放了一些關鍵的開發和偵錯優勢（在幾秒鐘內便會提供更多優勢）。

釋放瀏覽器的功能

使用Chrome DevTools無縫進行Node.js偵錯事實證明，瀏覽器確實非常擅長偵錯Javascript。我知道，這令人震驚；）通過在瀏覽器中執行Node.js，與Chrome DevTools的整合即開即用。無需安裝，無需擴展，僅在瀏覽器中進行本機後端偵錯即可

運行伺服器,在你的瀏覽器中

實際上。WebContainers包含一個虛擬的TCP網路堆棧，該網路堆棧已對映到瀏覽器的ServiceWorker API，使您可以即時創建實時Node.js伺服器，即使您處於離線狀態也可以繼續工作。因為它完全在瀏覽器安全沙箱中運行，所以伺服器響應的延遲比本地主機（！）少，並且可以保護您的Web伺服器免受本地主機抓取攻擊毫秒級啟動時間每個頁面載入時都有一個全新的環境再見rm -rf node_modules！WebContainer的內建npm客戶端是如此之快，以至於它在每次頁面載入時都運行全新的安裝，從而確保您每次都能獲得一個乾淨的環境。如果您的環境確實出現問題，則可以像處理其他任何Web應用程式一樣恢復到乾淨的狀態：單擊「重新整理」按鈕藉助StackBlitz，無論您是在火車上，在飛機上還是在雨中後座時，都可以在沒有網際網路連線的情況下繼續工作使用StackBlitz新穎的計算模型，100％的程式碼執行發生在瀏覽器安全沙箱中。與本地相比，這導致了更快，更少限制的開發環境，同時又提供了更高的安全性，這是非常罕見的組合。

實際上，預設的安全狀況是如此穩固，以至於我們的嵌入式軟體包管理器是第一個可公開獲得的工具，可以解決五年多來未解決的Sam Saccone長期未解決的npm漏洞同樣，這些環境不在遠端伺服器上運行。而是，每個環境都完全包含在您的Web瀏覽器中。沒錯：Node.js運行時本身第一次在瀏覽器中本機運行寫在最後

WebAssembly強大到足以編寫作業系統，但是這次WebContainers把這個技術使用方向放在了Node.js上，我覺得是有劃時代意義的在我看來，這個技術在未來最主要應用方向是，可以使世界範圍內的軟體在以前無法運行的地方運行，以後電腦上可能只需要安裝一個谷歌瀏覽器

看完三件事

如果你覺得這篇內容對你挺有啟發，我想邀請你幫我三個小忙：

點「在看」，讓更多的人也能看到這篇內容（收藏不點贊，都是耍流氓 -_-）關注公眾號「前端巔峰」，不定期分享原創知識。也看看其它文章肯定