Ein Polyfill ist Code, der eine fehlende Funktion in älteren Browsern nachbildet, damit neuere Schreibweisen trotzdem funktionieren.
- Polyfill
Code, der eine Funktion nachbildet, die ein Browser noch nicht mitbringt, damit neuere Schreibweisen dort trotzdem laufen.
Beispiel: „Das Polyfill springt nur ein, wenn der Browser die Funktion nicht selbst kennt.“Herkunft: Remy Sharp prägte das Wort 2009, angelehnt an Polyfilla, eine britische Spachtelmasse. Gemeint ist das Füllen von Lücken, ohne dass man hinterher sieht, wo sie waren.
Abgrenzung zum Transpiler: Der Transpiler übersetzt Schreibweisen. Ein Polyfill liefert eine ganze Funktion nach, die es sonst nicht gäbe. Beide werden zusammen eingesetzt.
Wie es arbeitet
Es prüft zuerst, ob die Funktion vorhanden ist, und legt sie nur an, wenn sie fehlt. In einem aktuellen Browser passiert also nichts außer dieser einen Prüfung.
Daraus folgt der wichtigste Punkt für die Ladezeit: Polyfills sollen nur dort geladen werden, wo sie gebraucht werden. Wer sie pauschal ausliefert, beschwert jeden Besuch für eine Minderheit alter Browser.
Dass es seltener nötig wird
Die Browser aktualisieren sich heute von selbst, und der Abstand zwischen einem neuen Sprachmittel und seiner Verfügbarkeit ist auf Monate geschrumpft. Die großen Polyfill-Pakete aus den 2010er Jahren sind damit überflüssig geworden.
In Projekten prüfen wir deshalb regelmäßig, ob eingebundene Polyfills noch jemandem nützen. Meist ist die Antwort nein, und ihr Wegfall macht die Seite messbar leichter.
Was ein Polyfill nicht kann
Fehlt dem Browser eine ganze Fähigkeit statt nur einer Funktion, hilft kein Nachbau. Eine Darstellungsfunktion in CSS lässt sich nicht in JavaScript nachbilden, ohne dass es auffällt.
Für solche Fälle ist der übliche Weg, eine einfachere Darstellung auszuliefern, die überall funktioniert, und die bessere dort zu zeigen, wo sie unterstützt wird.