メモログ

Featured Image を設置するでPicture要素を使って以来、SVGでないFeatured ImageにはPicture要素を使い続けていたのですけど、気がついたらもうWebPが安全に利用できるようになっており、もう全部webpで良いじゃないかということになっていた。

なので、昨日までChatGPTで生成した画像（png）を自前のgenerate-responsive-imagesを使って、各種サイズのpngとwebpに変換してPicture要素のsourceにしていたけど、webpに変換するだけにしてみた（ついでに画像の横幅も今のサイズに合うようにした）。

<img
  src="image.webp"
  srcset="image.webp, image@2x.webp 2x"
  role="presentation"
  loading="lazy"
  width="985"
  height="985"
  alt=""
/>

ChatGTPで出力した画像（pngで横幅1024px）は、そのままだと2MB〜3.5MBくらいするのですけど（pngだからかな）、WebPにするだけで100KB〜200KBくらいまで小さくなる。画像をPrimitiveにかけてSVGにした方が、サイズは軽いしスケーラブルだしで、便利なところはあるけど、WebPで150KBくらいなら（高解像度のは300KBくらいあるけど）、まあ良いんじゃないかなあ。

というメモ。