hi there sergeant aryaka laop here in this episode of smart python we're going to look
at pyscript a new and highly experimental project by anaconda creators of the python
distribution of the same name pi script lets you use python as a scripting language in web pages
both replacing and complementing javascript now over the years there has been various
attempts at allowing python to be used as an in-browser scripting language
whether it's because people wanted an alternative to javascript or because people wanted an easier
way to distribute python apps pi script is derived from previous efforts in this vein
such as the pi iodide project but it's designed to be easy to dive into and get started with
it's also very much in the early stages so there's little documentation available but
the examples that are available in the project's website give us some basics that we can work with
so let's start with the simplest possible pi script app this is a hello world the first thing
we need to do is include in the web pages head block and include that adds pi script to the page
this is easy enough because the whole of pi script is contained in a single javascript include that's
part of what's being pushed about it is that it requires very little work to get up and running
so next we create a script block in the page using the custom pi script tag everything inside these
tags is just regular python code now it does need to be indented and formatted correctly so you may
want to watch out if you're using a formatter for your html you don't want that also to affect the
way your python scripts are formatted you'll also notice one of the properties of the tag that we're
using here is output and that provides the id of a div into which to render the output of the
script from standard out and so we have right here after the script block another div with the id out
now when we first run this there's going to be a pause while the browser downloads the pi script
code and sets everything up this is the single biggest drawback to using pi script and there's
no easy way around it it takes a while to get everything ready to run and so there's this delay
one of the advantages javascript has is that it's always going to be fully native to the browser
and so after a pause we have a hello world
and all of this we have done by using nothing more than the standard python metaphors print and the
standard python script syntax now what else can we do well we can also import from the standard
library and we could use everything in there here is a modified version of the same script
that uses the date time module to render the current date and time on output and that
process is no different from what we would do in a regular python program we just import date time
and then use the functions from the imported module in our print statement here we have a third
example modified somewhat from one of the existing examples in the pi script demo page which shows
how we can use async and co-routines and this will allow us to update the page on a regular basis
this also shows how we can have access to the page's document object model what's called the dom
by way of a predefined class named element so if we pass element the id of an object
we can write to that object it's as simple as that and the rest of the script behaves pretty much as
you would expect it does take a bit to load but once it does so it updates the time each second
pi script also includes a few other components that ought to be familiar to python users
one of them is a repl the read evaluate print loop that you find when you open the python
runtime at a command prompt and when embedded in the web page by way of the pi reply tag
like this it works a little bit like a primitive jupyter notebook you can enter statements and then
have those statements evaluated interactively now if you want the full-blown experience of a jupiter
notebook for now you're going to want to stick with the real thing but we can see here the seeds
of how a full-blown jupiter-like environment could be created with nothing but python directly in the
browser instead of by way of a remote kernel accessed through a browser interface now as
you might well imagine it's possible to have back and forth interaction between the javascript side
of things in the python side of things one of the demos included in the pi script demo roundup is
worth looking at in detail for this this is an interactive exploration of a data set it's the
locations and times of taxi pickups in manhattan new york city over a 24-hour period and we can use
these controls here to modify various parameters of the presentation which hour of the data to use
what the visualization looks like and so on and so forth but all of the actual crunching of the data
is handled on the python side again python running in the browser as web assembly the presentation
side of things is handled with javascript and the degl library so there is a two-way interaction
between the javascript side in the browser and the python side in the browser
let's take a closer look at how all of this is set up
in the source code for this example you'll see we have a tag named pi
end and this is used to the same end as something like requirements.txt is used in a python project
to use to list all the third-party packages that we want to employ in this program
if we look in the console log for this page we can see where those packages were downloaded
and set up for use and note that this means that this particular page has quite a load time which
i've omitted for the sake of this demo and that in turn implies that there's a great many performance
improvements that could be made to how all of this works for how can be handled in the future for
instance we could have all these packages cached locally in the browser and then reused as needed
but those are improvements that are probably going to come further down the line once other things
have been settled now if we look through the code we can see some interesting things going on here
for one the html widgets that are used to control the display those sliders that i was playing with
those are actually rendered in python by way of the panel library the visualization the way that
they are turned into something that we can see in the browser is handled by deck gl and javascript
but it's generated on the python side so all we're using javascript for here is to render
the things that have been computed on the python side again computed in the browser not computed
on a server remotely and then sent to us so as you can guess from all that you've seen here
pi script is still quite primordial there's a number of demos available on the pi script site
that give you some idea of what's possible and i encourage digging into them if you're curious some
of them are quite fun now we still have a ways to go before pi script can be used to casually
deploy most any python script to an end user and that is one of its stated goals but for now
you can get your hands dirty with the first iteration of it you can play with the demos
and dig into them for yourself to see how they operate that's it for this video if you liked
it please leave a comment below don't forget to subscribe to the tech talk channel on youtube and
for more smart python and more dev serdar be sure to follow me on facebook youtube and infoworld.com