Polyfill Service sorgt für leichtere Nutzung von Polyfills
Kommentare

Wenn man sich einmal Statistiken zur Browser-Verbreitung anschaut, fällt auf, dass nach wie vor ältere Browser-Versionen weit verbreitet sind. Da sich Web-Technologien jedoch stetig weiterentwickeln und sie häufig nicht von Legacy-Browsern unterstützt werden, ist der Einsatz von Polyfills fast unumgänglich – immerhin kann so moderner Code eingesetzt werden, ohne auf den Support von Legacy-Browsern verzichten zu müssen.

Doch die Nutzung von Polyfills stellt Entwickler häufig vor eine Herausforderung. Andrew Betts, der Direktor von FT Labs, hat mit seinem Team darum einen neuen Service entwickelt, um die Arbeit mit Polyfills zu vereinfachen und stellt diese im Mozilla Entwickler-Blog vor.

Die Herausforderungen von Polyfills

Zwar sind Polyfills eine gute Möglichkeit, den Support von älteren Browsern sicherzustellen, während gleichzeitig moderner Code verwendet wird, allerdings ist deren Nutzung nicht ganz einfach und kann einige Schwierigkeiten mit sich bringen.

So können Entwickler nicht immer wissen oder feststellen, welche Features mit einem Polyfill versehen werden müssen – insbesondere, weil Legacy-Browser meist keine guten Developer Tools mit sich bringen und es sich so schlecht feststellen lässt, welches Feature ein Problem verursacht. Zudem gibt es meist mehrere Polyfills für das gleiche Feature, und nicht immer emulieren alle dieses zuverlässig.

Auch dass einige Polyfills nur in einem Bundle verfügbar sind, aus dem oft nicht alle Polyfills benötigt werden, kann zu einem Problem werden. Dazu kommt, dass moderne Browser normalerweise keine Polyfills benötigen, sie aber trotzdem mit ihnen versorgt werden, um die Kompatibilität mit Legacy-Browsern zu erhöhen – meist zu Lasten der Performance moderner Browser.

Wie der Polyfill Service funktioniert

Um diese Probleme bei der Nutzung von Polyfills zu minimieren, hat FT Labs an einem Polyfill Service gearbeitet. Dabei handelt es sich um ein Script, das in die Website eingebunden wird und ein Default-Polyfill-Set lädt, das die gängigsten Features moderner Webentwicklung enthält.

Anschließend analysiert der Service den User-Agent-Header des Browsers sowie eine Liste angeforderter Features und erstellt so eine Liste von Polyfills, die für den entsprechenden Browser nötig sind. Diese wird zudem in der richtigen Dependency-Reihenfolge angeordnet. Diese User-Agent-Analyse ist zum Beispiel nützlich, um die richtige Variante des Polyfills zu ermitteln, wenn es mehrere Polyfill-Optionen für das fehlende Feature gibt.

Abschließend wird das Bundle minified und mittels eines CDNs ausgegeben. Das so geladene Default-Polyfill-Set deckt normalerweise alle gängigen Features, die ein Polyfill benötigen, ab; es gibt jedoch auch die Möglichkeit, benötigte Features individuell zu spezifizieren.

Zur Verfügung steht der Polyfill-Service einerseits über GitHub oder über die Polyfill-Service-Website. Dort finden sich auch einige auch einige Live-Beispiele für die Nutzung.

Aufmacherbild: Two metal cog gears together on white background von Shutterstock / Urheberrecht: nayladen

Unsere Redaktion empfiehlt:

Relevante Beiträge

Meinungen zu diesem Beitrag

X
- Gib Deinen Standort ein -
- or -