Lighthouse で画像フォーマット (webp) で怒られるんですが...

[wadackel]

質問をしたいAMAブース

• Web Payments / Payment Request API について何でも訊いて下さい by えーじ
• AbemaTVだけど質問ある？（AbemaTV関係ない質問でもいいです）by Kenichi Kato, Tetsuharu OHZEKI, and Shota Kubota
• 日経電子版の高速化について何でも聞いてください by sisidovski and cssradar
• Fastly のエッジクラウドについて何でも聞いてください by Fastly
• Web パフォーマンスについて何でも訊いて下さい by Ayumu Sato and Shogo Sensui
• freeeのアクセシビリティ、いまとこれから by 伊原 力也
• 現場の ES201x とアーキテクチャの変遷と未来 by mizchi
• デザインとエンジニアリングのワークフローについて語りましょう by Hidemi Atarashi, Kensuke Takada, Masanari Hamada
• コンポーネント座談会 by pirosikick, 伊藤康太, 加藤佑典

質問

Lighthouse で画像フォーマットで webp にしてくれ、と指摘が入るのですがまだブラウザサポートの関係で導入が難しいです...。
そのせいで100点を達成できないのが悔しいです。

[wadackel]

回答

• 必ずしも webp に拘らな過ぎなくてよいかと思います。 (By 1000ch)
• Lighthouse は必ずしも100点を取る必要はありません。(By @agektmr)

高いスコアを目指すべきではありますが、あくまで改善の指標として使用できるのが良いかなと思います。

対策

• jpg と webp を用意して <picture> で出し分ける
  • ただし工数が増えてしまうので、Pros, Cons を考慮する必要がある
    • <picture> に対応していないと駄目
    • CSS、HTML での扱いが煩雑になる
    • 画像の入稿が必要な場合に、jpg に加えて webp もアップロードする必要があったりする
• WebAssembly で変換するという方法がある..!?
  • ブラウザサポート... 😇

どちらも作業工数、運用コストに大きく影響が出るので、諦めざるを得ないというのが今のところ現実的かもしれません。