Das Antiframework

Teile einer Website dynamisch nachzuladen, ist schick und praktisch. htmz demonstriert eindrucksvoll, dass man dafür nicht gleich zu dicken Bibliotheken greifen muss.

htmz ist ein – ja was eigentlich? Die Projektwebsite bezeichnet htmz als „Microframework“, allerdings durchaus mit einer gewissen Ironie. Denn zumindest zum Teil ist htmz eine amüsante Kritik an modernen Gepflogenheiten in der Webentwicklung: Oft werden für simpelste Probleme Dutzende Kilobytes an JavaScript-Frameworks nachgeladen und völlig unhinterfragt Abhängigkeiten ohne Ende in Kauf genommen. htmz misst dagegen minifiziert nur 166 Bytes und passt sogar in der ausführlichen Entwicklerversion in zehn Zeilen:

<script>
  function htmz(frame) {
    setTimeout(() =>
      document
        .querySelector(frame.contentWindow.location.hash || null)
        ?.replaceWith(...frame.contentDocument.body.childNodes)
    );
  }
</script>
<iframe hidden name="htmz"  onload="window.htmz(this)"></iframe>

Die Installationsanleitung für dieses Mikroframework: „Kopieren Sie einfach das Snippet in Ihre Seite.“ Aber wer unbedingt npm nutzen will, findet htmz auch auf npmjs.com, inklusive fragwürdiger Abhängigkeiten – hier wird aus Ironie schon Sarkasmus.