基础介绍
官网上的概述为
PyScript is a Pythonic alternative to Scratch, JSFiddle, and other “easy to use” programming frameworks, with the goal of making the web a friendly, hackable place where anyone can author interesting and interactive applications.
简而言之，就是Scratch、JSFiddle和其他“易于使用”的编程框架的python替代品，其目标是使web成为一个友好的、可hack的地方，任何人都可以在这里编写有趣的、交互式的应用程序。
在PyScript官网中，核心功能介绍有
- 浏览器中的Python：启用插入式内容、外部文件托管和应用程序托管，而不依赖服务器端配置
- Python生态系统：运行许多流行的Python包和科学栈(如numpy、pandas、scikit-learn等)
- Python与JavaScript：Python与JavaScript对象和名称空间之间的双向通信
- 环境管理：允许用户定义要包含哪些包和文件以使页面代码运行
- 可视化应用程序开发：使用现成的UI组件，如按钮、容器、文本框等
- 灵活的框架：一种灵活的框架，可以利用它直接在Python中创建和共享新的可插入和可扩展组件
功能示例
来看看一些例子吧
直接下载压缩包pyscript-main
刚看了一下压缩包，要用npm构建一下，在example文件夹中会找到js和css文件，导入即可。
> npm install
> npm run build
或者使用CDN的方式使用PyScript
<link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
<script defer src="https://pyscript.net/alpha/pyscript.js"></script>
py-script：一般是使用<py-script>标签来写Python代码
<html>
<py-script> print('Now you can!') </py-script>
</html>
使用write方法：我们使用一个标记将一行或多行按顺序打印到页面上。在中，您可以访问pyscript模块，该模块提供了一个.write()方法来将字符串发送到页面上已标记的元素中。
<body>
<b><p>Today is <u><label id='today'></label></u></p></b>
<br>
<div id="pi" class="alert alert-primary"></div>
<py-script>
import datetime as dt
pyscript.write('today', dt.date.today().strftime('%A %B %d, %Y'))
def compute_pi(n):
pi = 2
for i in range(1,n):
pi *= 4 * i ** 2 / (4 * i ** 2 - 1)
return pi
pi = compute_pi(100000)
pyscript.write('pi', f'π is approximately {pi:.3f}')
</py-script>
</body>
py-env：还有第二个内置标签py-env，是通过引用.whl文件来使用第三方库的相关方法
<py-env>
- './static/wheels/travertino-0.1.3-py3-none-any.whl'
</py-env>
<py-env>
- numpy
- matplotlib
</py-env>
<py-script output="plot">
import matplotlib.pyplot as plt
import numpy as np
x = np.random.randn(1000)
y = np.random.randn(1000)
fig, ax = plt.subplots()
ax.scatter(x, y)
fig
</py-script>
当然对于这种高内聚的行为，不太符合现在模块分离的原则，因此，可以想到使用Python和HTML分离的方法
import numpy as np
def make_x_and_y(n):
x = np.random.randn(n)
y = np.random.randn(n)
return x, y
<py-env>
- numpy
- matplotlib
- paths:
- ./data.py
</py-env>
<py-script output="plot">
import matplotlib.pyplot as plt
from data import make_x_and_y
x, y = make_x_and_y(n=1000)
fig, ax = plt.subplots()
ax.scatter(x, y)
fig
</py-script>
py-config：使用标记以YAML格式设置和配置关于PyScript应用程序的通用元数据。
<py-config>
autoclose_loader: false
runtimes:
- src: "https://cdn.jsdelivr.net/pyodide/v0.20.0/full/pyodide.js"
name: pyodide-0.20
lang: python
</py-config>
从pyscripy.js文件中可以看到
customElements.define('py-script', PyScript);
customElements.define('py-repl', PyRepl);
customElements.define('py-env', PyEnv);
customElements.define('py-box', PyBox);
customElements.define('py-button', PyButton);
customElements.define('py-title', PyTitle);
customElements.define('py-inputbox', PyInputBox);
customElements.define('py-register-widget', PyWidget);
customElements.define('py-loader', PyLoader);
customElements.define('py-config', PyConfig);
看了一下相关文档，目前暂时只有这几个元素了，而且试了一下建立HTTPS和HTTP的功能貌似不太支持，可能是由于在动态获取包的时候因为网速的原因难以下载吧，希望能在后期优化下载第三方库的hub，提高可拓展性。
当然，也可以直接先下载whl然后我们加载进去即可，但是这种貌似失去了某些便捷性。
突然想起Python课老师的话，“Python除了不能生孩子，其他都可以做”，期待越来越好！
|