下一个 Brython? 不, 是 Python in WebAseembly
窦华晖
pyscript (官网) 支持在 html 中使用纯 python 语法的脚本标签. 形如下面的示例:
<html>
<py-script>
print("now you can run python in your html!")
</py-script>
</html>
部分了解过 brython 的人可能对此感到熟悉, 但二者也有显著的不同:
- brython 是将 python 代码转换成 “等价” 的 javascript 代码, 而 pyscript 是将 cpython 编译器带入到 wasm (webaseembly), 在性能和兼容度上都得到了飞跃性的提升.
- brython 出生的年代较早, 已经停止更新, 目前资源难以寻找, 且难以跟进最新的 python 语法; pyscript 是在最近的 python 大会 (PyConUS2022) 上初露峥嵘, 背后有 pyodide, wasm 等新技术的支持, 活力和潜力巨大.
- brython 从根本上无法支持所有的 python 功能特性, 例如 asyncio 机制; pyscript 目前已经支持了 asyncio, 并且 cpython in wasm 也让很多新语法的实现成为了可能.
- brython 不支持导入 py 脚本和库; pyscript 可以导入诸如 numpy, matplotlib 等第三方库, 以及 py 脚本 (本地路径), 其导入语法的设计也比较友好.
安装
pyscript 是以 “pyscript.js” 和 “pyscript.css” 的形式提供. 因此我们有两种方式引入:
-
在线引用
<link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" /> <script defer src="https://pyscript.net/alpha/pyscript.js"></script> -
下载后本地引用
下载 官网提供的压缩包 到本地 (zip 文件, 体积约 4.5mb, 解压后约 5.5mb).
然后在 html 中引用:
<link rel="stylesheet" href="~/pyscript.css" /> <script defer src="~/pyscript.js"></script>
快速开始
Hello World
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<title>PyScript Hello World</title>
<link rel="icon" type="image/png" href="favicon.png" />
<link rel="stylesheet" href="~/pyscript.css" />
<script defer src="~/pyscript.js"></script>
</head>
<body>
Hello world! <br>
This is the current date and time, as computed by Python:
<py-script>
from datetime import datetime
now = datetime.now()
now.strftime("%Y-%d-%m %H:%M:%S")
</py-script>
</body>
</html>
引入第三方库
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<title>Todo App</title>
<link rel="icon" type="image/png" href="favicon.png" />
<link rel="stylesheet" href="~/pyscript.css" />
<script defer src="~/pyscript.js"></script>
<!-- 注意, 在这里我们通过 py-env 标签来引入第三方库和模块. -->
<py-env>
- paths:
- /utils.py
</py-env>
</head>
<body>
<!-- py-script 标签也是可以通过 src 属性引入 py 文件的. -->
<py-script src="/todo.py"> </py-script>
</body>
</html>
相关阅读
- pyconus2022 介绍到 pyscript: https://twitter.com/mariatta/status/1520432987359399936?t=-mKSSuuIvUIRTsUc9cQ5qg&s=19
- pyscript 官网: https://pyscript.net/
- pyscript 的 github 地址: https://github.com/pyscript/pyscript
类似资料：