Полифилл (программирование)

В разработке программного обеспечения полифил — это код, реализующий функцию среды разработки , которая не поддерживает эту функцию изначально. Чаще всего это относится к коду JavaScript , который реализует HTML5 или CSS веб-стандарт : либо установленный стандарт (поддерживается некоторыми браузерами) в старых браузерах, либо предлагаемый стандарт (не поддерживается ни одним браузером) в существующих браузерах. Полифиллы также используются в PHP и Python . ^[1]

Полифиллы позволяют веб-разработчикам использовать API независимо от того, поддерживается ли он браузером, и обычно с минимальными издержками. Обычно они сначала проверяют, поддерживает ли браузер API, и используют его, если он доступен, в противном случае используют собственную реализацию. ^[2]^[3] Сами полифиллы используют другие, более поддерживаемые функции, поэтому для разных браузеров могут потребоваться разные полифиллы. Этот термин также используется как глагол: полизаполнение — это предоставление полизаполнения для функции.

Определение

Этот термин представляет собой неологизм , придуманный Реми Шарпом, который потребовал слово, означающее «реплицировать API с использованием JavaScript (или Flash или чего-то еще), если браузер не имеет его изначально», когда он был соавтором книги « Введение в HTML5» в 2009 году. ^[4]^[5] Формально «прокладка — это библиотека , которая переносит новый API в старую среду, используя только средства этой среды». ^[2] Полифилы точно соответствуют этому определению; термин «шим» также использовался для обозначения ранних полифилов. ^[6] Однако для Sharp shim подразумевались непрозрачные API и обходные пути, такие как разделительные GIF-файлы для макета, иногда называемые shim.gifи подобные термины, такие как прогрессивное улучшение и постепенное ухудшение, были неуместны, поэтому он изобрел новый термин. ^[5] Этот термин основан на многоцелевой заполняющей пасте марки Polyfilla , пасте, используемой для маскировки трещин и дыр в стенах, и означает «заполнять дыры (в функциональности) разными ( поли- ) способами». С тех пор это слово приобрело популярность, особенно благодаря его использованию Полом Айришем и в Modernizr . документации ^[5]^[7]

Различие, которое делает Шарп, заключается в следующем: ^[4]

Что отличает полифилл от уже используемых нами методов, таких как прокладка, так это: если вы удалили сценарий полифилла, ваш код продолжит работать без каких-либо изменений, несмотря на удаление полифилла.

Это различие не проводится другими авторами. ^[2] Иногда между прокладками, полифилами и резервными вариантами проводятся различные другие различия, но общепринятых различий не существует: большинство считают полифилы формой прокладки. ^[8] термин полифиллер . Иногда также встречается ^[9]

Примеры

ядро-js

ядро-js ^[10] является одним из самых популярных ^[11] JavaScript стандартной библиотеки Полифилы . Включает полифилы для ECMAScript до последней версии стандарта: обещания, символы, коллекции, итераторы, типизированные массивы, многие другие функции, предложения ECMAScript, некоторые кроссплатформенные WHATWG / W3C , такие как функции и предложения URL. Вы можете загружать только необходимые функции или использовать их без загрязнения глобального пространства имен. Его можно интегрировать с Babel , что позволяет ему автоматически внедрять необходимые модули core-js в ваш код.

HTML5 Шив

В версиях IE до 9 неизвестные элементы HTML, такие как <section> и <nav> будут анализироваться как пустые элементы, что нарушит структуру вложенности страницы и сделает невозможным стилизацию этих элементов с помощью CSS . Один из наиболее широко используемых полифилов, html5shiv. ^[а] для обхода этой ошибки использует еще одну особенность IE: вызов document.createElement("tagname") для каждого из новых элементов HTML5, что позволяет IE правильно их анализировать. Он также включает базовые стили по умолчанию для этих элементов HTML5.

-без префиксов

Хотя большинство полифилов ориентированы на устаревшие браузеры, некоторые существуют просто для того, чтобы немного подтолкнуть современные браузеры вперед. Полифил -prefix-free Леа Веру является таким полифилом, позволяющим современным браузерам распознавать версии без префиксов нескольких свойств CSS3 вместо того, чтобы требовать от разработчика выписывать все префиксы поставщиков. Он считывает таблицы стилей страницы и заменяет все свойства без префиксов их аналогами с префиксами, распознаваемыми текущим браузером.

Селективизр

Selectivizr Кейта Кларка — это популярный полифил, благодаря которому многие селекторы CSS3 работают в IE 8 и более ранних версиях. Он считывает таблицы стилей страницы в поисках ряда известных селекторов CSS3, затем использует библиотеку селекторов JavaScript для запроса в документе элементов, соответствующих этим селекторам, применяя стили непосредственно к этим элементам. Он поддерживает несколько библиотек выбора JavaScript, таких как jQuery .

