Pyodideとは
まずはちょっとしたご紹介を。
Pyodide is a port of CPython to WebAssembly/Emscripten.
翻訳: Pyodideは、CPythonからWebAssembly/Emscriptenへの移植です。
ということで、Pyodideを使うとブラウザ側でpythonを使えるようになります。つまりPythonがインストールされていなくてもPythonの処理が動きます。 その恩恵として、Pythonの成果物をいち早くユーザ(チームメンバ、クライアント、会社内の社員、etc...)の手元に届けることができます。
弱点としては読み込みに5秒ほど時間がかかるということです。こちらはロードマップのリストに入っているので改善されることを期待(https://pyodide.org/en/stable/project/roadmap.html)
実行時の環境
macOS
python3.9
環境構築からPackageの読み込みまで
Pythonの環境構築からローカルサーバーを立てるまでのワンライナー(git clone https://github.com/pycetra/PyodideSample してから実行してください)
# python環境の構築
python3 -m venv py39
source py39/bin/activate
pip install --upgrade pip
pip install wheel
pip list > requirements.txt
python --version > python_version.txt
# 自作のPython Packageの作成
python setup.py bdist_wheel
# Pyodideのダウンロードと解凍(versionは適宜変更してください)
curl -OL https://github.com/pyodide/pyodide/releases/download/0.20.0a1/pyodide-build-0.20.0a1.tar.bz2
tar -jxvf pyodide-build-0.20.0a1.tar.bz2
# ローカルサーバの起動
python -m http.server 5000
上記コマンドを実行した後に、ブラウザからlocalhost:5000/sample.htmlへアクセスするとPyodideの起動とPackageの実行が確認できます。
各ファイルのポイント
.html file上のpathの設定が必要になります。
- point: ローカルサーバーを立てたディレクトリにあわせて, "pyodide.mjs" のpathを設定すること。 (フロントエンドを初めてさわる方はご注意ください。)
./sample.html
<!DOCTYPE html>
<html>
<head>
<script type="module">
import { loadPyodide} from "./pyodide/pyodide.mjs";
async function main() {
let pyodide = await loadPyodide();
await pyodide.loadPackage("../dist/sample-0.0.0-py3-none-any.whl");
await pyodide.runPython(`
from sample import hello
hello.helloPyodide()
`);
};
main();
</script>
</head>
<body></body>
</html>
./setup.py
import setuptools
setuptools.setup(
name="sample",
packages=setuptools.find_packages()
)
./sample/hello.py
def helloPyodide():
print('hello pyodide!!!!!!!!!!!!!!!!!!!!!')
Pythonファイルは動作確認に必要な最低限の構成にしました。
つまずきそうな部分はpathの設定くらいでそのほかはそれほど苦労しませんでした。便利ですね！
参考
本記事のgithub repository: https://github.com/pycetra/PyodideSample