Szybka pomoc

Ściągawka alternatyw dla Polyfill.io i wykrywania funkcji

Przewodnik ładowania polyfilli: ostrzeżenie bezpieczeństwa dotyczące ataku na łańcuch dostaw polyfill.io, zamiennik Cloudflare cdnjs i ładowanie warunkowe.

· Opublikowano

[!CAUTION] Krytyczne ostrzeżenie dotyczące łańcucha dostaw: Pierwotna domena polyfill.io została przejęta przez podmiot zewnętrzny i wykorzystana w atakach wstrzykiwania złośliwego oprogramowania. Natychmiast usuń wszelkie odwołania do polyfill.io ze wszystkich projektów produkcyjnych.

Bezpieczna alternatywa Cloudflare CDN

Cloudflare i cdnjs udostępniają odizolowane, zweryfikowane lustro biblioteki polyfill gotowe do bezpośredniego użycia:

<!-- Bezpieczny zamiennik dostarczany przez Cloudflare -->
<script src="https://cdnjs.cloudflare.com/polyfill/v3/polyfill.min.js"></script>

Warunkowe ładowanie funkcji

Aby uniknąć ładowania polyfilli w nowoczesnych przeglądarkach obsługujących natywnie ES6+, użyj wykrywania funkcji przed dodaniem tagu script:

<script>
  if (!(window.Promise && [].includes && Object.assign && window.Map)) {
    var script = document.createElement('script');
    script.src = 'https://cdnjs.cloudflare.com/polyfill/v3/polyfill.min.js';
    document.head.appendChild(script);
  }
</script>

Nowoczesne zalecane podejście: Core-JS i bundler

Współczesny frontend dołącza polyfille podczas kompilacji (przez Vite, Webpack lub Babel) zamiast ładować zewnętrzne skrypty w czasie działania:

npm install core-js

W pliku wejściowym aplikacji (index.js):

import 'core-js/stable';

Źródła

Powiązane tematy