КУЛОН

Возможно, одна из самых ожидаемых функций CSS3, Flexible Box Layout (также известная как Flexbox), обещает стать чрезвычайно мощным инструментом для размещения элементов интерфейса. Движки WebKit и Mozilla уже много лет поддерживают предварительный проект синтаксиса. Flexie реализует поддержку того же синтаксиса в IE и Opera. Однако черновой вариант спецификации подвергся радикальному пересмотру с использованием нового (и гораздо более мощного) синтаксиса, который еще не поддерживается Flexie. Flexie по-прежнему можно использовать вместе со старым синтаксисом, но разработчик должен убедиться, что новый синтаксис включен и в будущие браузеры.

CSS3-пирог

PIE («Прогрессивный Internet Explorer») реализует некоторые из наиболее популярных свойств оформления блоков CSS3, отсутствующих в IE, включая border-radius и box-shadow для IE 8 и ниже, а также фон с линейным градиентом для IE 9 и ниже. Вызванный как поведение HTC (собственная функция IE), он ищет неподдерживаемые свойства CSS3 в определенных элементах и визуализирует эти свойства, используя VML для IE 6–8 и SVG для IE 9. Его рендеринг по большей части неотличим от собственных реализаций браузера, и он хорошо обрабатывает динамическую модификацию DOM.

JSON 2

Дуглас Крокфорд изначально написал json2.js как API для чтения и записи своего (тогда многообещающего) формата данных JSON . Он стал настолько широко использоваться, что производители браузеров решили реализовать его API изначально и превратить его в де-факто стандарт ; Поскольку json2.js теперь реализует функции, присущие новым браузерам, в старых браузерах, он стал полифиллом, а не библиотекой.

es5-shim

ECMAScript 5th Edition («ES5») содержит некоторые новые полезные функции сценариев, и, поскольку они синтаксически совместимы со старыми движками JavaScript, их в основном можно дополнить путем внесения исправлений в методы во встроенные объекты JS. Этот полифил es5-shim состоит из двух частей: es5-shim.js содержит те методы, которые могут быть полностью заполнены полифилом, а es5-sham.js содержит частичные реализации других методов, которые слишком сильно полагаются на базовый движок для точной работы.

FlashCanvas

FlashCanvas — это реализация HTML5 Canvas API с использованием Adobe Flash подключаемого модуля . Редкий коммерческий полифилл, он поставляется в платной версии, а также в бесплатной версии, в которой отсутствуют некоторые расширенные функции, такие как тени.

МедиаЭлемент.js

Поддержка полифилов MediaElement.js Джона Дайера для <video> и <audio> элементы, включая HTML5 MediaElement API, в старых браузерах с использованием подключаемых модулей Flash или Silverlight. Он также предоставляет дополнительный пользовательский интерфейс медиаплеера для этих элементов, который единообразен во всех браузерах.

Polyfill.io

Библиотека JavaScript, созданная Эндрю Беттсом, в которой реализован Polyfill. В феврале 2024 года домен библиотеки был приобретен китайской компанией Funnull и через несколько месяцев стал частью атаки на цепочку поставок . ^[12]^[13]

идентификатор браузера

Протокол аутентификации, предложенный Mozilla, не получил поддержки. ^[14]

Вебшимс Либ

Библиотека Webshims Александра Фаркаса объединяет множество других полифилов в один пакет и условно загружает только те, которые необходимы посещающему браузеру.

Гифенополия.js

Hyphenopoly.js включает автоматическую расстановку переносов , если она еще не поддерживается браузером для соответствующего языка документа. ^[15]

См. также

Примечания

^ Использование термина «шив» здесь является каламбуром или ошибкой в отношении «шим». ^[4]

Ссылки

