img src="" で無駄リクエストが飛ぶ問題
どうなるかっていうのと、どうすればいいかっていうのをメモ。
古いAndroidの特定端末で起こったりするのですが、
このバグ、最近のブラウザではもう解消されてるのかしら？
コメントで頂きましたが、依然として起きるみたいです・・。
srcが空だと
以下のケース。
<img src="">
この場合、srcは勝手にそのページのルートへアクセスしてしまって、無駄なリクエストが発生していまいます。(いかなる状況でもそうなるわけではないみたいやけど)
それを回避するには
調べてみた限り、以下の3パターンが多かったです。
//:0
<img src="//:0">
これはすごいなーと思いました。
参考：html - What's the valid way to include an image with no src? - Stack Overflow
ただコレ、一部のAndroidで無理くり画像を読み込もうとするやつがいて・・。
後からsrcを差し替えても、最初のいわゆる「壊れたブランク画像みたいな表示」が焼け付いて、
後から差し替えた画像のまわりに謎の枠が現れたりするケースがあります。
1x1pxのgifをbase64エンコードしたもの
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"> <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAUEBAAAACwAAAAAAQABAAACAkQBADs=">
上のが透明、下のが真っ黒。
なにとはいいませんが、URLライクな文字列がsrcタグに指定されてた場合に、独自の解釈でパスを置換するようなフレームワークがありまして。
そういうケースでは、上記2パターンが通用しないです。
そんな場合は諦めて、なるべく軽い画像を使おう、と。
まあ、いっぺんやってみてあかんかったら対応する、でいいやね。
