読者です 読者をやめる 読者になる 読者になる

console.lealog();

@leader22のWeb系に関する勉強めもブログですのだ

iOSにおけるリソース制限

Web iOS

よくJavaScriptの実行は10秒以内にしなさいとか聞きますが、アレもこのひとつです。
今回はそんなリソース制限の中でも、画像についてのメモ。

やたら縦に長い画像を使ったら、iOSの一部機種で画像が表示されなかったんですの・・。

参考:Safari Web Content Guide: Creating Compatible Web Content

Apple端末のRAM容量

まず、リソース制限は何によるのかというと、端末に搭載されているRAM次第だそうで。
以下その一覧。

iPhone

iPad

  • 初代(iPad1):256MB
  • 第2世代(iPad2):512MB
  • 第3世代(新しいiPad, iPad3):1GB

iPod

  • 初代:128MB
  • 第2世代:128MB
  • 第3世代:256MB(8GBモデルは128MB)
  • 第4世代:256MB
  • 第5世代:512MB

参考:iPod touch(第5世代)のメモリ(RAM)は512MB?

Appleは正式に出してないんですね。

リソース制限

こっからが本題で、Canvasや画像のサイズについての制限について。
冒頭の参考リンク内、[Know iOS Resource Limits]の項です。

画像の容量

The maximum size for decoded GIF, PNG, and TIFF images is 3 megapixels for devices with less than 256 MB RAM and 5 megapixels for devices with greater or equal than 256 MB RAM.

  • RAMが256MB未満の端末では、3MB以下
  • RAMが256MB以上の端末では、5MB以下

画像のサイズ

That is, ensure that width * height ≤ 3 * 1024 * 1024 for devices with less than 256 MB RAM. Note that the decoded size is far larger than the encoded size of an image.

  • RAMが256MB未満の端末では、width * height ≤ 3 * 1024 * 1024 となるように。

この計算だとおおよそ3メガまで大丈夫風ですが、おおよそ1000px * 2000pxの画像が、iPhone 3GSと初代iPodで表示されませんでした。

その他

あとは

  • Canvas要素にも同等の容量制限あり。
  • JPEGだとサブサンプリングされるので32MBまでOK。
  • JavaScriptの実行は10秒を超えると処理が止まる。
  • 同時に開けるウィンドウは8つまで。(iPadは9つ)
  • 100*100の画像を、10*10で表示させたりしない。(=画像のサイズは適正にすべし)

ううむ。

そういやRetina対応などで画像を実表示の2倍のサイズで作って、widthやheightで半分を指定・・なんてよくやる手ですが、あくまであれはハックであり正攻法ではないんですね。