iPhone4のsafariだけcanvasが激重い
canvasでご機嫌にアニメーションを作ってぶりぶり遊んでいたのに、iPhone4だけ遅い。カクカク遅い。コ・マ・お・く・り・も・で・き・ま・す・よ、というドリフが出てたビデオデッキのCMを思い出すくらい遅い。これが分かる人は大体友達、それはともかくほんとにほんとに遅い。
なんなら先代iPod touchのが全然早い。さすがにPCよりはもたつくけど、少しスピードのパラメータに下駄履かせてやればなんとかなるくらい。iPhone 3G（Sじゃないのよ）なんかほぼPCと同じ早さだ。しかも3G+iOS4.0.1だ。なのでsafariの事情という訳でもないっぽい。iPadも余裕。
でもiPhone4 だけ遅い。
その遅さっぷりを見ててふと思い出した。
canvasのアニメーション、最初はtouchでも3Gでも遅くて、使えないなーとか思ってたら、metaタグでviewportのinitial-scale=1.0にしたらあっと云う間に解決したという事があって、つまりはsafariで拡大縮小するとcanvasの描画ってのはお荷物になるらしい。initial-scale=1.0にした後もちょっとピンチするともうダメ。重い。
なのでまあこんな感じで
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
一件落着と相成った。
というあれこれがあって、もしかしてiPhone4のsafariってinitial-scale=1.0を指定しても勝手に拡大してるんじゃないのか？と思い当たった。
他のより高解像度なので見た目ちっこくなる訳で、それまでviewportで最適化されたサイトの見た目が変わるのは宜しくないので、草履を温めておきました、うむういやつじゃ、とかなんとか気を回しまくった果てのこれなのではないか。
とここまで昨日思いついて今朝調べたら
http://journal.mycom.co.jp/articles/2010/07/23/css-for-iphone4-retina-display/index.html
だそうです。
CSSでサイズ指定かー。上手くいくのかなあ。
