100秒で理解するPolyfill
はじめに
この記事の内容は、以下の動画でも解説しているので、ぜひ見てみてください。他にもWebに関する解説動画を投稿しているので、良ければチャンネル登録よろしくお願いします！
Polyfillとは？
Polyfill とは、簡単に言うと、古いブラウザでサポートされていない機能を使えるようにするためのコードのことです。
ポリフィルとは、最近の機能をサポートしていない古いブラウザーで、その機能を使えるようにするためのコードです。大抵はウェブ上の JavaScript です。
...と言っても、これだと難しくてよく分からないですよね。そこで、今回の記事では「Polyfillとは何なのか？」について、100 秒でざっくりと解説していきたいと思います。
Polyfillの概要
例えば、開発中のプロジェクトで、JavaScript の Promise を使うことを想像してみましょう。
JavaScript の Promise は、現在ほとんどのブラウザで実装されている機能ですが、一部の古いブラウザではサポートされていないという問題があります。
では、古いブラウザでも Promise の動作を保証したいと思った場合、どうすれば良いでしょうか？
そこで登場するのが「Polyfill」です。
Polyfill は、古いブラウザでサポートされていない機能を使えるようにするためのコードのことで、例えば次のような JavaScript コードのことです。
Polyfill を用意するための方法は、主に次の2つがあります。
- 自分で置き換えるためのコードを書く
- ライブラリを使ってコードを読み込む
例えば Promise の場合、以下のようなライブラリがあります。
もし、適切な Polyfill を見つけるのが面倒であれば、Fastly や Cloudflare が提供している次のサービスを使うと、簡単に欲しい機能の Polyfill を読み込むことができます。
おわりに
「100秒で理解する」シリーズは、他にもいくつか記事を書いています。この記事が役に立ったと思った方は、他の記事もご覧ください！
Discussion