Heim > Web-Frontend > js-Tutorial > Was sind JavaScript-Engines?

Was sind JavaScript-Engines?

DDD
Freigeben: 2024-12-27 09:53:10
Original
500 Leute haben es durchsucht

What are JavaScript Engines?

Das Schreiben von Code für das Web fühlt sich manchmal ein wenig magisch an, da wir eine Zeichenfolge in eine Datei schreiben, diese Datei in einem Browser öffnen und zusehen, wie sie zum Leben erwacht. Aber wenn Sie die Technologie hinter der Magie verstehen, können Sie Ihr Handwerk als Programmierer besser verfeinern.

In diesem Artikel erfahren Sie, was hinter den Kulissen in einem JavaScript-basierten Web- oder Mobil-Stack vor sich geht, indem Sie die Komplexität der JavaScript-Engines verstehen, die Browser antreiben. Lassen Sie uns zusammenfassen, was eine JavaScript-Engine macht, warum verschiedene Plattformen unterschiedliche Engines verwenden, wie sie sich im Laufe der Jahre weiterentwickelt haben und warum es uns als Entwickler wichtig sein sollte.

Zunächst ein wenig Terminologie

Eine „JavaScript-Engine“ wird oft als eine Art virtuelle Maschine bezeichnet. Eine „virtuelle Maschine“ bezieht sich auf die softwaregesteuerte Emulation eines bestimmten Computersystems. Es gibt viele Arten von virtuellen Maschinen, und sie werden danach klassifiziert, wie genau sie tatsächliche physische Maschinen emulieren oder ersetzen können.

Eine „virtuelle Systemmaschine“ stellt beispielsweise eine vollständige Emulation einer Plattform bereit, auf der ein Betriebssystem ausgeführt werden kann. Mac-Benutzer kennen möglicherweise Parallels, eine virtuelle Systemmaschine, mit der Sie Windows auf Ihrem Mac ausführen können.

Eine „virtuelle Prozessmaschine“ hingegen ist weniger voll funktionsfähig und kann ein Programm oder einen Prozess ausführen. Wine ist eine virtuelle Prozessmaschine, die es Ihnen ermöglicht, Windows-Anwendungen auf einer Linux-Maschine auszuführen, aber kein vollständiges Windows-Betriebssystem auf einer Linux-Box bereitstellt.

Eine JavaScript-Engine ist eine Art virtuelle Prozessmaschine, die speziell für die Interpretation und Ausführung von JavaScript-Code entwickelt wurde.

Hinweis: Es ist wichtig, zwischen den Engines, die einen Browser durch die Gestaltung von Webseiten antreiben, und der untergeordneten JavaScript-Engine, die Code interpretiert und ausführt, zu unterscheiden. Eine gute Erklärung zur Funktionsweise von Browsern finden Sie in diesem Artikel.

Was genau ist eine JavaScript-Engine und was macht sie?
Letztendlich besteht die grundlegende Aufgabe einer JavaScript-Engine darin, den von einem Entwickler geschriebenen JavaScript-Code in schnellen, optimierten Code umzuwandeln, der von einem Browser interpretiert oder sogar in eine Anwendung eingebettet werden kann. Tatsächlich bezeichnet sich JavaScriptCore selbst als „optimierende virtuelle Maschine“.

Genauer gesagt implementiert jede JavaScript-Engine eine Version von ECMAScript, wovon JavaScript ein Dialekt ist. Mit der Weiterentwicklung von ECMAScript entwickeln sich auch die JavaScript-Engines weiter. Der Grund dafür, dass es so viele verschiedene Engines gibt, ist, dass jede für die Arbeit mit einem anderen Webbrowser, einem Headless-Browser oder einer Laufzeit wie Node.js konzipiert ist.

Sie sind wahrscheinlich mit Webbrowsern vertraut, aber was ist ein Headless-Browser? Es handelt sich um einen Webbrowser ohne grafische Benutzeroberfläche. Sie sind nützlich, um automatisierte Tests für Ihre Webprodukte durchzuführen. Seit Version 59 von Chrome und Version 56 von Firefox können auf diese Weise auch normale Browser verwendet werden, insbesondere zu Testzwecken. Und wo passt Node.js da hinein? Node.js ist ein asynchrones, ereignisgesteuertes Framework, das Ihnen die serverseitige Verwendung von JavaScript ermöglicht. Da es sich um JavaScript-gesteuerte Tools handelt, werden sie von JavaScript-Engines unterstützt.

