Heim > Web-Frontend > js-Tutorial > Hauptteil

Javascript tötet Webbrowser

Patricia Arquette
Freigeben: 2024-10-12 06:32:02
Original
331 Leute haben es durchsucht

Ein zu 99 % JavaScript-freies Web: Ist das möglich?

JavaScript ist unvorhersehbar, alt und bringt mich manchmal zum Erbrechen. Ich möchte es nicht mehr verwenden. Nun, diese Zeile ist perfekt, um Ihre Aufmerksamkeit zu erregen, aber gleichzeitig ist sie falsch, weil Entwickler nicht ohne JavaScript leben können, insbesondere Front-End-Entwickler.
Bei dieser Untersuchung geht es darum, Möglichkeiten zur Vermeidung von JavaScript zu finden. Wenn ich sage „JavaScript vermeiden“, schlage ich nicht vor, etwas zu verwenden, das in JavaScript transpiliert ist. Was ich eigentlich meine, ist, dass ich nur sehr wenig JavaScript in der endgültigen Ausgabe meines Anwendungscodes haben möchte.

Sehen Sie sich das auf YT an

Übermäßiger Einsatz von JavaScript: Warum es ein Problem ist

Entwickler sind heutzutage in allen Bereichen, von Front-End-Frameworks bis hin zu API-Interaktionen, stark auf JavaScript angewiesen. Aber müssen wir uns wirklich so sehr darauf verlassen? Folgendes passiert: Entwickler fühlen sich oft unter Druck gesetzt, JavaScript zu verwenden, wenn einfachere, effizientere Alternativen verfügbar sind.

Nehmen Sie beliebte Frameworks wie React, Vue, Angular und Svelte. Diese eignen sich hervorragend zum Erstellen dynamischer und reaktionsfähiger Websites, können jedoch für einfachere Anwendungen übertrieben sein. Sie führen zu unnötiger Komplexität, erhöhen letztendlich die Lernkurve und machen die Wartung zu einem Problem.

Was ist also das Problem mit JavaScript?

Bei intensiver Nutzung treten mehrere kritische Schwachstellen auf, darunter:

  1. Langsamere Ladezeit – Große JavaScript-Bundles verlangsamen die Seitenleistung. Jede Bibliothek, die Sie hinzufügen, erhöht das Gewicht Ihres Projekts, wodurch die Ladezeiten langsamer werden.
  2. Clientseitige Rendering-Probleme – Viele Frameworks sind unnötigerweise auf das Client-Rendering angewiesen, was zu Verzögerungen und Leistungseinbußen führen kann. React-Apps rendern beispielsweise die gesamte Webseite mithilfe eines virtuellen DOM neu und verlängern so die Zeit, bis eine Webseite interaktiv wird.
  3. Schwere Abhängigkeiten – Je mehr Bibliotheken Sie hinzufügen, desto häufiger treten Kompatibilitätsprobleme, Versionsaktualisierungen und Abhängigkeitskonflikte auf.
  4. Versteckte Wartungskosten – Mit den ständigen Updates und potenziellen Breaking Changes durch übermäßige Abhängigkeit von Paketen Schritt zu halten, wird zu einer kostspieligen Angelegenheit in Bezug auf Zeit und Ressourcen.

Der JIT-Compiler: O Junge!

Einer der Schlüsselbereiche, in denen JavaScript versucht, die Leistung zu verbessern, ist die JIT-Kompilierung (Just-In-Time). Moderne Browser, wie die V8-Engine von Chrome, kompilieren JavaScript zur Laufzeit in Maschinencode.

Javascript is Killing Web Browsers

Ziel ist es, JavaScript so schnell wie möglich zu machen.

Diese Optimierung hat jedoch ihren Preis. JIT-Compiler ändern manchmal das Verhalten von JavaScript-Code und führen häufig zu Fehlern und unerwarteten Problemen, die Ihre Web-App anfällig machen können. Einfach ausgedrückt: Die Optimierungen von JIT-Compilern können ein Glücksspiel sein.

Häufige JIT-Compiler-Fehler

Hier sind einige der berüchtigteren Fehler:

  • Fehlkompilierung: Der JIT-Compiler kann eine falsche Ausgabe erzeugen, wenn er Codeabschnitte falsch optimiert.
  • Eliminierung von Grenzprüfungen: Bei einem Optimierungsversuch überspringt der JIT-Compiler möglicherweise notwendige Prüfungen wie Array-Grenzen und öffnet so die Tür zu Abstürzen.
  • Redundanzbeseitigung: Wenn der JIT-Compiler davon ausgeht, dass wiederholter Code redundant ist, kann er wichtige Abschnitte eliminieren, was zu unvorhersehbarem Verhalten führt.

