Python dans le navigateur: comment choisir entre Brython, PyPy.js, Skulpt et Transcrypt?

Je suis très heureux de voir qu'il est désormais possible de coder Python dans le navigateur. Voici les principaux candidats (veuillez ajouter ceux que j'ai pu ignorer):

• Brython
• Skulpt
• PyPy.js
• Transcrypter
• Pyodide

Mais comment choisir entre eux? La seule différence évidente que je peux voir est que Skulpt est basé sur Python 2, alors que Brython est basé sur Python 3.

Remarque: il ne s'agit pas d'une demande de recommandations ou d'avis. Je recherche des faits objectifs qui éclaireraient un choix éclairé.

Exécuter Python dans le navigateur est un très bon article à jour (à partir de 2019) qui compare Brython, Skulpt, PyPy.js, Transcrypt, Pyodide, Batavia . Je recommande vivement de le lire.

Un bon résumé peut être vu dans les images suivantes.

Voici quelques informations sur Brython vs Transcrypt (juillet 2016, puisque Transcrypt a été ajouté en option sur cette question par l'OP), glanées en démarrant un projet avec Brython il y a quelques mois et en passant à Transcrypt (déménagement terminé la semaine dernière). J'aime Brython et Transcrypt et je peux voir les utilisations des deux.

Pour les personnes novices dans ce domaine, Brython et Transcrypt `` transpilent '' les entrées python en javascript (Modifier: il est peut-être préférable de voir Brython comme une `` implémentation Python pour le navigateur '' car elle ne produit pas de javascript autonome). Les deux nécessitent la syntaxe Python 3. Brython comprend un nombre substantiel de bibliothèques standard Python et certaines de ses propres pour traiter des choses liées au Web, alors que Transcrypt évite cela pour la plupart et suggère d'utiliser des bibliothèques Javascript à la place.

Brython ( Github) peut effectuer la conversion dans le navigateur. Vous écrivez donc en python et le moteur brython.js le convertit en javascript à la volée lorsque la page est chargée. C'est vraiment pratique et beaucoup plus rapide que vous ne le pensez. Cependant, le moteur brython.js que vous devez inclure dans vos pages fait environ 500 Ko. De plus, il y a la question de l'importation de bibliothèques standard, que Brython gère en récupérant des fichiers .js séparés avec des requêtes XHR. Certaines bibliothèques sont déjà compilées dans brython.js, donc toutes les importations n'introduiront pas de nouveaux fichiers, mais si vous utilisez de nombreuses importations, les choses peuvent ralentir. Cependant, il existe des moyens de contourner ce problème. Ce que j'ai fait a été de vérifier l'onglet réseau dans les outils de développement du navigateur pour voir quels fichiers étaient extraits lorsque la page était chargée, puis de supprimer tous les fichiers que mon projet n'utilisait pas dans une copie du dossier Brython src, et exécutez le script inclus avec Brython (je pense que c'est à Brython / www / scripts / make_VFS.py) qui compile toutes les bibliothèques disponibles dans un fichier appelé py_VFS.js que vous devez également lier à partir de votre html. Normalement, cela fera un énorme fichier de 2 Mo +, mais si vous supprimez les choses que vous n'utilisez pas, il peut être assez petit. En procédant de cette façon, vous n'avez qu'à extraire brython.js, py_VFS.js et votre code python, et aucune requête XHR supplémentaire ne sera nécessaire.

Transcrypt ( Github ), d'autre part, est distribué sous forme de package python 3que vous pouvez utiliser manuellement ou vous connecter à votre chaîne d'outils pour compiler python en javascript à l'avance. Donc, avec Transcrypt, vous écrivez en python, exécutez transcrypt contre le python et il crache du javascript que vous pouvez lier dans votre projet. Il ressemble plus à un compilateur traditionnel en ce qu'il offre un certain contrôle sur la sortie. Par exemple, vous pouvez choisir de compiler vers ES6 ou ES5, ou lui demander de générer des sourcemaps (que lors du débogage, le navigateur vous amène directement au code python correspondant, à la lecture du code javascript généré.) La sortie javascript de Transcrypt est assez laconique ( ou en d'autres termes, c'est joli et laconique). Dans mon cas, 150 Ko de python sont convertis en 165 Ko de javascript ES5 non minimisé. À titre de comparaison, la version Brython de mon projet a utilisé environ 800 Ko après la conversion.

Cependant, pour obtenir les avantages de la concision Transcrypts, il faut lire un peu la documentation (vraiment juste un peu). Par exemple, avec Transcrypt, la `` véracité '' de Python pour les structures de données telles que dict, set et list n'est pas activée par défaut et son activation globale est découragée en raison de problèmes de performances potentiels liés à la vérification de type. Pour plus de clarté: sous CPython, un dict, un ensemble ou une liste vide a la valeur de vérité False, alors qu'en Javascript, il est considéré comme «vrai». Exemple:

myList = []
if myList:    # False in CPython bcs it's empty, true in javascript bcs it exists
    # do some things.

Il existe au moins trois façons de résoudre ce problème:

• Utilisez l'indicateur -t lors de la conversion de python en javascript, par exemple: $ transcrypt -t python.py (non recommandé, mais ce n'est probablement pas un problème, sauf si vous vérifiez la véracité plusieurs fois dans les boucles internes de code sensible aux performances.)
• Utilisez __pragma__(tconv)ou __pragma__(notconv)dans votre code pour indiquer au compilateur transcrypt d'activer la conversion automatique en valeurs de vérité de type python localement.
• Au lieu de vérifier la valeur de vérité, évitez complètement le problème en vérifiant simplement len ​​(myList)> 0 ... Peut-être que ce sera bien pour la plupart des situations, fait le travail pour mon usage léger.

Bon, donc mon projet prenait de l'ampleur et je voulais pré-compiler pour un gain de performances, mais j'ai eu du mal à le faire avec Brython (bien que ce soit techniquement possible, un moyen simple étant d'utiliser l' éditeur en ligne et de cliquer sur le bouton javascript pour voir le résultat). Je l'ai fait et lié au javascript généré à partir de project.html, mais cela n'a pas fonctionné pour une raison quelconque. De plus, j'ai du mal à comprendre les messages d'erreur de Brython, donc je ne savais pas par où commencer après l'échec de cette étape. De plus, la grande taille du code produit et la taille du moteur brython commençaient à me déranger. J'ai donc décidé d'examiner de plus près Transcrypt, qui avait d'abord semblé être de meilleure qualité car je préfère les instructions simplifiées qui me disent comment commencer immédiatement (elles ont depuis été ajoutées).

La principale chose à faire après l'installation de Python3.5 était:

1. Utilisez venv (c'est comme une nouvelle version intégrée de virtualenv qui utilise moins d'espace pour chaque projet) pour configurer un dossier de projet python3.5 (tapez simplement: python3.5 -m venv nomdossier - solution de contournement pour ubuntu avec des problèmes de package pour 3.5 ). Cela fait, entre autres, un nom de dossier avec un sous-dossier bin.
2. Installez le package python Transcrypt avec pip ('nomdossier / bin / pip install transcrypt') qui l'installe dans nomdossier / lib / python3.5 / site-packages / transcrypt.
3. activatele terminal actuel si vous ne voulez pas avoir à taper le chemin complet vers le nom du dossier / bin / python3.5 à chaque fois. Activer en tapant: 'nom du dossier source / bin / activer'
4. Commencez à écrire du code et à le compiler en javascript pour le tester. Compilez à partir du dossier dans lequel vous écrivez votre code. Par exemple, j'ai utilisé foldername / www / project. Alors CD dans ce dossier et exécutez: 'transcrypt -b your_python_script.py'. Cela place la sortie dans un sous-dossier appelé __javascript__. Vous pouvez ensuite créer un lien vers le javascript généré à partir de votre html.

Principaux problèmes qui évoluent

J'ai des besoins assez simples, donc votre kilométrage peut varier.

• Vous devez remplacer les bibliothèques standard brython ou python par des bibliothèques javascript. Ainsi, par exemple, 'import json' est fourni par Brython, mais sous Transcrypt, vous pouvez utiliser une bibliothèque javascript ou simplement utiliser JSON.parse / JSON.stringify directement dans votre code Python. Pour inclure une version minifiée d'une bibliothèque javascript directement dans votre code python, utilisez ce format (notez les triples guillemets):

  __pragma__ ('js', '{}', '''
  // javascript code
  ''')
  

• Les fonctions spécifiques html de Brython ne fonctionnent évidemment pas avec Transcrypt. Utilisez simplement les méthodes javascript normales. Exemples: 1) sous Brython, vous pourriez avoir fait référence à une balise HTML spécifique en utilisant 'document [' id ']', mais avec Transcrypt vous utiliseriez 'document.getElementById (' id ') (ce qui est la même façon que vous le faites depuis javascript). 2) Vous ne pouvez pas supprimer un nœud avec 'del nodeName' (bcs est une fonction brython). Utilisez quelque chose comme «node.parentNode.removeChild (node)». 3) remplacez toutes les fonctions DOM de brython par les alternatives javascript. par exemple nom_classe = nom_classe; text = textContent; html = innerHTML; parent = parentNode; children = childNodes, etc. Je suppose que si vous avez besoin de quelque chose qui contient des alternatives requises par certains navigateurs plus anciens, il existe des bibliothèques javascript pour cela. 4) set_timeout de Brython est remplacé par des javascripts setTimeout 5) Les balises html de Brython telles que BR () doivent être remplacées en utilisant les méthodes javascript habituelles ainsi que de refaire tous les endroits où vous avez utilisé sa syntaxe de manipulation <= dom. Vous pouvez soit injecter du balisage de texte brut en tant que innerHTML, soit créer les éléments à l'aide de la syntaxe javascript, puis les attacher à l'aide de la syntaxe DOM javascript normale. J'ai également remarqué que pour les cases à cocher, brython utilise "if checkbox = 'checked':" mais Transcrypt est satisfait de "if checkbox:" .. Vous pouvez soit injecter du balisage de texte brut en tant que innerHTML, soit créer les éléments à l'aide de la syntaxe javascript, puis les attacher à l'aide de la syntaxe DOM javascript normale. J'ai également remarqué que pour les cases à cocher, brython utilise "if checkbox = 'checked':" mais Transcrypt est satisfait de "if checkbox:" .. Vous pouvez soit injecter du balisage de texte brut en tant que innerHTML, soit créer les éléments à l'aide de la syntaxe javascript, puis les attacher à l'aide de la syntaxe DOM javascript normale. J'ai également remarqué que pour les cases à cocher, brython utilise "if checkbox = 'checked':" mais Transcrypt est satisfait de "if checkbox:" ..