Angesichts der obigen Definition einer virtuellen Maschine ist es sinnvoll, eine JavaScript-Engine als virtuelle Prozessmaschine zu bezeichnen, da ihr einziger Zweck darin besteht, JavaScript-Code zu lesen und zu kompilieren. Das bedeutet nicht, dass es sich um einen einfachen Motor handelt. JavaScriptCore verfügt beispielsweise über sechs „Bausteine“, die JavaScript-Code analysieren, interpretieren, optimieren und im Müll sammeln.

Wie funktioniert das?

Das hängt vom Motor ab. Betrachten wir zwei wichtige Engines: WebKits JavaScriptCore und Googles V8-Engine. Diese beiden Engines verarbeiten den Verarbeitungscode unterschiedlich.

JavaScriptCore führt eine Reihe von Schritten aus, um ein Skript zu interpretieren und zu optimieren:

Es führt eine lexikalische Analyse durch und zerlegt die Quelle in eine Reihe von Tokens oder Zeichenfolgen mit einer identifizierten Bedeutung.

Die Token werden dann vom Parser auf Syntax analysiert und in einen Syntaxbaum eingebaut.

Vier JIT-Prozesse (Just-in-Time) werden dann aktiviert und analysieren und führen den vom Parser erzeugten Bytecode aus.

Einfach ausgedrückt nimmt diese JavaScript-Engine Ihren Quellcode, zerlegt ihn in Strings (oder lexiert ihn), wandelt diese Strings in Bytecode um, den ein Compiler verstehen kann, und führt ihn dann aus.

Die in C geschriebene V8-Engine von Google kompiliert und führt auch JavaScript-Quellcode aus, kümmert sich um die Speicherzuweisung und sammelt Reste durch Müll. Sein Design besteht aus einer Compiler-Pipeline, die Quellcode direkt in Maschinencode kompiliert:

  • Ignition, der Interpreter, der Bytecode generiert

  • TurboFan, ein optimierender Compiler, der diesen Bytecode in Maschinencode kompiliert

  • SparkPlug, ein Compiler, der TurboFan ergänzt

Wenn Sie sich für die Geschichte interessieren: Diese neue Pipeline ersetzte das ältere Full-Codegen- und Crankshaft-Doppel-Compiler-Design, das zuvor von V8 verwendet wurde.

Sobald Maschinencode durch den Kompilierungsprozess erzeugt wird, stellt die Engine alle im ECMA-Standard angegebenen Datentypen, Operatoren, Objekte und Funktionen dem Browser oder jeder Laufzeit zur Verfügung, die sie verwenden muss, wie z. B. Node.js. Deno oder Electron (wird von Visual Studio Code verwendet).

Ein kleiner Umweg: Laufzeiten

Wenn JavaScript-Engines leise im Hintergrund laufen, Code analysieren und ihn in lesbare Zeichenfolgen aufteilen, damit ein Compiler ihn lesen und kompilieren kann, ziehen Laufzeiten tendenziell mehr Aufmerksamkeit auf sich. Warum ist das so?

Bekannte Laufzeiten arbeiten auf JavaScript-Engines und erweitern so deren Leistung. Der bekannteste ist Node, aber Deno und Bun sind Neulinge in der Arena. Node und Deno betten V8 ein und Bun bettet JavaScriptCore ein.

Bun behauptet, schneller zu laufen als Node oder Deno, weil JavaScriptCore schneller als V8 ist und 69.845 HTTP-Anfragen pro Sekunde verarbeitet, gegenüber 16.288 für Node und 12.926 für Deno.

Das Ziel dieser Laufzeiten besteht laut Buns Dokumenten darin, „das meiste JavaScript der Welt außerhalb von Browsern auszuführen und so Leistungs- und Komplexitätsverbesserungen für Ihre zukünftige Infrastruktur sowie Entwicklerproduktivität durch bessere, einfachere Tools zu erzielen.“ Diese Laufzeiten nutzen tatsächlich die Leistungsfähigkeit von JavaScript-Engines, um JavaScript außerhalb von Browsern ausführen zu können.

NativeScript ist ein gutes Beispiel für eine Laufzeitumgebung, die speziell für die plattformübergreifende Entwicklung nativer mobiler Anwendungen mit JavaScript entwickelt wurde.

Diese Laufzeiten wurden auch entwickelt, um einige der inhärenten Probleme zu lösen, die die Single-Thread-Architektur von JavaScript mit sich bringt. Node priorisiert beispielsweise die asynchrone, threadlose Ausführung von Routinen. Alle diese Laufzeiten bieten ein kuratiertes Entwicklererlebnis, einschließlich integrierter Unterstützung für beliebte APIs wie Fetch, Websocket und sogar JSX, das bei React-Entwicklern beliebt ist. Dies könnte der Grund dafür sein, dass sie dazu neigen, die Aufmerksamkeit der Entwickler auf sich zu ziehen.

