Use Python in a web browser with PyScript

Python he is A framework to allow Python code to be used directly in a web browser. Thus, it will become possible to create rich web applications using an increasingly popular language, but above all with multiple and advanced uses. This is still a beta version, and will continue to be greatly improved and supplemented, but The first results of Python in the browser are simply amazing.

For Python fans, pay attention to this Pyscript framework developed by Anaconda teamincluding CEO and Co-Founder Peter Wang (announcing the project during his keynote speech at PyCon US 2022). Pyscript is based on the Pyodide project launched by Mozilla in 2018 (and since 2021, the project has become independent), which is a solid foundation for using Python in the browser. In fact, Pyodide was designed for data science (such as Pyscript), whose goal was to partially overcome the limitations of JavaScript in terms of data analysis. It was created with WebAssembly, a low-level language, which enables very fast processing, and cpython-emscripten. In particular, it allows the execution of Python scripts in a web browser, as suggested by the Pyscript framework, and the use of Python packages (via PyPI).

How to install Pyscript for your web browser?

It’s much simpler to do than installing the Pyscript frameworksince then Paste only two lines into a standard HTML page To load the Python/JavaScript library (because yes, as is often the case, JavaScript is there! ^^). As shown below, you just have to copy/paste these two lines into the section … in your web pages.


Here it is installed. Now we just have to use it. To do this, two new HTML tags were created for the occasion:

  • : Contains Python code that will be executed directly in the browser (after a necessary but unobtrusive small loading).
  • : Create a code editor in the browser, such as JSFiddle or CodePen. Very interesting for developing rich applications using Python code, or simply for learning Python in a browser, such as a site like Codecademy.

There are many traits to know in order to go ahead with the use of these tags, but the main thing really lies in their presence alone. What is interesting, however, is Attribute Produce Allowing to give a home HTML element ID to display the output of a Python program. Thus, you can create a code whose result is transferred to another HTML tag, like this:

id="resultat">

output="resultat">
bonjour = "Bonjour tout le monde"

bonjour
It is also possible to invoke related scripts in addition to existing modules, like this (insert possible module names and put ‘paths:’ before the list of scripts to import):
- paths:
- ./utils.py

The third (and final) HTML tag is supposed to be completely complete, it is which is inserted into the header of the HTML page. Provides all useful dependencies For the above two tags, including useful Python modules (if needed). As in the screenshot below (taken from an example provided in Pyscript Github), this tag should be used as such (here with the well-known Matplotlib and Numpy modules).

- matplotlib
- numpy
You can also use relative scripts in addition to common modules, like this:
- paths:
- ./utils.py

What are Pyscript framework applications?

Pyscript is not a complete and successful project yet, despite all the promises the framework already suggests. So it’s about using it today in moderation, and above all knowingly. Pyscript’s first impression is reminiscent of Jupiter notebooks in anaconda, which can be used in the browser and which can be shared (particularly via Google Colab). However, on the one hand, Pyscript avoids installing programs (Anaconda, Jupyter…) and Python modules, and on the other hand it allows interaction with popular web languages, while taking advantage of the advantages of Python.

The goal of the framework is to make it easier to use Python in the browser, but above all in the long run being able to take advantage of the many advantages of the language as well as the intrinsic qualities of web languages, particularly JavaScript. Thus, it becomes possible Have Python modules interact with Javascript or Web APIs. Be careful but don’t misunderstand, Pyscript is not Javascript and therefore does not interact directly with the DOM, the library only has the ability to interpret Python and communicate with Javascript.

Examples of using the Pyscript framework (Python in a web browser with HTML)

If the original idea of ​​Pyodide and then Pyscript was to help data scientists, it comes from the fact that the numerous analyzes are sometimes difficult to share with lay people in programming. With this framework, everything becomes possible and then it becomes very easy to do the analyzes directly, or at least view the results online. It’s an excellent initiative, and if the entire project succeeds, there is no doubt that Pyscript will make its mark on the future of web frameworks…

Leave a Comment