^ Тормайер, Паскаль (9 июня 2023 г.). Освоение CSS Grid: комплексное и практическое руководство по созданию красивых макетов с помощью CSS Grid . Packt Publishing Ltd. с. 195. ИСБН 978-1-80461-616-1 .
^ Перейти обратно: ^а ^б ^с Луис Анхель Перес Кастильо (2019). Говоря о JavaScript .
^ «Обычно он проверяет, поддерживает ли браузер API. Если нет, полифилл устанавливает свою собственную реализацию. Это позволяет вам использовать API в любом случае».
^ Перейти обратно: ^а ^б ^с Брюс Лоусон; Реми Шарп. «Знакомство с полифилами». Представляем HTML5 . стр. 276–277 .
^ Перейти обратно: ^а ^б ^с Шарп, Реми (8 октября 2010 г.). «Что такое полифил?» . Проверено 13 января 2012 г.
^ Ян Хиксон (23 января 2008 г.). «Ошибки, Печаль, Сожаление» . Эта информация значительно упрощает создание прокладки совместимости HTML5 для IE7, чем предполагалось ранее.
^ «Кросс-браузерные полифилы HTML5» . Гитхаб . Архивировано из оригинала 28 сентября 2010 г.
^ «В чем разница между прокладкой и полифилом?» .
^ Чак Хадсон; Том Ледбеттер (2011). Поваренная книга разработчика HTML5 . п. 121 .
^ «Core-js» . Гитхаб . 26 октября 2021 г.
^ «Airbnb-js-shims против core-js против core-js-pure против es5-shim против es6-shim против js-polyfills против библиотеки полифиллов против полифилл-сервиса | Тенденции NPM» .
^ Гудин, Дэн (3 июля 2024 г.). «384 000 сайтов извлекают код из библиотеки схематичных кодов, недавно купленной китайской фирмой» . Арс Техника . Проверено 03 июля 2024 г.
^ «Атака Polyfill.io заразила более 110 000 веб-сайтов — Spiceworks» . Компания Спайсворкс Инк . Проверено 1 июля 2024 г.
^ "navigator.id" . Сеть разработчиков Mozilla. 30 июня 2012 года. Архивировано из оригинала 3 августа 2012 года . Проверено 9 июля 2012 года .
^ «Гифенополия.js» . Гитхаб . 25 сентября 2022 г.

Внешние ссылки

«Список полифилов, предоставляющих возможности HTML5» . GitHub: Modernizr . проект
Маниан, Дивья; Ирландец, Пол ; Браньен, Тим; Монтгомери, Коннор; Верчаево, Артур; и др. (ред.). «Список полифилов HTML5 по функциям» . HTML5 Пожалуйста . Рекомендации... представляют собой коллективные знания разработчиков, которые глубоко разбираются в HTML5.
«Что такое PolyFill в Javascript?» . Подробнее о немногих . 5 сентября 2013 г.

[12] Использование термина «шив» здесь является каламбуром или ошибкой в отношении «шим». ^[4]

[1] Тормайер, Паскаль (9 июня 2023 г.). Освоение CSS Grid: комплексное и практическое руководство по созданию красивых макетов с помощью CSS Grid . Packt Publishing Ltd. с. 195. ИСБН 978-1-80461-616-1 .

[speakingjs-2] Перейти обратно: ^а ^б ^с Луис Анхель Перес Кастильо (2019). Говоря о JavaScript .

[3] «Обычно он проверяет, поддерживает ли браузер API. Если нет, полифилл устанавливает свою собственную реализацию. Это позволяет вам использовать API в любом случае».

[introducing276-4] Перейти обратно: ^а ^б ^с Брюс Лоусон; Реми Шарп. «Знакомство с полифилами». Представляем HTML5 . стр. 276–277 .

[sharp2010-5] Перейти обратно: ^а ^б ^с Шарп, Реми (8 октября 2010 г.). «Что такое полифил?» . Проверено 13 января 2012 г.

[6] Ян Хиксон (23 января 2008 г.). «Ошибки, Печаль, Сожаление» . Эта информация значительно упрощает создание прокладки совместимости HTML5 для IE7, чем предполагалось ранее.

[7] «Кросс-браузерные полифилы HTML5» . Гитхаб . Архивировано из оригинала 28 сентября 2010 г.

[8] «В чем разница между прокладкой и полифилом?» .

[9] Чак Хадсон; Том Ледбеттер (2011). Поваренная книга разработчика HTML5 . п. 121 .

[10] «Core-js» . Гитхаб . 26 октября 2021 г.

[11] «Airbnb-js-shims против core-js против core-js-pure против es5-shim против es6-shim против js-polyfills против библиотеки полифиллов против полифилл-сервиса | Тенденции NPM» .

[13] Гудин, Дэн (3 июля 2024 г.). «384 000 сайтов извлекают код из библиотеки схематичных кодов, недавно купленной китайской фирмой» . Арс Техника . Проверено 03 июля 2024 г.

[14] «Атака Polyfill.io заразила более 110 000 веб-сайтов — Spiceworks» . Компания Спайсворкс Инк . Проверено 1 июля 2024 г.

[15] "navigator.id" . Сеть разработчиков Mozilla. 30 июня 2012 года. Архивировано из оригинала 3 августа 2012 года . Проверено 9 июля 2012 года .

[16] «Гифенополия.js» . Гитхаб . 25 сентября 2022 г.

[1]

[2]

[3]

[4]

[5]

[6]

[7]

[8]

[9]

[10]

[11]

[а]

[12]

[13]

[14]

[15]