Eric J Ma's Website

PyScript: Python in the Web Browser

written by Eric J. Ma on 2022-05-01 | tags: python web pyscript browser

At yesterday's PyCon 2022 keynote, Anaconda CEO Peter Wang did a big reveal on PyScript, which lets us use Python in the browser just like we would use JavaScript. Having heard the Keynote and having sat in on the Open Space led by Fabio Pliger, one of the lead software developers on the project, I immediately went off and tested the thing that afternoon.

My initial reactions can be described using the following phrases, in exact order:

  • No way this is happening!
  • Wow!
  • Oh wow!
  • Daaaaaaang!
  • I can write Python just like JavaScript??????
  • Oh man, I see so many possibilities.
  • Yes, yes, this is for the masses.

So I decided to give it a shot. That afternoon, I put in a pull request to the pyscript examples gallery. It was one describing how to do message passing on graphs, a point that left many of my Network Analysis Made Simple tutorial participants mindblown. I'm replicating the example below, with a few prose enhancements.

Message Passing and Linear Algebra: A Demo

- networkx - numpy

Imagine we have a chain graph that looks like this:

O --> 1 --> 2 --> 3

In NetworkX, we could construct a graph object that represents the graph. That graph would have the following edges:

import networkx as nx G = nx.DiGraph() nodes = list(range(4)) G.add_edges_from(zip(nodes[0:-1], nodes[1:])) print(G.edges()) 


It would also look like this:




import matplotlib.pyplot as plt
fig = plt.figure()
nx.draw(G, ax=plt.gca(), with_labels=True)
fig






Now, as it turns out, this graph has a linear algebra representation
in the form of an adjacency matrix that looks like this:




import numpy as np
A = np.eye(4, k=1)
print("A:")
print(A)






And imagine that we have a message that lives on the graph.
It is given by an indicator vector M,
where 1 indicates that the message lives on a node
and 0 indicates that the message is absent from the node.



M = np.array([1.0, 0.0, 0.0, 0.0])
print("M:")
print(M)



Now, if you did a dot product beetween the message and the adjacency matrix,
you would pass the message along the chain.
Try it out for yourself by copying and pasting in any one of the following lines
into the embedded PyScript REPL below:


M @ A
M @ A @ A
M @ A @ A @ A



(Execute the REPL by hitting Ctrl+Enter or Shift+Enter.)


M @ A




Reflections


I'm not sure that 2022 is going to be the year of the Linux desktop,
but I'm very sure that 2022 is already the year of Python embedded in the browser.
I wrote this blog post entirely in Markdown,
with only a few <div></div>, <pre></pre> and <py-script></py-script> tags
sprinkled throughout the post to make this happen.
As someone who has programmed in Python for my entire professional life,
there's a glaring inability for me to embed Python in HTML documents.
As such, Python has a strong server-to-client vibe baked into the ecosystem.


PyScript changes that paradigm: everything you saw above was rendered client-side only.
My website is a static site,
and yet you were able to run an embedded Python REPL here!
The possibility of using Python just like JavaScript is pretty amazing.
I can see many possibilities going forward,
both at work, in education, and more.
Kudos, Peter, Fabio, and the rest of the Anaconda team that put this out.
I can't wait to see how PyScript evolves!


    

    
    
    
    
    

    


    Cite this blog post:
    

    
@article{
    ericmjl-2022-pyscript-browser,
    author = {Eric J. Ma},
    title = {PyScript: Python in the Web Browser},
    year = {2022},
    month = {05},
    day = {01},
    howpublished = {\url{https://ericmjl.github.io}},
    journal = {Eric J. Ma's Blog},
    url = {https://ericmjl.github.io/blog/2022/5/1/pyscript-python-in-the-web-browser},
}
  

    

    

    

      I send out a newsletter with tips and tools
        for data scientists. Come check it out at
        Substack.
    

    

      If you would like to sponsor the coffee that goes into making my posts,
        please consider 
        GitHub Sponsors!
    

    

      Finally, I do free 30-minute GenAI strategy calls for teams
        that are looking to leverage GenAI for maximum impact. Consider 
        booking a call on Calendly
        if you're interested!