liveBook · Manning

Ponyfill

As explained in Web Components in Action

A compatibility implementation that provides a newer feature through an explicit library interface without modifying the host environment's native APIs.

A ponyfill makes an unsupported feature usable through an explicit library interface without adding or changing native APIs in the browser environment. Unlike a polyfill, it does not create matching globals such as customElements. section 12.5

Because it does not run automatically, application code must call the ponyfill. This makes the integration explicit, but it is not necessarily drop-in. section 12.5

Supporting CSS custom properties in IE11

Install css-vars-ponyfill, load it before the component script, and call cssVars() during component initialization. Existing CSS variables can then continue styling the component in IE11 without modifying the browser's native environment.

How Web Components in Action covers it

How deep it goes
Defines ponyfills by contrasting their environment behavior with polyfills, then demonstrates installation, loading, and invocation.
Examples
Uses css-vars-ponyfill, script tags, and a cssVars() call inside connectedCallback().
What it assumes
Assumes familiarity with browser features and component scripts, while introducing the polyfill-versus-ponyfill distinction directly.
What you can do after
Operate/configure CSS compatibility by installing, loading, and explicitly invoking a ponyfill during component initialization.
How it connects
Connects ponyfills with polyfills, CSS custom properties, Web Components, Custom Elements, and browser compatibility.
Cover of Web Components in Action
liveBookmanning.com
Read Web Components in Action on liveBook Get the book at manning.com

Related concepts

This explainer was generated by Manning's knowledge graph from the text of Web Components in Action. The section links point to the parts of the book it draws on.