IE11 対応をやめることで得られるメリット

f:id:ishiyu1125:20201222114120p:plain

こんにちは。石田( @ishiyu )です。

今回は、弊社サービスRe:lation のIE11対応終了を受けて、IE11対応を終了することでエンジニア視点で得られるメリットを紹介したいと思います。

1. WebP対応

個人的に一番大きいのは、これかなと感じています。

WebP は、Google が開発した新たな画像形式です。Edge, Firefox, Chrome, Safari の最新版ではすでに対応されており、従来の画像形式と比べてもかなり容量を抑えられます。

ja.wikipedia.org

また、IE11 ではPNG画像などにフォールバックする必要があり(帯域が狭い環境では)画像がなかなか表示されないなどの問題があるため、使用するユーザのメリットも大きいと思います。

2. CSS (::placeholder 擬似クラス)

CSS は「::placeholder 擬似クラス」がなかったので、一番辛く感じてました。よくカスタムプロパティがないという記事を見かけるのですが、SCSS(SASS)を使っていたため、自分は困ったことがありませんでした。
それに対して、::placeholder 擬似クラスはテキストボックスなどのプレースホルダーをデザインするために必要なセレクタで、これを代替しようと思うと JavaScript と組み合わせて実装せざるおえません。 幸い Re:lation で使用する機会はなかったのですが、もし対応しようと思うと非常に大変だったと思います。

CSS のその他の変更点はこちらです。
https://caniuse.com/?compare=ie+11,edge+87&compareCats=CSS

3. JavaScript (Promise)

JavaScript に関してはアロー関数や Array.find、fetch など他にもありますが、JavaScript の中で一番大きい影響は Promise と思っています。Promise は非同期ライブラリを入れれば解決する話ですが、わざわざ標準で対応されているものを今から入れることは、長い目で見ると技術的負債になります。

もちろん、Babel などを導入していれば、コードを記述する際にはあまり気にすることはほぼありません。 しかし、IE11対応を行うことでビルド時間や生成されるコード量がどうしても増えるので、開発中のビルド待ち時間が長くなり、スムーズな開発がしにくくなるデメリットもあります。(core-jsのメンテナの zloirock さんが無事に帰ってこれてホントよかった)

JavaScript のその他の変更点はこちらです。
https://caniuse.com/?compare=ie+11,edge+87&compareCats=JS

さいごに

色々書きましたが、ホントの一番大きいメリットはこれらを常に意識する必要がなくなるということではないでしょうか。 この運用コストはバカにならないと思っています。

IE11対応終了は、いろいろなお客様へサービスを提供するということとは相反することではありますが、新しい機能をよりスムーズに提供することで理解を得られるように、これからも頑張っていきたいと思います。