
This can be an advantage, because you can build your own DOM manipulation system depending on what you’re trying to achieve. Skulpt does not have a built-in way to interact with the DOM. It’s not making requests back to a Python interpreter on a server somewhere, it’s actually running on your machine. The Skulpt website has a Python REPL that runs in your browser. This means the Python doesn’t have to be written until after the page has loaded. Skulpt sits at the far end of our diagram - it compiles Python to JavaScript at runtime. Which results in some machine-generated JavaScript that it runs using JS’s eval() function. That transpiles anything it finds in a Python script tag: In short, you run a function when your page loads: There’s a good explanation of how it works on the Brython GitHub page. Pretty cool, huh? A script tag whose type is text/python! The same widget I wrote above can be written in a script tag like this: Īlert("Hello " + document.value + "!")ĭocument.bind("click", greet) Just as with Transcrypt, it has a document object for interacting with the DOM. BRYTHONīrython lets you write Python in script tags in exactly the same way you write JavaScript. Next we’ll look at Brython, which makes the conversion on page load. Transcrypt makes the conversion to JavaScript at the earliest possible time - before the browser is even running. The compiler spat out a JavaScript version of my file, called hello.js. I wrote this in a file called hello.pyand compiled it using transcrypt hello.py. When you click the button, an event handler fires that displays an alert with a greeting: def greet():Īlert("Hello " + document.getElementById("name-box").value + "!")ĭocument.getElementById("greet-button").addEventListener('click', greet) To make it do something, I wrote some Python. I wrote a Hello, World page with just an input box and a button: Any readers familiar with JQuery will be feeling very at home. To get the element whose ID is name-box, you would use document. For example, if you import document, you can find any object on the page by using document like a dictionary. You interact with the page structure (the DOM) using a toolbox of specialized Python objects and functions. Transcrypt gives you a command-line tool you can run to compile a Python script into a JavaScript file. The other three actually run a live Python interpreter in your browser, each in a slightly different way. The y-axis answers the question: what does Python get compiled to? Three systems make a direct conversion between the Python you write and some equivalent JavaScript. At the other extreme, the compilation gets done in the user’s browser as they write Python code. The x-axis answers the question: when does Python get compiled? At one extreme, you run a command-line script to compile Python yourself.

Here’s a diagram that sums up their differences. I’m looking at six systems that all take a different approach to the problem. There are quite a few ways to run Python in your web browser. In the past, if you wanted to build a web UI, your only choice was JavaScript.
#ONLIE PYTHON RUNNER CODE#
So I invited him to give us an overview and comparison of the open-source solutions for running Python code in your web browser. Shaun Taylor-Morgan knows what he’s talking about here - he works for Anvil, a full-featured application platform for writing full-stack web apps with nothing but Python. Running Python in the web browser has been getting a lot of attention lately. Source Running Python in the Browser May 22, 2019
