Inline-Rendering mit document.currentScript
· Quelle: Simon Willison
Lean Rada hat einen kurzen Beitrag veröffentlicht, in dem gezeigt wird, wie man die Eigenschaft document.currentScript nutzt, um eingebettete Codefragmente zu erzeugen, die sich beim Laden der Seite automatisch ersetzen. Dabei wird ein kleines <script>‑Element eingefügt, dessen einziger Zweck darin besteht, document.currentScript.replaceWith() mit dem gewünschten Inhalt aufzurufen. Im Beispiel wird das aktuelle Jahr über new Date().getFullYear() eingefügt, sodass der Text „The year is“ dynamisch ergänzt wird, ohne externen Code oder weitere DOM‑Manipulationen nach dem Laden.
Um die Syntax noch kompakter zu gestalten, definiert der Autor eine Kurzfunktion $, die beliebig viele Argumente entgegennimmt und sie an replaceWith() weitergibt. Damit reduziert sich die Operation auf <script>$(new Date().getFullYear())</script>, was eine Art Mini‑Template‑Sprache darstellt, die berechnete Werte direkt im HTML platzieren lässt.
Diese Technik ist besonders nützlich für Entwickler, die die Menge an externem JavaScript reduzieren und die Logik zur Inhaltserzeugung möglichst nah am Markup halten wollen. Da sie beim Laden ausgeführt wird, entfällt die Notwendigkeit zusätzlicher Ereignisse oder späterer DOM‑Manipulationen, was die Effizienz und Lesbarkeit des Codes verbessert. In einer Umgebung, in der Rendergeschwindigkeit und Front‑End‑Einfachheit immer wichtiger werden, bietet eine leichte Möglichkeit, dynamische Daten direkt im HTML einzufügen, einen praktischen Vorteil für Webprojekte jeder Größe.
Originalartikel lesen auf Simon Willison
Diese Zusammenfassung ist eine informationelle Synthese von dataqbs.com. Alle Rechte am Originalinhalt liegen beim Autor und dem genannten Medienunternehmen. Wir handeln ausschließlich als Kuratoren von Technologie-Nachrichten und beanspruchen keine Urheberschaft.