• J'ai fini de déplacer un projet de 2700 lignes la semaine dernière, date à laquelle Transcrypt n'avait pas de support pour quelques petites choses (bien qu'elles soient assez faciles à remplacer par des fillers), il s'agissait de 1) str.lower, str.split (str. split est présent, mais semble être le split javascript, qui fonctionne différemment de la version python, dont je comptais sur le comportement), 2) round (cela semble être pris en charge dans la version dev maintenant) et 3) isinstance didn ne fonctionne pas sur str, int et float, uniquement sur dict, list et set. 4) Une autre différence avec Brython que j'ai remarquée est que si je tire une représentation JSON d'un dict, je dois le faire en utilisant 'myDict = dict (data)', alors que brython était satisfait de 'myDict = data'. Mais cela pourrait être lié à quelque chose dans json.loads de Brython, que j'ai remplacé directement par JSON.parse.__pragma__('opov')pour local), vous ne pouvez pas effectuer des opérations telles que définir des opérations en utilisant le format surchargé, mais vous devez utiliser les fonctions correspondantes. Par exemple

  a = set([1, 2, 3])
  b = set([3, 4, 5])
  a.difference(b)             # is used instead of a - b
  a.union(b)                  # used instead of a | b
  a.intersection(b)           # used instead of a & b
  a.symmetric_difference(b)   # used instead of a ^ b
  