Diese Compilerprobleme unterstreichen, wie wichtig es ist, JavaScript ausgiebig zu testen, um unerwartete Probleme zu vermeiden. Aber was noch wichtiger ist: Sie zeigen, warum wir JavaScript nach Möglichkeit reduzieren müssen, um das Risiko des Auftretens neuer Probleme zu verringern.

Clientseitige Alternativen zu JavaScript

Die gute Nachricht ist, dass Sie nicht in der JavaScript-Schleife stecken bleiben müssen. Es sind mehrere Alternativen entstanden, um JavaScript zu reduzieren und gleichzeitig die Funktionalität beizubehalten. Zwei der aufregendsten Optionen sind HTMX und WebAssembly.

HTMX: Hypermedia auf Steroiden

HTMX ermöglicht Entwicklern die Erstellung dynamischer, interaktiver Webanwendungen mit minimalem JavaScript. Anstatt sich bei jeder Interaktion auf JavaScript zu verlassen, sendet HTMX tatsächliches HTML vom Server, wodurch die Notwendigkeit reduziert wird, die gesamte Benutzeroberfläche mit JavaScript-Frameworks wie React neu zu rendern.

Stellen Sie sich Folgendes vor: Anstatt eine JSON-Antwort zur Verarbeitung an Ihr Frontend zurückzusenden, können Sie mit HTMX HTML direkt vom Backend senden und so die Kundenabwanderung reduzieren. HTMX basiert auf herkömmlichen HTML-Ankern und -Formularen, um Aufrufe direkt an den Server zu tätigen – alles ohne JavaScript.

Warum HTMX rockt:

  • Minimale Lernkurve – Fügen Sie Ihrem HTML ein paar Attribute hinzu, und schon kann es losgehen.
  • Funktioniert mit HTML – Vermeiden Sie die Manipulation des DOM mit übermäßigem JavaScript.
  • Anmutiger Fallback – Selbst wenn jemand JavaScript in seinem Browser deaktiviert, funktioniert Ihre HTMX-basierte App weiterhin, wenn auch ohne den ganzen Schnickschnack.

In einer Welt, in der viele Apps ohne JavaScript kaputt gehen, HTMX sorgt für größere Kompatibilität und bessere Leistung. Es geht zurück auf das Wesentliche, Anfragen direkt aus HTML-Elementen zu stellen und interaktive Komponenten wie Formulare oder anklickbare Elemente in Angriff zu nehmen, ohne Ihre App mit Skripten aufzublähen.

WebAssembly: Ein Leistungskraftwerk

Wenn es um WebAssembly (Wasm) geht, besteht die Absicht nicht darin, JavaScript vollständig zu ersetzen, sondern rechenintensive Aufgaben zu bewältigen. Dies kann die Leistung von Spielen, datenwissenschaftliche Berechnungen oder die Bildverarbeitung sein, bei denen JavaScript vom Standpunkt der Leistung einfach nicht ausreicht.

Mit WebAssembly können Sie Sprachen wie C, C und Rust kompilieren, um spezifische, rechenintensive Aufgaben auf der Clientseite auszuführen, ohne JavaScript zu verwenden. Dies macht WebAssembly ideal für Aufgaben wie Videobearbeitung, Spiele oder Datenverarbeitung, alles innerhalb eines Webbrowsers.

Die wichtigsten Vorteile von WebAssembly:

  • Hohe Leistung: Optimiert für CPU-lastige Aufgaben, mit denen JavaScript zu kämpfen hat.
  • Läuft direkt im Browser: Wie JavaScript profitiert es von der Browserunterstützung, erfordert jedoch keine JavaScript-Parsing-/Rendering-Ineffizienz.
  • Portabel: Derselbe Code kann mit hervorragender Effizienz kompiliert und in allen Browsern ausgeführt werden.

Für jede Site, die viel Rechenaufwand bewältigen muss, WebAssembly kann die Dinge beschleunigen und die Ladezeiten verkürzen.

Serverseitig: Zeit, JavaScript aufzugeben?

Während JavaScript einst auf die Clientseite beschränkt war, ist es durch die Einführung von Node.js auch auf Servern äußerst beliebt geworden. Node hat einiges zu bieten: Asynchrone Ereignisbehandlung, nicht blockierende E/A und natürlich die Verwendung einer Sprache im gesamten Stapel. Aber die Fallstricke von JavaScript (dynamische Typisierung, Sicherheitsrisiken wie Prototypverschmutzung und erhöhte Komplexität) bestehen immer noch.