Laufzeiten schließen insgesamt wahrgenommene Lücken in der Leistung der Standardbrowserarchitektur und der Engines, die sie antreiben. Mit der Weiterentwicklung der Motoren werden sich sicherlich auch diese Laufzeiten weiterentwickeln.

Welche JavaScript-Engines gibt es?

Es steht eine große Auswahl an JavaScript-Engines zum Analysieren, Parsen und Ausführen Ihres clientseitigen Codes zur Verfügung. Mit jeder Veröffentlichung einer Browserversion wird die JavaScript-Engine möglicherweise geändert oder optimiert, um mit dem neuesten Stand der Technik bei der Ausführung von JavaScript-Code Schritt zu halten.

Bevor Sie sich völlig durch die Namen dieser Engines verwirren lassen, sollten Sie bedenken, dass in diese Engines und die ihnen zugrunde liegenden Browser eine Menge Marketing-Push gesteckt wird. In dieser nützlichen Analyse der JavaScript-Kompilierung bemerkt der Autor ironisch: „Falls Sie es nicht wussten: Compiler bestehen zu etwa 37 % aus Marketing, und Rebranding ist eines der wenigen Dinge, die Sie einem Compiler marketingtechnisch antun können.“ daher der Name Zug: SquirrelFish, Nitro, SFX..."

Während wir das Auf und Ab bei der Benennung und Umbenennung dieser Engines im Hinterkopf behalten, ist es nützlich, einige der wichtigsten Ereignisse in der Geschichte der JavaScript-Engine zu beachten. Ich habe eine praktische Tabelle für Sie zusammengestellt:

Browser, Headless Browser, or Runtime JavaScript Engine
Mozilla Spidermonkey
Chrome V8
IE Chakra
Safari JavaScriptCore*
Node.js V8
Deno V8
Bun JavaScriptCore
Edge** Blink and V8

*JavaScriptCore wurde in SquirrelFish umgeschrieben und in SquirrelFish Extreme, auch Nitro genannt, umbenannt. Es ist jedoch immer noch eine wahre Aussage, JavaScriptCore als die JavaScript-Engine zu bezeichnen, die WebKit-Implementierungen (wie Safari) zugrunde liegt.

**Edge verwendete ursprünglich die Chakra-Engine, von der Microsoft einige als Open Source bereitgestellt hat. Edge wurde dann als Chromium-Browser umgebaut, mit Blink- und V8-JavaScript-Engines unter der Haube.

Warum sollte es uns interessieren?

Das Ziel des Code-Parsing- und Ausführungsprozesses einer JavaScript-Engine besteht darin, in kürzester Zeit den bestmöglichen Code zu generieren.
Unterm Strich geht die Weiterentwicklung dieser Engines mit unserem Bestreben einher, die Web- und mobilen Umgebungen weiterzuentwickeln, um sie so leistungsfähig wie möglich zu machen. Um diese Entwicklung zu verfolgen, können Sie die Leistung verschiedener Engines in Benchmarking-Grafiken sehen, wie sie beispielsweise auf arewefastyet.com erstellt wurden.

Jeder Webentwickler muss sich der Unterschiede bewusst sein, die den Browsern innewohnen, die den Code anzeigen, an dessen Erstellung, Fehlerbehebung und Wartung wir so hart arbeiten. Warum funktionieren bestimmte Skripte in einem Browser langsam, in einem anderen jedoch schneller?

In ähnlicher Weise möchten mobile Entwickler, insbesondere diejenigen, die hybride mobile Apps schreiben, die eine Webansicht zur Anzeige ihrer Inhalte verwenden, wissen, welche Engines ihren JavaScript-Code interpretieren. Alle Webentwickler, denen das Benutzererlebnis am Herzen liegt, sollten die Einschränkungen und Möglichkeiten verstehen, die die verschiedenen Browser auf ihren kleinen Geräten bieten. Bleiben Sie über die Änderungen in
auf dem Laufenden JavaScript-Engines sind eine gute Zeit, wenn Sie sich als Web-, Mobil- oder App-Entwickler weiterentwickeln.

Dieser Artikel erschien ursprünglich im Jahr 2015 im Telerik Developer Network und wurde seitdem für 2022 und darüber hinaus überarbeitet und aktualisiert. Der Originalartikel wird auf Wikipedia im Eintrag „JavaScript Engines“ zitiert.
 

Das obige ist der detaillierte Inhalt vonWas sind JavaScript-Engines?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:dev.to
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage