Naviguer en md dans vim

• Récupérer le contenu d’une page sur le web sans navigateur
• Naviguer dans vim
• Comparatifs
  • Performances
  • Limites
  • Autres avantages

D’expérience, sur un vieil ordinateur, faire tourner un naviguateur web est l’une des choses “classiques” les plus gourmandes en mémoire et en calcul. S’en passer permettrait donc d’allonger la durée de vie de certains terminaux en rendant l’usage du web plus léger. La solution que nous allons documenter par la suite possède d’autres avantages que nous allons expliquer à la fin de l’article.

Récupérer le contenu d’une page sur le web sans navigateur

Les serveurs web écoutent sur internet et répondent à des requêtes HTTP. Pour contruire et envoyer des requêtes HTTP nous pouvons utiliser des logiciels dédiés tels que wget et curl. Nous allons utiliser curl par la suite.

curl -s arthur.bebou.netlib.re/index.md

Unix et environnement ?
[Liste des articles au format tsv](http://arthur.bebou.netlib.re/articles.tsv)\
Chaque page est disponible au format :

  * `.html` - de l'html
  * `.sh` - les sources
[...]

Si l’on veut lire l’article dans un pager ou un éditeur de texte ou peut piper la sortie de curl.

curl -s arthur.bebou.netlib.re/index.md | less
#ou
curl -s arthur.bebou.netlib.re/index.md | vim -

Avec un petit :setf markdown on a même de la coloration syntaxique !

Naviguer dans vim

Super mais comment on fait pour naviguer dans le site ?

Nous allons pouvoir le faire grâce à une fonctionnalité magique de vim, le fait de pouvoir traiter le texte affiché à l’écran comme du code. On exécute ce que et là où l’on lit. Ainsi, si un lien vers un autre fichier md apparaît dans le document il est possible d’y préfixer la commande curl qui va bien, d’exécuter la commande et récupérer le contenu du lien.

Par exemple faire de :

2024-04-26 - **[Naviguer en md dans vim](http://arthur.bebou.netlib.re/navigation/index.md)**

ça :

2024-04-26 - **[Naviguer en md dans vim]
curl -s http://arthur.bebou.netlib.re/navigation/index.md

se mettre sur la ligne avec le curl et taper !!sh puis faire entrer :

2024-04-26 - **[Naviguer en md dans vim]
# Naviguer en md dans vim

D'expérience, sur un vieil ordinateur, faire tourner un naviguateur web est
l'une des choses "classiques"[^1] les plus gourmandes en mémoire et en calcul.
S'en passer que c'est possible permettrait donc d'allonger la durée de vie de

Il est ensuite possible de lire cet article. u reviendra en arrière (comme un ctrl+z dans la plupart des logiciels) et permettra de reprendre la lecture de la première page. Il est clair que cette navigation n’est pas idéale. Personnellement dans un navigateur classique je préfère ouvrir mes liens dans un nouvel onglet. Ca tombe bien, vim permet d’ouvrir des fenêtres. Si vous êtes dans vim vous pouvez lancer la commande :vnew pour constater qu’une nouvelle fenêtre verticale s’est ouverte. Si l’on pouvait y lancer notre commande curl nous aurions donc le nouvel article dans une fenêtre séparée. Pour cela il est possible de d’abord copier le lien, ouvrir la fenêtre, y coller le lien copié puis finalement y exécuter la commande. Puisqu’en markdown les liens sont (généralement) entre parenthèses la commande finale sera :

yi(:vnew<CR>p!!xargs curl -s<CR>

Il est possible de s’en faire une macro en ajoutant

map <F6> yi(:vnew<CR>p!!xargs curl -s<CR>

dans son .vimrc. <F6> peut être modifié pour y mettre la touche de son choix.

Pour le moment cette macro n’est utile que pour ouvrir des documents qui se lisent bien dans un éditeur de texte. Quant est-il si le lien renvoie vers une image ? Pour remédier à ce problème il est possible de créer un script dédié qui va, sur la base de l’url, déclencher plutôt tel ou tel comportement. Ce script pourrait s’appeler plumber.sh et avoir la tête suivante :

case $1 in
    *"youtube.com" )
        mpv --save-position-on-quit --ytdl-format="$format" --cache-secs=30 --volume=50 "$1" 2>  /dev/null
        ;;
    *".jpeg" )
        feh -. "$1"
        ;;
    *".md" )
        curl -Ls "$1"
        ;;
esac

Ainsi si le lien est un lien youtube on lance mpv, si c’est une photo ou l’ouvre avec feh et si c’est un fichier markdown on utilise directement curl.

Il faudra modifier la macro en remplaçant curl -s par le chemin du script plumber.sh. Ce concept de script agissant sur le contenu textuel ouvert dans un éditeur de texte est une idée importante dans le système d’exploitation plan 9 où il porte le nom de… plumber et s’applique plus généralement à la totalité de l’os.

Le site sur lequel vous lisez cet article existe entièrement en markdown. Essayez de modifier index.html en index.md (ou de l’ajouter à la fin) pour vous en convaincre. Cela veut dire que l’on peut le consulter sans jamais ouvrir un navigateur web, rendant possible la navigation sur du matériel très contraint.

Comparatifs

Performances

Tout est mesuré sur un raspberry 3b requêtant la page que vous lisez. Les résultats pourraient être très différents si l’on faisait le comparatif sur un site très lourd. Ici les écarts sont presque aussi petits que possibles puisque j’essaye de faire de l’html assez léger. Disons que c’est le best case scenario pour firefox.

Dans un contexte où le stockage serait vraiment contraint il se peut que firefox soit trop gros pour l’installer mais si l’on parle réduction de l’impact environnemental du numérique ce ne sont pas quelques centaines de Mo de stockage sur une carte SD qui feront vraiment la différence.

La quantité de données est plus faible côté markdown parce que c’est un langage avec moins de cérémonie, # machin vs <h1>machin</h1> et parce que l’on ne télécharge pas de css.

Au final c’est, je pense, vraiment le temps d’exécution qui fait une la différence. Je crois me souvenir qu’en moyenne une personne ne tolère que 2/3 secondes de chargement avant d’abandonner. Charger la page en 10 secondes en partant de zéro et en quelques secondes à l’ouverture d’un onglet dans le meilleur des cas on s’approche vraiment de cette limite. Une personne pourrait donc juger la navigation web via firefox sur son vieil ordi non satisfaisante et serait fortement tentée de changer de matériel. Et pourtant le rasp est tout à fait capable d’ingérer ces données si on le fait via une interface différente.

Limites

Évidemment la comparaison a ses limites. L’expérience de navigation dans vim est peut-être fonctionnelle et, de plusieurs façons, supérieure à l’utilisation d’un navigateur classique mais n’est certainement pas identique. Exit le css et une bonne partie de la forme. Je pense que beaucoup de sites devraient et pourraient se résumer à du markdown markdown mais est vrai que certains ne feraient pas vraiment sens sous un format markdown.

On hérite aussi des désavantages du markdown, de sa syntaxe parfois limitée et pas toujours parfaitement agréable à lire non plus. Par exemple le petit accordéon que j’utilise dans cet article ne peut pas être fait en markdown. Résultat ? La version markdown de cette page contient de l’html pour cette partie là. Je pourrais modifier mon générateur de site pour contourner ce souci mais au mieux je serais obligé d’intégrer une syntaxe strictement personnelle annonçant l’existence d’un accordéon qui ne sera pas forcément comprise par tous·tes et certainement pas par les parsers de markdown.

Autres avantages

Étant dans un éditeur de texte il est très facile d’enregistrer le document pour le consulter en mode hors-ligne. C’est également possible de le faire pour un site web mais l’affordance est moins incitative.

Il est possible d’écrire directement dans le document pour prendre des notes. Non seulement on exécute ce que l’on et là où l’on lit mais on y écrit également ! vim est une ui qui permet de fondre ces trois actions en un seul espace. Une conséquence de cela qui est, pour mes usages, très agréable, est qu’il est possible de suivre des tutoriels contenant du code en exécutant directement le code dans le document ! Si le document consulté est un tutoriel python il y apparaîtra probablement quelque chose comme :

Pour afficher une chaîne de caractère on peut utiliser la fonction print :

print("Coucou tout le monde !")

Si je lis ce tuto en markdown dans vim je peux me placer sur cette ligne, taper !!python3 et obtenir son résultat dans le buffer vim¹. Cela économise des copier coller mais permet également de modifier et tester la ligne de code directement dans l’éditeur. Niveau sécurité il est toujours recommandé de ne pas exécuter sur votre machine du code que vous ne comprenez pas mais au moins dans un éditeur de texte il n’est à priori pas possible de manipuler ce qui se retrouve dans votre presse papier. Il est possible que cela vous fasse penser au concept de “notebook” à la Jupyter et c’est tant mieux parce que ça y ressemble ! Il est tout à fait possible d’écrire un document qui mèle texte et code dans vim et n’y exécuter que le code. Avec une macro pour le faire facilement et notre plumber on peut créer des documents vraiment intéressants.

Pour le shell en particulier suivre un tuto sous cette forme est particulièrement agréable. Par exemple si un article contient des chemins bidons partout dans ses exemples vous pouvez faire un remplacement dans tous le fichier puis !!sh les commandes. Dans cette faq il est écrit votre_utilisateurice partout où devrait apparaître le nom de votre compte. Si celui-ci est alice alors on peut lancer la commande vim :%s/votre_utilisateurice/alice/g et suivre le tuto comme s’il avait été personnalisé pour soi.