Will PyScript replace Django?

Get this slides at
slides.com/cheukting_ho/pyscript-django

What PyScript is and is not

Cheuk Ting Ho

@cheukting_ho

Cheukting

https://cheuk.dev

@cheuktingho

Hello I am Cheuk

  • Open-Source contributor


     
  • Organisers of community events


     
  • ex EPS board member, PSF fellow
     
  • Looking for my next role

Have you heard of PyScript?

What is WASM?

Your computer

  • a CPU chip
  • machine code
  • C compiler
  • CPython
  • Python

Web Browser

  • virtual machine
  • WASM
  • Emscripten
  • Pyodide
  • Python

So what is PyScript?

So what is PyScript?

  • a framework platform
     
  • run Python applications in the browser
     
  • not to replace JavaScript,
    but rather, you can use with it
     
  • thanks to Pyodide and WASM
     
  • many popular packages of Python avaliable

This is how to use PyScript

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

  <body>
    <h1>Let's plot random numbers</h1>
    <div id="plot"></div>
    <py-config type="json">
        {
          "packages": ["numpy", "matplotlib"]
        }
    </py-config>
    <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>
  </body>
</html>
<html>
    <head>
      <link rel="stylesheet" href="https://pyscript.net/releases/2022.12.1/pyscript.css" />
      <script defer src="https://pyscript.net/releases/2022.12.1/pyscript.js"></script>
    </head>

  <body>
    <h1>Let's plot random numbers</h1>
    <div id="plot"></div>
    <py-config type="json">
        {
          "packages": ["numpy", "matplotlib"]
        }
    </py-config>
    <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>
  </body>
</html>

 Or you can download and host it yourself

Just like other JS CDN

    <py-config type="toml">
        packages = ["numpy", "matplotlib"]
        paths = ["./data.py"]
    </py-config>

The <py-config> tag

toml format
(default)

    <py-config type="json">
        {
          "packages": ["numpy", "matplotlib"],
          "paths": ["./data.py"]
        }
    </py-config>

json format

load in config source​

<py-config type="json" src="./custom.json"></py-config>

The <py-config> tag

It is useful for ...

  • plug in packages (local wheel or hosted)
  • load in local modules (fetch)
  • change runtime settings (e.g. setting runtime source)
  • adding meta data (e.g. decription, author_name, license)

The <py-repl> tag

Interactive Python interface (like jupyter notebook)

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

Why is it useful?

a.k.a why do it on frontend

Sometime we need to use frontend because...

  • Computation is heavy
     
  • Don't want to provide a playground (crypto mining)
     
  • Data too sensitive to leave user's own machine

So, will PyScript replace Django?

No,

but we can make some amazing stuff if we use them together 🙌

If you are curious

Running Django with Pyscript - Frontend as a Backend?!

https://absurd-django.vercel.app/

by Patrick Arminio

More Pyscript examples...

See Pyscript.net examples

 

https://pyscript.net/examples/

PyScript Tutorial: 

https://github.com/Cheukting/pyscript-tutorial

Q & A

  • Can you pull in a python script?
    - Yes now you can with [[fetch]]
     
  • What is the Python version we are using?
    - Choose your version with the `src` var at [[runtimes]]
     
  • Why can't you use <script tag="python">
    - Because <script> is not a custom tag and it is defined by the browser which none of them is supporting Python yet
     
  • Why don't you just use Pyodide?
    - PyScript makes it easier to write Python in HTML, also it support multiple runtimes

Q & A

  • Can you pin a package version at <py-config>?
    - Right now you cannot, but you can host the wheel yourself
      (see example here)
     
  • What is the difference between PyScirpt and Brython?
    - PyScript is interpreting Python to WASM instead of JS and has many popular packages available

    - You can also pick which Python WASM backend to use

Your Question