6) De plus, vous ne pouvez pas itérer les dicts par défaut en utilisant 'for i in dict:', sans l'activer (ligne cmd -i ou __pragma__('iconv'), mais vous pouvez éviter d'avoir à l'activer en utilisant simplement le membre keys (), par exemple:

for key, value in dict.items():
    # do things for each key and value..

Pour résumer

• J'aime Brython car il est facile de s'y mettre et de tester votre code (juste F5). C'est plus proche du vrai python car la plupart des bibliothèques standard sont là. Je n'aime pas avoir à inclure le moteur de transpilation (Edit: Ou on pourrait le voir comme une machine virtuelle python) dans le navigateur et la grande taille javascript produite. Si je devais refaire les choses (mais toujours en utilisant Brython), j'aurais utilisé des méthodes javascript pour manipuler le DOM à partir de brython (ce que vous pouvez faire ...), au lieu de me pencher autant sur les méthodes brython parce que ce temps perdu à passer à un autre transpilateur lorsque mes besoins ont changé.

• J'aime Transcrypt parce que le javascript produit est vraiment `` léger et méchant '' et parce que la seule chose que vous chargez côté navigateur est votre code javascript généré qui est de taille similaire à votre code python. Aussi parce qu'il prend en charge les sourcemaps et parce qu'il me donne une mesure de contrôle sur le javascript produit. Et son utilisation m'a beaucoup appris sur l'optimisation.

J'espère que cela aidera quelqu'un à voir lequel d'entre eux pourrait être bon pour son projet particulier.

J'ai utilisé et je me suis engagé à skulpt ainsi qu'à pypyjs. Et ils sont tous les trois très différents que toute comparaison est sans objet si vous me demandez.

