Was ist der Unterschied zwischen einer Unterlegscheibe und einer Polyfüllung?

406

Beide scheinen in Webentwicklungskreisen verwendet zu werden, siehe z. B. HTML5 Cross Browser Polyfills , in dem es heißt:

Hier sammeln wir also alle Unterlegscheiben, Fallbacks und Polyfills ...

Oder es gibt das es5-shim- Projekt.

In meinem aktuellen Projekt verwenden wir eine Reihe davon, und ich möchte sie alle im selben Verzeichnis speichern. Also, wie soll ich dieses Verzeichnis nennen --- shimsoder polyfills?

Domenic
quelle
6
Wiedereröffnung: Ich nehme an, "wie soll ich dieses Verzeichnis nennen" könnte meinungsbasiert sein, aber es wird wirklich nicht der größere Kontext der Frage angegeben - noch ist dies der wichtigste Aspekt dieser Frage. Alle Antworten hier scheinen übereinzustimmen, und es werden in erheblichem Maße Fakten, Referenzen und spezifisches Fachwissen verwendet.
Nobar

Antworten:

386
  • Ein Shim ist ein beliebiger Code, der das Abfangen eines API-Aufrufs durchführt und eine Abstraktionsebene bereitstellt. Es ist nicht unbedingt auf eine Webanwendung oder HTML5 / CSS3 beschränkt.

  • Eine Polyfüllung ist eine Art Shim , mit dem ältere Browser mit modernen HTML5 / CSS3-Funktionen nachgerüstet werden, die normalerweise Javascript oder Flash verwenden.

shimsWenn Sie Ihre spezielle Frage beantworten, rufen Sie Ihr Verzeichnis an, wenn Sie das Verzeichnis allgemein halten möchten.

Arsalan Ahmed
quelle
234

Shim

Wenn Sie mit dem Adaptermuster vertraut sind, wissen Sie, was eine Unterlegscheibe ist. Shims fängt API-Aufrufe ab und erstellt eine abstrakte Ebene zwischen dem Aufrufer und dem Ziel. Typischerweise werden Ausgleichsscheiben für die Rückwärtskompatibilität verwendet. Mit dem Paket es5-shim npm können Sie beispielsweise die ECMAScript 5 (ES5) -Syntax schreiben und es ist Ihnen egal, ob auf dem Browser ES5 ausgeführt wird oder nicht. Nehmen Sie Date.now als Beispiel. Dies ist eine neue Funktion in ES5, bei der die Syntax in ES3 new Date (). GetTime () lautet . Wenn Sie es5-shim verwenden , können Sie Date.now schreiben. Wenn der Browser, in dem Sie ausgeführt werden, ES5 unterstützt, wird es nur ausgeführt. Wenn jedoch der Browser ausgeführt wird, fängt die ES3-Engine es5-shim den Aufruf von Date.now abund geben Sie stattdessen einfach new Date (). getTime () zurück . Dieses Abfangen wird Shimmen genannt. Der relevante Quellcode von es5-shim sieht folgendermaßen aus:

if (!Date.now) {
    Date.now = function now() {
        return new Date().getTime();
    };
}

Polyfill

Polyfilling ist eigentlich nur eine spezielle Version des Shimmens. Bei Polyfill geht es darum, fehlende Features in einer API zu implementieren, während es bei einem Shim nicht unbedingt darum geht, fehlende Features zu implementieren, sondern Features zu korrigieren. Ich weiß, dass dies zu vage erscheint, aber wo Shims als weiter gefasster Begriff verwendet werden, wird Polyfill verwendet, um Shims zu beschreiben, die für ältere Browser eine Abwärtskompatibilität bieten. Während Unterlegscheiben zum Vertuschen alter Sünden verwendet werden, werden Polyfills verwendet, um zukünftige Verbesserungen in die Vergangenheit zu bringen. Beispielsweise wird sessionStorage in IE7 nicht unterstützt, aber die Polyfüllung im sessionstorage npm-Paket fügt diese Funktion in IE7 (und älter) hinzu, indem Techniken wie das Speichern von Daten in der name-Eigenschaft des Fensters oder Cookies verwendet werden.

