# Kas ir polifilli?

**Polyfills** ir koda komponenti, kas padara jaunākas tīmekļa funkcijas lietojamas pārlūkprogrammās, kuras šādas funkcijas neatbalsta. Šajā rakstā ir izskaidrots, kas ir šie praktiskie **koda komponenti** un kā tos var izmantot.

## Kas ir polyfills un kādās valodās tos var rakstīt?

Polyfill, ko dažkārt sauc arī par Polyfiller, ir dažādas sarežģītības koda bloks, kas padara mūsdienīgas HTML, CSS vai JavaScript funkcijas pieejamas vecākās pārlūkprogrammās, kuras tās nespēj atbalstīt. Lielākā daļa polyfill ir rakstīti JavaScript, tomēr arī citas tīmekļa programmēšanas valodas var kalpot par pamatu aizpildīšanas skriptiem. Dažas no svarīgākajām funkcijām, ko polyfill padara pieejamas dažādās tīmekļa pārlūkprogrammās, ir HTML5 komponenti, piemēram, bitmap balstīti canvas elementi grafikai, diagrammām un animācijām.

Note Termins „polyfill” ir cēlies no populārā britu zīmola Polyfilla, kas ir pildviela renovācijas un restaurācijas darbiem. Tīmekļa izstrādātājs Remy Sharp saskatīja atbilstošu salīdzinājumu starp **pildvielu** un šiem noderīgajiem **apvedceļu kodiem**, jo abu mērķis ir aizpildīt robus. Pēdējā gadījumā aizpildāmie robus ir robus pārlūka funkcionalitātē. Šis jēdziens tika ieviests Sharp 2009. gada grāmatā ***„Introducing HTML5”***, ko viņš sarakstīja kopā ar Bruce Lawson. Polyfill vēlāk kļuva par oficiālo nosaukumu šādiem koda komponentiem.

## Kādi ir polifilu veidi?

Tas, ka termins „polyfill” ir cieši saistīts ar **HTML5**, nav nejaušība. Ar savām uzlabotajām funkcijām, kas, cita starpā, padarījušas flash video nepieciešamību *par pagātni*, piektā versija hiperteksta atzīmējumu valodai ir kļuvusi par pastāvīgu tīmekļa funkciju. Tomēr **atbalsts HTML5 pārlūkprogrammās** ir attīstījies diezgan lēni. Papildus polyfill, kas izveidots HTML5 elementiem, **polyfill koda bloki** tiek izmantoti arī, lai integrētu šādus tīmekļa elementus:

