Heim > Web-Frontend > js-Tutorial > So erkennen Sie die Codesprache im Browser

So erkennen Sie die Codesprache im Browser

Patricia Arquette
Freigeben: 2024-11-27 00:13:10
Original
1036 Leute haben es durchsucht

How to detect code language in browser

Repository: https://github.com/ray-d-song/guesslang-js

Demo: https://ray-d-song.github.io/guesslang-js/

Vor kurzem arbeite ich an einem Projekt namens EchoRSS und habe eine sehr gewünschte Funktion, die darin besteht, externe Links in Abonnements abzufangen (Volltext lesen, zitieren usw.) und sie direkt auf der aktuellen Seite anzuzeigen.

Es besteht das Problem, dass der zurückgegebene HTML-Codeblock die Sprachanmerkung verliert (oder die Sprache in den Pre- und Code-Tags im ursprünglichen Codeblock nicht annotiert wurde), sodass er nicht mit Tools wie shiki oder prism.js hervorgehoben werden kann .

Ich habe drei Lösungen zur Erkennung der Codesprache gefunden:

1. Linguist

Dies ist ein Ruby-Projekt, das auf dem Server bereitgestellt wird, und Github verwendet es, um die Sprachzusammensetzung des Repositorys zu erkennen. Wenn Sie eine extrem hohe Genauigkeit benötigen und auf dem Server berechnet werden können, ist dies die beste Lösung.

2. hljs

highlight.js ist eine sehr bekannte Bibliothek zur Hervorhebung von Webcode und außerdem die einzige Bibliothek, die eine automatische Codeerkennung bietet.

Das Prinzip ist sehr einfach, nämlich die Schlüsselwörter der Sprache aufzuzählen, sie dann einzeln mit dem Text abzugleichen und schließlich zu sehen, welches den höchsten Übereinstimmungsgrad aufweist.

hljs hat vier Probleme.

  • Es erfordert eine sehr lange Codelänge und die meisten Sprachen erfordern mindestens 300 Zeichen, um eine relativ gute Genauigkeit zu erreichen.
  • Der Teil, der die Sprache erkennt, ist kein separates Modul, sondern eng mit dem Parser und dem Rendering verbunden, und der Code ist ebenfalls sehr zwingend, was das Extrahieren nützlicher Teile erschwert.
  • Wenn Sie das Erkennungsmodul nicht extrahieren, geht das ursprüngliche Format (Zeilenumbrüche und Einrückungen) des Codes verloren, wenn Sie HLJS zum Hervorheben verwenden.
  • Es erfordert viele regelmäßige Abgleiche, die Leistung ist schlecht und aus Grund 2 kann es nicht in einem Web-Worker ausgeführt werden.

3. Guesslang

guesslang ist ein maschinelles Lernprojekt, das auf tensorflow.js basiert.

Microsoft hat dieses Projekt 2021 auf node.js portiert und die automatische Spracherkennungsfunktion zu vscode hinzugefügt.

Ein Vietnamese, hieplpvip, hat dieses Projekt vor drei Jahren ebenfalls auf den Browser portiert, aber es gibt auch drei Probleme:

Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage