你好，我是征哥，作為 Python 程序員，我很羨慕那些 Javascript 開(kāi)發(fā)者，動(dòng)不動(dòng)就能寫出令人驚艷的網(wǎng)頁(yè)。不過(guò)今年，我們也能用 Python 寫前端了：Anaconda 團(tuán)隊(duì)開(kāi)發(fā)出了 PyScript，你可以在 HTML 里面編寫和運(yùn)行 Python 代碼，調(diào)用 Javascript 庫(kù)，換句話說(shuō)，你可以用 Python 來(lái)進(jìn)行整個(gè)前后端開(kāi)發(fā)。

什么是 PyScript

PyScript[1] 是 Anaconda 團(tuán)隊(duì)開(kāi)發(fā)的一個(gè) Javascipt 庫(kù)，可以在 HTML 標(biāo)簽里嵌入 Python 代碼，無(wú)需服務(wù)端就可以運(yùn)行 Python 代碼。

比如說(shuō)，我們用 Python 在頁(yè)面上顯示日期，先編寫一個(gè) hello_world.html 文件，內(nèi)容如下：

用瀏覽器打開(kāi)，其運(yùn)行效果就是這樣的：

這意味著，我們可以在 HTML 中編寫和運(yùn)行 Python 代碼， 在 PyScript 中調(diào)用 Javascript 庫(kù)，并在 Python 中完成所有 Web 開(kāi)發(fā)。

PyScript 的工作原理

PyScript 目前構(gòu)建在 Pyodide上，Pyodide 是 CPython 到 WebAssembly/Emscripten 的端口。

PyScript 支持在瀏覽器中編寫和運(yùn)行 Python 代碼，并將在未來(lái)為其他語(yǔ)言提供支持。

你可能想知道，什么是 WebAssembly?以下來(lái)自維基百科：

WebAssembly(簡(jiǎn)稱 wasm)是一個(gè)實(shí)驗(yàn)性的低級(jí)編程語(yǔ)言，應(yīng)用于瀏覽器內(nèi)的客戶端。WebAssembly 是便攜式的抽象語(yǔ)法樹(shù)，被設(shè)計(jì)來(lái)提供比 JavaScript 更快的編譯及執(zhí)行。WebAssembly 讓開(kāi)發(fā)者能運(yùn)用自己熟悉的編程語(yǔ)言(最初以C/C++作為實(shí)現(xiàn)目標(biāo))編譯，再藉虛擬機(jī)引擎在瀏覽器內(nèi)執(zhí)行。WebAssembly 的開(kāi)發(fā)團(tuán)隊(duì)分別來(lái)自 Mozilla、Google、Microsoft、Apple，代表著四大網(wǎng)絡(luò)瀏覽器 Firefox、Chrome、Microsoft Edge、Safari。2017 年 11 月，以上四個(gè)瀏覽器都開(kāi)始實(shí)驗(yàn)性的支持 WebAssembly。WebAssembly 于 2019 年 12 月 5 日成為萬(wàn)維網(wǎng)聯(lián)盟(W3C)的推薦，與 HTML，CSS 和 JavaScript 一起，成為 Web 的第四種語(yǔ)言。

PyScript 帶來(lái)的便捷

• PyScript 使更多的前端開(kāi)發(fā)人員能夠使用 Python。
• 更低的編程門檻。因?yàn)閹缀趺總€(gè)人都可以訪問(wèn)網(wǎng)頁(yè)瀏覽器，無(wú)論是在計(jì)算機(jī)上還是在手機(jī)上。這意味著不需要安裝任何額外軟件就可以開(kāi)始編程。
• 有了 PyScript，不再需要擔(dān)心部署。PyScript 提供了“超越云端的架構(gòu)轉(zhuǎn)變”，一切都會(huì)網(wǎng)頁(yè)瀏覽器中發(fā)生。

如何使用 PyScript

PyScript 使用以下三個(gè)主要組件在 html 中編寫 Python：

• py-env 定義了運(yùn)行 Python 代碼所需的包。
• py-script 是在網(wǎng)頁(yè)中編寫 Python 代碼的地方。
• py-repl 創(chuàng)建一個(gè) REPL(讀取-評(píng)估-打印循環(huán))組件，用于評(píng)估用戶輸入的代碼并顯示結(jié)果。

比如代碼 todo.html[2] 中的兩個(gè)標(biāo)簽、：

執(zhí)行效果：

再來(lái)看一個(gè) repl[3] 的例子：

執(zhí)行效果:

更多例子請(qǐng)?jiān)L問(wèn)這里[4]。

如何運(yùn)行這些 demo ?

git clone https://github.com/pyscript/pyscript.git
cd pyscript
npm install 
npm run dev

然后瀏覽器訪問(wèn) http://localhost:8080，就會(huì)看到這個(gè)界面：

PyScript 的未來(lái)

PyScript 將 Python 帶到瀏覽器中，我覺(jué)得還是非常有價(jià)值的，對(duì)這項(xiàng)技術(shù)創(chuàng)新充滿期待，目前 GitHub 2.7K 的星，如果你也感興趣，不妨用它來(lái)做一個(gè)網(wǎng)站。