Home > Archives > 2011-09

2011-09

【iPhone】JSで画像の読み込みを行うとMobileSafariがクラッシュする(ことがある)

http://stackoverflow.com/questions/2986039/ipad-iphone-browser-crashing-when-loading-images-in-javascript http://bugs.jquery.com/ticket/6944

実際経験した状況では、 1) JSで2~10枚ほどの画像を、new Image() でロードする(画像はbase64でエンコード、dataURIで読み込み) 2) 読み込んだ画像を、canvasやCSSのbackgroundとして、50%縮小して、1~2枚ずつ描画。 3) 1、2の処理を10回ほど繰り替えすと、Safariがクラッシュする場合がある。

canvasでやるよりは、CSSでやった方が頻度が多い気がする。 たぶん縮小とかしてるのも良くない原因な気がする。 その他にも音声の読み込みをしてる場合があるので、 色々メモリは食ってそうな気がする。

【iPhone】Audioを読み込むイベントがどこまで持ちまわせるか

タイトルがイミフだけどとりあえずメモ。

iPhoneでAudioを読み込み(再生)させるには、 ユーザーによる任意のイベントが必要。

で、この「任意のイベント」がどこまで持ちまわせるか。 どこまでも持っていけるものではないみたい。

var audio = new Audio('hoge.mp3');
$('a.hoge').click(function(){
  audio.play();
});
これは大丈夫。

getJSON のコールバックでplay()

$('a.hoge').click(function(){
  $.getJSON('getjson.php', function(json){
    var audio = new Audio(json.audio_name);
    audio.play();
  });
});
これはたぶんダメ。

getJSONしてきたものをコールバックの外の変数に入れて、setTimeoutでJSONがセットされるのを確認してからplay()

$('a.hoge').click(function(){
  var json;
  $.getJSON('getjson.php', function(data){
     json = data;
  });</p>

<p>setTimeout(function(){
    if(typeof json === 'undefined') setTimeout(arguments.callee, 100);
    else{
      var audio = new Audio(json.audio_name);
      audio.play();
    }
  });
});
これもたぶんダメ。

同期通信でJSON取りに行って、play()

$('a.hoge').click(function(){
  var jsonText = $.ajax({url:'getjson.php',async:false});
  var json = JSON.parse(jsonText.responseText);</p>

<p>var audio = new Audio(json.audio_name);
  audio.play();
});
これもたぶんダメ。

試しに無名関数で囲ってみる

$('a.hoge').click(function(){
  var audio;
  (function(){
    audio = new Audio('hoge.mp3');
    audio.play();
  })();</p>

<p>});
ダメっぽい。

「任意のイベント」(ここではclick)のイベントハンドラのスコープの中で、 且つそのイベント発生後、通信が起こっていない状況じゃないと、 load/play()は出来ないような、そんな気がする。

詳細は時間があるときに検証する。

Home > Archives > 2011-09

Search
Feeds
Meta

Return to page top