Qual è il significato dei polyfill in HTML5?


387

Qual è il significato dei polyfill in HTML5? Ho visto questa parola in molti siti su HTML5, ad esempio HTML5-Cross-Browser-Polyfills.

Quindi qui stiamo raccogliendo tutti gli spessori, fallback e polyfill per impiantare la funzionalità HTML5 nei browser che non li supportano in modo nativo.

In realtà non ho capito qual è il significato dei polifilloli.

È una nuova tecnica HTML5 o una libreria JavaScript? Non ho mai sentito questa parola prima di HTML5.

E qual è la differenza tra spessori, fallback e polyfill?


1
Puoi verificare per una migliore comprensione blogs.msdn.com/b/jennifer/archive/2011/08/04/…

@ user3400622 Grazie per il link, la spiegazione nel link è molto chiara.
Andrew Lam,

Risposte:


377

Un polyfill è un fallback del browser, realizzato in JavaScript, che consente alle funzionalità che ci si aspetta di lavorare nei browser moderni di funzionare nei browser più vecchi, ad esempio per supportare il canvas (una funzione HTML5) nei browser più vecchi.

È una specie di tecnica HTML5, poiché viene utilizzata insieme a HTML5, ma non fa parte di HTML5 e puoi avere polyfill senza HTML5 (ad esempio, per supportare le tecniche CSS3 che desideri).

Ecco un buon post:

http://remysharp.com/2010/10/08/what-is-a-polyfill/

Ecco un elenco completo di Polyfill e spessori:

https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-browser-Polyfills


6
Quindi significa che ie7.js è anche un polyfill
Jitendra Vyas,

1
Sì: "Molte correzioni tra cui trasparenza PNG, stili / selettori CSS, rendering correzioni di bug, ecc." Sta aggiungendo questa funzionalità tramite javascript che il browser non supporta già.
Calvin Froedge,

1
Penso che la parola Polyfills sia apparsa dopo HTML5. Lo spessore è diverso da Polyfill?
Jitendra Vyas,

16
Uno spessore è più generalizzato. Un polyfill è un tipo di spessore. Ecco una domanda che spiega bene: stackoverflow.com/questions/6599815/...
Calvin Froedge

6
remysharp.com/2010/10/08/what-is-a-polyfill questo link è più di un semplice "buon post", in realtà è la definizione completa e l'origine della parola da parte della persona che ha coniato la parola. Estratto: "il prodotto Polyfilla (spackling negli Stati Uniti) è una pasta che può essere applicata alle pareti per coprire crepe e buchi". Il post copre anche il concetto che lo shim precede ed è diverso dal polyfill. È assolutamente da leggere, IMO.
codifica in aaron il

64

Prima di tutto chiariamo cosa non è un polyfil: un polyfill non fa parte dello standard HTML5. Né un polyfill è limitato a Javascript, anche se spesso si vedono riferimenti a polyfill in questi contesti.

Il termine stesso polyfill si riferisce ad un codice che "ti consente di avere alcune funzionalità specifiche che ti aspetti nei browser attuali o" moderni "per funzionare anche in altri browser che non hanno il supporto per quella funzionalità integrata."

Fonte ed esempio di polyfill qui:

http://www.programmerinterview.com/index.php/html5/html5-polyfill/


31

Un polyfill è un pezzo di codice (o plugin) che fornisce la tecnologia che tu, lo sviluppatore, ti aspetti che il browser fornisca in modo nativo.


2
Ben spiegato.
Eugen Sunic,

16

Un polyfill è uno spessore che sostituisce la chiamata originale con la chiamata a uno spessore.

Ad esempio, supponiamo che tu voglia utilizzare l'oggetto navigator.mediaDevices, ma non tutti i browser lo supportano. Potresti immaginare una libreria che fornisca uno spessore che potresti usare in questo modo:

<script src="js/MediaShim.js"></script>
<script>
    MediaShim.mediaDevices.getUserMedia(...);
</script>

In questo caso, si chiama esplicitamente uno shim invece di utilizzare l'oggetto o il metodo originale. Il polyfill, d'altra parte, sostituisce gli oggetti e i metodi sugli oggetti originali.

Per esempio:

<script src="js/adapter.js"></script>
<script>
    navigator.mediaDevices.getUserMedia(...);
</script>

Nel tuo codice, sembra che tu stia usando l'oggetto navigator.mediaDevices standard. Ma davvero, il polyfill (adapter.js nell'esempio) ha sostituito questo oggetto con il suo.

Quello con cui lo ha sostituito è uno spessore. Questo rileverà se la funzionalità è supportata in modo nativo e la userà se lo è, oppure funzionerà usando altre API se non lo è.

Quindi un polyfill è una sorta di spessore "trasparente". E questo è ciò che Remy Sharp (che ha coniato il termine) intendeva quando diceva " se si rimuoveva lo script polyfill, il codice continuerebbe a funzionare, senza che siano necessarie modifiche nonostante la rimozione del polyfill ".


9
che cos'è uno spessore?
Oliver Watkins,

3
@Oliver Watkins Se hai familiarità con il modello di adattatore, allora sai cos'è uno spessore. Shims intercetta le chiamate API e crea un livello astratto tra il chiamante e la destinazione. In genere gli spessori vengono utilizzati per la compatibilità con le versioni precedenti
Anurag Ratna,

@AnuragRatna Non userei 'intercetta' per evitare confusione. L'intercettazione di solito si riferisce al codice che (in modo trasparente) intercetta, cioè senza che il chiamante lo sappia. Gli shim forniscono chiamate API per la compatibilità con le versioni precedenti
Qetesh
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.