4

Python News: What's New From April 2022

 2 years ago
source link: https://realpython.com/python-news-april-2022/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client

PyScript: Python in Your Browser

During his keynote at PyCon US, Anaconda CEO Peter Wang unveiled the PyScript project. PyScript allows you to write Python directly inside HTML and run it in your browser. Consider the following example:

<html>
<head>
    <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
    <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
</head>

<body>
    <py-script> print('Hello, World!') </py-script>
</body>
</html>

Note the <py-script> tag, which can contain any valid Python code. In this case, this is the traditional Hello, World! greeting.

This is functioning code. You can copy the above code block into a file, such as hello.html, and save that file to your computer. Then you can open it in your browser, for example by using Ctrl+O or Cmd+O and selecting hello.html. Alternatively, you can test a similar example immediately on the PyScript demos page.

PyScript provides custom HTML tags, including <py-script>, which you saw above. There are several other tags as well, with many still in development. However, here are a couple that are immediately useful:

  • <py-env> lists packages that should be made available in the environment.
  • <py-repl> creates a working Python REPL to interact with the environment.

The following, slightly more involved, example shows how you can use these features:

<html>
<head>
    <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
    <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
    <py-env>
        - numpy
    </py-env>
</head>

<body>
    <h1 id="title">Magic Squares - Loading ...</h1>
    <py-script>
import numpy as np

# Initialize a magic square
magic = np.array([[6, 7, 2], [1, 5, 9], [8, 3, 4]])

# Update title to indicate that the page has finished loading
pyscript.write("title", "Magic Squares")
    </py-script>

    <py-repl id="magic-repl" auto-generate="true">
magic.sum(axis=0)
    </py-repl>
</body>
</html>

In this example, you declare that you want to use numpy in your environment. Then you import numpy, create an array that represents a magic square, and update the title on the page to indicate that the page is done loading. The REPL will be populated with code that you can run interactively on the web page that you’ve specified with the HTML. A typical session can look like the following:

Output of PyScript example in the browser

Note that pyscript.write() can interact with the Document Object Model (DOM) and update the contents of named HTML elements. Additionally, code you write in the REPL can use variables initialized in earlier code.

PyScript makes all of this possible by building on top of Pyodide. Pyodide provides CPython compiled to WebAssembly so that it can run in the browser or with Node.js. Additionally, Pyodide makes it convenient to call JavaScript from Python, and PyScript takes advantage of this to wrap JavaScript libraries like D3.

PyScript is still very much experimental, but the possibilities of this new framework are very exciting. We’re looking forward to following the development of PyScript going forward.


report

Recommend

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK