Hasta ahora cuando queríamos ejecutar código en un navegador este se tenía que escribir únicamente en JavaScript, o en alternativas cómo TypeScript que deben ser traducidas. Pero esto puede cambiar gracias a PyScript. Una librería con la que es posible ejecutar prácticamente cualquier código Python en un navegador moderno. Algo con lo que nos podemos aprovechar de la gran cantidad de código que existe en el ecosistema de Python.
Instalación de PyScript
Realmente PyScript es una librería JavaScript con la cual es posible ejecutar el código Python, por lo que la instalación no es más que importar los archivos en nuestra página HTML. Algo que se puede hacer insertando el siguiente código en la cabecera.
<link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" /> <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
Con lo que cargaremos la versión alpha desde la web del proyecto. También se pueden descargar los archivos por si necesitamos queremos trabajar sin conexión, algo que se puede conseguir desde la web del proyecto.
¡Hola Mundo!
Como es habitual, al probar un nuevo lenguaje o framework uno de los primeros ejercicios que se hace es el famoso ¡Hola Mundo!. Un programa sencillo, pero que nos permite comprender el funcionamiento básico de lo que estamos aprendiendo. Para PyScript una posible implementación de este ejercicio puede ser algo como lo siguiente.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
<script defer src="https://pyscript.net/alpha/pyscript.js"></script>
</head>
<body>
<h1>Evaluación de PyScript</h1>
<py-script> print('¡Hola Mundo!') </py-script>
</body>
</html>
En este pequeño ejemplo se puede ver claramente los fundamentos de funcionamiento. Tal como se explicó antes, lo primero que se debe hacer es importar el código JavaScript y el archivo CSS. Con esto se puede usar la etiqueta HTML <py-script> para encerrar dentro de la misma el código Python. El resultado de esta ejecución se podrá ver en el navegador de manera análoga a como se vería en una terminal. La salida que genera el archivo anterior es la que se muestra a continuación.
Funciones e importaciones
Es posible insertar código de más de una línea dentro de la etiqueta <py-script>. Lo que no se puede hacer es identar el código respecto a esta etiqueta, debido a la sintaxis de Python usa la identación para saber a qué bloque pertenece cada línea. Por lo que el script debe comenzar en la primera columna del archivo. En este código se puede importar librerías y definir funciones como cualquier otro archivo de Python.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
<script defer src="https://pyscript.net/alpha/pyscript.js"></script>
</head>
<body>
<h1>Evaluación de PyScript</h1>
<py-script>
import sys
def print_hola(name):
print(f'Hola { name }')
print_hola('PyScript')
print(f'Usando Python { sys.version_info.major }.{ sys.version_info.minor }')
</py-script>
</body>
</html>
En este caso se importa la librería sys, se crea una función para saludar y posteriormente se escribe la versión de Python que se está usando. Obteniendo como resultado la siguiente página.
En la que se puede saber que la versión de Python implantada en PyScript actualmente es la 3.10.
Importaciones externas
En el caso de importaciones que no son estándar es necesario indicar previamente al intérprete las que se desean importar. Lo que se hace dentro de la etiqueta HTML <py-env>. Simplemente insertando una lista con el nombre de las dependencias.
Después de esto estas se podrán importar dentro del código. Por ejemplo, a continuación, se muestra cómo representar la función seno con Matplotlib, para lo que además es necesario imitar NumPy. Siendo esto lo que se muestra en el siguiente código.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
<script defer src="https://pyscript.net/alpha/pyscript.js"></script>
<py-env>
- numpy
- matplotlib
</py-env>
</head>
<body>
<h1>Evaluación de PyScript</h1>
<py-script>
import matplotlib.pyplot as plt
import numpy as np
x = np.arange(-2, 2, .1)
y = np.sin(x)
fig, ax = plt.subplots()
ax.plot(x, y)
fig
</py-script>
</body>
</html>
Obtenido como resultado la siguiente página.
Conclusiones
PyScript es un intérprete de Python que se puede ejecutar en la mayoría de los navegadores modernos. Permitiendo así la ejecución de Python en un navegador. Aunque es un proyecto que promete bastante, actualmente está en versión alfa, hoy en día no es productivo. Pero merece la pena seguirle el rastro para ver si en un tiempo es una alternativa para usar Python y su ecosistema dentro de un navegador.
Imagen de James Osborne en Pixabay
Puzzle Bobble
Karate Blazers
Puzzle De Bloques
Magical Cat Adventure