Kjetil Klaussen
quelle
107
Während Unterlegscheiben zum Vertuschen alter Sünden verwendet werden, werden Polyfills verwendet, um zukünftige Verbesserungen in die Vergangenheit zu bringen. Das fasst alles für mich zusammen. Vielen Dank für eine klare Erklärung.
JohnnyQ
Diese Antwort ist hilfreich, danke. Aber es scheint mir, dass die beiden Begriffe im Web oft nicht genau verwendet werden, einschließlich es5-shim. Ich denke, es5-shim ist nach Ihrer Definition eine Mischung aus Shims und Polyfills.
Matt Browne
WOW -> Während Unterlegscheiben zum Vertuschen alter Sünden verwendet werden, werden Polyfills verwendet, um zukünftige Verbesserungen in der Zeit zurückzubringen. <- Vielen Dank!
Zeppelin
3
Das Datumsbeispiel sieht für mich wie eine Polyfüllung aus. Warum denke ich, dass es eine Polyfüllung ist? Weil Date.now ein nativer Aufruf ist. Eine Polyfill fügt diese Funktion mit derselben API nahtlos zum Browser hinzu. Ein Shim wird mit einer neuen API geliefert wie: MyShim.Date.now(); Bitte korrigieren Sie mich, wenn ich falsch liege.
TatzyXY
99

Von dem, was ich verstehe:

Eine Polyfüllung ist Code, der erkennt, ob eine bestimmte "erwartete" API fehlt, und diese manuell implementiert. Z.B

if (!Function.prototype.bind) { Function.prototype.bind = ...; }

Ein Shim ist Code, der vorhandene API-Aufrufe abfängt und ein anderes Verhalten implementiert. Hier geht es darum, bestimmte APIs in verschiedenen Umgebungen zu normalisieren. Wenn also zwei Browser dieselbe API unterschiedlich implementieren, können Sie die API-Aufrufe in einem dieser Browser abfangen und das Verhalten an den anderen Browser anpassen. Wenn ein Browser einen Fehler in einer seiner APIs aufweist, können Sie erneut Aufrufe dieser API abfangen und den Fehler dann umgehen.

Šime Vidas
quelle
66

Unter Berufung auf Axel Rauschmayer aus seinem Buch Speaking JavaScript :

  • Ein Shim ist eine Bibliothek, die eine neue API in eine ältere Umgebung bringt und nur die Mittel dieser Umgebung verwendet.
  • Eine Polyfüllung ist ein Shim für eine Browser-API. In der Regel wird überprüft, ob ein Browser eine API unterstützt. Wenn dies nicht der Fall ist, installiert die Polyfüllung ihre eigene Implementierung. Auf diese Weise können Sie in beiden Fällen die API verwenden. Der Begriff Polyfill stammt von einem Heimwerkerprodukt. laut Remy Sharp :

    Polyfilla ist ein britisches Produkt, das in den USA als Spackling Paste bekannt ist. In diesem Sinne: Stellen Sie sich die Browser als eine Wand mit Rissen vor. Diese [Polyfills] helfen dabei, die Risse auszugleichen und geben uns eine schöne glatte Wand aus Browsern, mit denen wir arbeiten können.

Bergi
quelle
9

Shim. Ein Shim ist eine Bibliothek, die eine neue API in eine ältere Umgebung bringt und nur die Mittel dieser Umgebung verwendet.

Polyfill. Im Oktober 2010 bloggte Remy Sharp über den Begriff „Polyfill“ [über Rick Waldron]:

Eine Polyfüllung ist ein Code (oder Plugin), der die Technologie bereitstellt, die Sie als Entwickler vom Browser nativ erwarten. Reduzieren Sie die API-Landschaft, wenn Sie so wollen.

Schütze
quelle
8

Ein fantastischer Artikel, der vor einigen Jahren darüber geschrieben wurde und dies gut erklärt:

Was ist eine Polyfüllung?

In dem Artikel werden die (2) einfach als solche gegenübergestellt:

Shim: Ein Teil des Codes, den Sie hinzufügen könnten (dh JavaScript), der einige Funktionen behebt, aber meistens eine eigene API hat .

Polyfill: etwas, das Sie einfügen könnten (dh JavaScript) und das im Hintergrund funktioniert, um vorhandene Browser-APIs nachzuahmen , die ansonsten nicht unterstützt werden.

atconway
quelle
1
Ich denke, dies ist eine irreführende Darstellung sowohl der allgemeinen Verwendung als auch der Aussagen von Remy Sharp in einem Blog-Beitrag, auf den Sie verlinkt haben. Shim wird meist synonym verwendet mit Füllwatte heute (siehe insbesondere die ES5-Shim und es6-Shim ) und Remy ist insbesondere zu sagen , dass er das Wort ‚Shim‘ anspielte , um eine benutzerdefinierte API (im Vergleich shim.gif). Er diktiert nicht, dass die Wörter auf diese Weise verwendet werden, und indem er "zu mir" sagt , erkennt er stillschweigend an, dass sein Gebrauch nicht universell ist.
Mark Amery