- **SVG grafika**: SVG formāts SVG (**Scalable** **Vector** **Graphics**), ko W3C konsorcijs 2001. gadā sāka ieteikt kā standarta formātu vektorgrafikai, vispirms ieguva popularitāti ar HTML5. Taču, tā kā daudzas pārlūkas vēl nesniedz atbalstu šim formātam, ir pieejami SVG polyfills, piemēram, [svgweb](https://code.google.com/archive/p/svgweb/ "Google Code Archive: svgweb polyfill").
- **ECMAScript**: ECMAScript ir standartizēts JavaScript kodols, kas tiek regulāri atjaunināts, lai paplašinātu valodas funkcionalitāti. Funkcijas, piemēram, Promise objekti vai Symbol funkcijas, vecākās pārlūkprogrammās ir pieejamas, izmantojot polyfills, piemēram, JavaScript standarta bibliotēku [core-js](https://github.com/zloirock/core-js "JavaScript library core-js GitHub site").
- **Tīmekļa uzglabāšana**: sīkdatņu alternatīvas, piemēram, **vietējā uzglabāšana** (ilgtermiņa uzglabāšana klienta pusē) un **sesijas uzglabāšana** (uzglabāšana, kas ierobežota ar pašreizējo sesiju), kopā pazīstamas kā tīmekļa uzglabāšana vai DOM uzglabāšana, netiek atbalstītas visās pārlūku versijās. MIT licencētais [webstorage-polyfill](https://github.com/Macil/webstorage-polyfill "webstorage-polyfill on github.com") ir labi pazīstams risinājums šai problēmai.
- **Cross-Origin Resource Sharing (CORS)**: CORS ļauj tīmekļa lietojumprogrammām piekļūt tīmekļa resursiem, kas atrodas ārpus paša servera. Daudzas vecākas pārlūkas neatbalsta šo datu apmaiņu. JavaScript pakete [XDomain](https://github.com/jpillora/xdomain "github.com: XDomain") un CORS polyfill [XHook](https://github.com/jpillora/xhook "GitHub index of CORS XHook polyfill") var palīdzēt risināt šo problēmu.
- **CSS (Cascading Style Sheets)**: gadiem ilgi CSS ir bijis viens no svarīgākajiem rīkiem tīmekļa vietņu vizuālā izkārtojuma veidošanai. Laika gaitā stilu lapas ir kļuvušas daudzfunkcionālākas, padarot polyfills populārus saskarnē ar vecākām pārlūkprogrammām. Viens no pazīstamākajiem rīkiem ir [css-polyfills.js](https://philschatz.com/css-polyfills.js/ "css-polyfills.js on philschatz.com").
- **Ģeolokācija**: ilgu laiku ģeolokācijas API (ko izmanto, lai pārraidītu lietotāja atrašanās vietu) netika atbalstīts pārlūkprogrammās un to varēja izmantot tikai ar papildu pārlūkprogrammas spraudņa palīdzību. Ar polyfill jūs varat nodrošināt šo funkcionalitāti lietotājiem ar vecākām pārlūkprogrammu versijām, kas neatbalsta API.

Note Lai vienkāršotu un optimizētu polifilu izmantošanu, tādi pakalpojumi kā Polyfill.io projekts izmanto satura piegādes tīklus (CDN), lai piegādātu skriptus. Tomēr kopš 2024. gada sākuma ir bijušas būtiskas problēmas ar **ļaunprogrammatūru, kas tiek izplatīta caur Polyfill.io izmantotajiem CDN**. Ja izmantojat šo pakalpojumu, jums no savas tīmekļa vietnes jāizdzēš jebkurš kods, kas ir no Polyfill.io projekta.

## Kā tiek izmantoti polifili? (Iekļauti koda piemēri)

Jūs varat tieši ievietot polyfill JavaScript kodu vai polyfill skriptus tīmekļa vietnes HTML dokumentā. Tie **nevainojami integrējas esošajā avota kodā** un tiek izpildīti tikai tad, ja pārlūks neatbalsta konkrēto tīmekļa funkciju. Parasti to dara, izmantojot JavaScript `if`, lai pārbaudītu trūkstošo atbalstu. Atbalsta trūkums var tikt pārvērsts par nosacījumu skripta aktivizēšanai. Turpmākajos divos piemēros mēs parādīsim, kā to īstenot, un parādīsim, kā izskatās **polyfill vispārējā struktūra**.

### 1. piemērs: Polyfill JavaScript metodei `startsWith()`

```javascript
if (!String.prototype.startsWith) {
    String.prototype.startsWith = function (searchString, position) {
        position = position || 0;
        return this.indexOf(searchString, position) === position;
    };
}
```

Šis nelielais JavaScript fragments ļauj izsaucējam pārlūkprogrammai izmantot `startsWith()` metodi, pat ja tā to neatbalsta. Šī metode, kas ir daļa no ECMAScript 6 specifikācijas, pārbauda, vai **virkne sākas ar cita virknes rakstzīmi vai rakstzīmju virkni**. Ja tā ir, tā atgriež ‘true’, citādi tā atgriež ‘false’. Sarežģītāku, optimizētu versiju `startsWith()` integrēšanai varat atrast [GitHub lapā, ko izveidojis izstrādātājs Mathias Bynens](https://github.com/mathiasbynens/String.prototype.startsWith "GitHub page: mathiasbynens").

Note Šeit norādītais kods nedarbosies, ja tīmekļa klients bloķē JavaScript vai tā iestatījumos ir atspējota skriptu valoda.

### 2. piemērs: tīmekļa uzglabāšanas polyfill

Šis JavaScript polyfill ir vienkāršs kodēšanas risinājums, kas padara vietējo un sesijas uzglabāšanu pieejamu vecākos pārlūku modeļos.

```javascript
if (typeof window.localStorage === 'undefined' || typeof window.sessionStorage === 'undefined') {
    (function () {
        var data = {};
        var Storage = function (type) {
            function setData() {
                // Implement the logic to set data into storage
                var storageData = JSON.stringify(data);
                document.cookie = type + '=' + storageData + ';path=/';
            }
            function clearData() {
                data = {};
                setData();
            }
            return {
                length: 0,
                clear: function () {
                    clearData();
                    this.length = 0;
                },
                getItem: function (key) {
                    return data[key] === undefined ? null : data[key];
                },
                key: function (i) {
                    var ctr = 0;
                    for (var k in data) {
                        if (ctr == i) return k;
                        ctr++;
                    }
                    return null;
                },
                removeItem: function (key) {
                    delete data[key];
                    this.length--;
                    setData();
                },
                setItem: function (key, value) {
                    data[key] = value + '';
                    this.length++;
                    setData();
                }
            };
        };
        // Set the local and session storage properties inside the window object
        if (typeof window.localStorage === 'undefined') window.localStorage = new Storage('local');
        if (typeof window.sessionStorage === 'undefined') window.sessionStorage = new Storage('session');
    })();
}
```

Iepriekš minētais kods ir **tūlītēji** **izsaucama** **funkciju** **izteiksme**(IIFE). Pirms pārlūks to ielādē, pirmās rindas kodā esošā `if` komanda pārbauda, vai klients nativitāti atbalsta tīmekļa uzglabāšanas tehnoloģijas. Ja atbalsta, `if` izteiksme atgriezīs nepatiesu vērtību, jo vietējās un sesijas uzglabāšanas tipi jau ir definēti. Rezultātā polyfill tiek izmests.


This is a markdown version of: [https://www.ionos.com/lv-lv/digitalguide/timekla-vietnes/timekla-izstrade/polifils/](https://www.ionos.com/lv-lv/digitalguide/timekla-vietnes/timekla-izstrade/polifils/) for AI/LLM consumption.