Maison >interface Web >js tutoriel >Comment détecter le langage de code dans le navigateur

Comment détecter le langage de code dans le navigateur

Patricia Arquette
Patricia Arquetteoriginal
2024-11-27 00:13:101073parcourir

How to detect code language in browser

Dépôt : https://github.com/ray-d-song/guesslang-js

Démo : https://ray-d-song.github.io/guesslang-js/

Récemment, je travaille sur un projet appelé EchoRSS, et j'ai une fonctionnalité très recherchée, qui est d'intercepter les liens externes dans les abonnements (lire le texte intégral, citer, etc.) et de les afficher directement sur la page courante.

Il y a un problème : le bloc de code HTML renvoyé perd l'annotation de langue (ou la langue n'a pas été annotée sur les balises pre et code dans le bloc de code d'origine), il ne peut donc pas être mis en évidence à l'aide d'outils comme shiki ou prism.js. .

J'ai trouvé trois solutions pour détecter le langage du code :

1. linguiste

Il s'agit d'un projet Ruby déployé sur le serveur, et Github l'utilise pour détecter la composition linguistique du référentiel. Si vous avez besoin d'une précision extrêmement élevée et que vous pouvez calculer sur le serveur, c'est la meilleure solution.

2. hljs

highlight.js est une bibliothèque de mise en évidence de code Web très célèbre, et c'est également la seule bibliothèque qui permet une détection automatique de code.

Le principe est très simple, il s'agit d'énumérer les mots-clés de la langue, puis de les associer un à un avec le texte, et enfin de voir lequel a le plus haut degré de correspondance.

hljs a quatre problèmes.

  • Cela nécessite une très longue longueur de code, et la plupart des langues nécessitent au moins 300 caractères pour obtenir une précision relativement bonne.
  • La partie qui détecte le langage n'est pas un module séparé, mais étroitement couplée à l'analyseur et au rendu, et le code est également très impératif, ce qui rend difficile l'extraction des parties utiles.
  • Si vous n'extrayez pas le module de détection, le format original (sauts de ligne et indentation) du code sera perdu lors de l'utilisation de hljs pour le surligner.
  • Cela nécessite beaucoup de correspondances régulières, les performances sont médiocres et, pour la raison 2, il ne peut pas être exécuté dans un Web Worker.

3. deviner le langage

guesslang est un projet d'apprentissage automatique basé sur tensorflow.js.

Microsoft a porté ce projet sur node.js en 2021 et a ajouté la fonction de détection automatique de langue à vscode.

Un vietnamien, hieplpvip, a également porté ce projet sur le navigateur il y a trois ans, mais il y a aussi trois problèmes :

  • Fuite de mémoire, fuite de mémoire...
  • Prend uniquement en charge le