Cela dépend de ce que vous recherchez et qui aura le plus de sens.

PyPyJS

pypyjs est énorme, c'est un fichier javascript de 12 Mo qui contient toute la machine virtuelle pypy. Donc, si vous voulez l'exhaustivité de l'implémentation de python, c'est votre bébé. Il a un pont javascript qui fonctionne vraiment bien mais ce n'est pas une option viable pour écrire le code de votre site Web javascript en python. Il vous laissera cependant import compiler.

Il est construit avec emscripten et est plus rapide que CPython pour exécuter le benchmark pystone.

J'ai fait une brève présentation de pypyjs, voici les diapositives.

Skulpt

Est un outil d'enseignement (ou il a évolué vers cela au fil du temps), il compile votre python dans une machine à états émulant de très près le compilateur cpython. À la base, il s'agit d'une implémentation manuscrite du compilateur python en javascript. Il permet une exécution asynchrone qui vous permet de faire:

while (True):
    print "hi"

Sans verrouiller le navigateur.

Skulpt est le seul qui prend en charge les continuations asynchrones, il vous permet de mettre en pause l'exécution de python pendant qu'il résout une chose asynchrone. Faire ce travail:

from time import sleep
sleep(1)

Skulpt tourne à environ un dixième de la vitesse de CPython, en comparant pystone.

Brython

Je connais le moins celui-ci, peut-être que @ olemis-lang peut développer celui-ci. Mais à côté de la différence évidente, Brython est py3 et les autres py2. Brython est également un transpilateur.

Brython n'exécute pas le benchmark pystone car time.clock n'est pas implémenté, car officiellement c'est une fonction matérielle.

https://brythonista.wordpress.com/2015/03/28/comparing-the-speed-of-cpython-brython-skulpt-and-pypy-js/

Cette page compare les trois candidats. Brython ressort clairement comme un gagnant.

Malgré l '«aide» expliquant que le SO n'est pas bon pour ce genre de question, il semble qu'une réponse concise soit dans ce cas possible.

Peut-être que les gens sont trop pressés?

Tout d'abord, je suis un committer Brython. Néanmoins, je vais essayer d'être aussi impartial que possible afin de faire une évaluation objective.

La dernière fois que je l'ai utilisé, Skulpt ne prenait pas en charge les fonctionnalités telles que les expressions génératrices. Brython et PyPy.js le font, donc au niveau des fonctionnalités IMHO, les derniers sont supérieurs.

Brython (pour le moment) est toujours en cours de travail. Certains modules ne peuvent pas être importés (par exemple xml.ElementTree ). Néanmoins, cette situation commence à changer puisque nous travaillons à exécuter toute la suite de tests CPython malgré une compatibilité totale avec les standards (du moins quand cela a du sens).

Brython prend également en charge .vfs.js pour accélérer les importations de modules.

PyPy.js a un certain nombre de caractéristiques qui découlent directement du fait qu'il est alimenté par PyPy (compilation JIT, bien testée, ...) mais je ne suis pas sûr qu'il soit adapté pour fonctionner dans le navigateur. Cela pourrait changer à mesure que le projet évolue.

TODO: Je vais essayer de compléter ma réponse avec des repères fiables.

Non mentionné ici est RapydScript ou RapydScript-NG. Ils produisent du code JavaScript très efficace, qui est utilisé dans GlowScript VPython (glowscript.org). J'utilisais le RapydScript original d'Alex Tsepkov ( https://github.com/atsepkov/RapydScript ) mais je suis récemment passé à RapydScript-NG de Kovid Goyal ( https://github.com/kovidgoyal/rapydscript-ng ). J'ai récemment exécuté le benchmark pystone sur CPython, RapydScript et Brython, et vous pouvez voir les résultats ici:

https://groups.google.com/forum/?fromgroups&hl=en#!topic/brython/20hAC9L3ayE

Comme personne ne l'a mentionné, j'ai pensé qu'il valait la peine de mentionner Batavia qui implémente la machine virtuelle Python pour exécuter le bytecode Python précompilé.

Je viens de l'essayer et, bien que ce soit un concept intéressant, il en est encore à ses débuts car il y a peu de documentation.

En fin de compte, cela dépendra de ce que vous essayez de faire. J'ai choisi Transcrypt après avoir jeté un coup d'œil car il était plus pragmatique et plus performant, également plus récemment publié / maintenu.

Il s'agit d'une conférence mise à jour qui compare toutes les options disponibles sur le marché à l'heure actuelle:

https://www.youtube.com/watch?v=2XSeNQyPlTY

Le conférencier est Russell Keith-Magee, qui est un développeur bien connu dans la région.