Glücklicherweise haben wir 100 % Alternativen zu JavaScript auf der Serverseite. Hier sind einige:

1. Gehen (Golang)

Gos leichtgewichtige Goroutinen ermöglichen hochgradig gleichzeitige, skalierbare Systeme ohne den Speicheraufwand von Threads. Diese Sprache eignet sich besonders für Anwendungen, die eine blitzschnelle Leistung bei großem Datenverkehr benötigen.

2. Django (Python)

Django ist ein Favorit, wenn es um Sicherheit geht. Es reduziert Schwachstellen wie Prototypenverschmutzung und Redos-Angriffe (für die JavaScript anfällig ist). Obwohl es möglicherweise nicht wie Go skaliert, Django ist perfekt für kleinere oder sicherheitsbewusste Anwendungen.

3. PHP (Laravel)

PHP war schon immer eine zuverlässige Backend-Sprache und sein modernes Framework, Laravel, macht kleine bis mittlere Projekte einfach zu verwalten. Mit automatischem Routing und einem großartigen Plugin-Ökosystem hat PHP trotz des Aufstiegs von JavaScript immer noch seinen Platz in der Entwicklungswelt.

4. Ruby on Rails

Für schnelle Entwicklung bietet Ruby on Rails eine elegante, entwicklerfreundliche Umgebung. Auch wenn es für die Bewältigung großer Anwendungen vielleicht nicht die beste Lösung ist, eignet es sich perfekt für kleine Teams, die schnelle, skalierbare Lösungen anstreben.

Die versteckten Kosten von JavaScript-Frameworks

Die Verwendung von mehr JavaScript, insbesondere für alles auf der Client- und Serverseite, verursacht eine Reihe versteckter Kosten. Je größer Ihr JavaScript-Paket ist, desto mehr Probleme treten auf. Hier ist, womit Sie es zu tun haben:

  • Paketaufblähung – Je mehr Bibliotheken und Abhängigkeiten Sie hinzufügen, desto mehr wird Ihre endgültige Ausgabe mit unnötigem Code aufgebläht.
  • Erhöhter Wartungsaufwand – Wenn Sie diese Abhängigkeiten auf dem neuesten Stand halten, entsteht ein Wartungsaufwand und es besteht die Gefahr, dass Ihre App kaputt geht, wenn Bibliotheken größeren Updates unterzogen werden.
  • Breaking Changes – Framework-Updates (oder sogar kleine Bibliotheksaktualisierungen) können bestehende Funktionen beeinträchtigen, so dass Sie sich mit der Neuschreibung wesentlicher Teile des Codes herumschlagen müssen.

Die Lösung? Priorisieren Sie Leistung und Sicherheit

Letztendlich geht es bei der Reduzierung von JavaScript nicht nur darum, Fehler oder langsame Ladezeiten zu vermeiden – es geht darum, Webanwendungen zu erstellen, die schneller, einfacher und sicherer sind. Durch die Verlagerung umfangreicher Berechnungen auf WebAssembly, die native Verarbeitung von UI-Updates mit HTMX und die Verlagerung der Backend-Logik in sicherere Sprachen wie Go oder Python, Sie werden Ihre Webprojekte drastisch verbessern.

Auch wenn es vielleicht nicht für jeden machbar ist, JavaScript vollständig zu eliminieren, JavaScript so weit wie möglich zu reduzieren, ist auf jeden Fall einen Versuch wert. Es geht darum, moderne Alternativen zu nutzen, um zu vermeiden, dass JavaScript zum Engpass für Entwickler wird.

Abschluss

Ganz gleich, ob Sie JavaScript auf dem Client oder dem Server minimieren möchten, Sie haben die Möglichkeit, Ihre Webanwendungen schlanker, schneller und sicherer zu machen. HTMX und WebAssembly bieten spannende Alternativen für die JavaScript-lastige Frontend-Entwicklung, während Go, Django und Laravel praktikable Optionen für das Backend sind.

JavaScript wird bleiben, aber wir müssen uns nicht für alles darauf verlassen. Indem wir den Platzbedarf von JavaScript strategisch reduzieren, können wir endlich Apps erstellen, die eine bessere Leistung erbringen und nahtlos skalieren.

Sind Sie bereit, Ihr JavaScript zu reduzieren und die Kontrolle über Ihre Web-Apps zu übernehmen? Beginnen Sie noch heute mit dem Experimentieren!

Das obige ist der detaillierte Inhalt vonJavascript tötet Webbrowser. 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
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!