iPhoneのメモリーや、ディスクについて

 先日iMemoryGraphというメモリーの使用状況を測定するアプリを導入してみました。

iPhoneのwebアプリをつくっていると、たまに画面が白くなって、再読み込みが走ることがありますが、この原因が知りたかった。
以下の記事は4S(AU)での動作です。キャリアはあまり関係ないと思うけど。
iPhoneのスペックでは
メモリー505MB(うち、自由につかえるのは大地あ250MBくらい)
ディスク28.2GB
といったところみたいです。

その１：個人的な調査によると、メモリーがFreeメモリーが10MB程度まで落ちてしまってからページにアクセスすると、最終にアクセスしたページから順に再読み込みがかかるらしい。

ちょうど発生した時間のグラフはこんな感じ9:50くらいに実験したかな。

その２：僕が大好きなsencha-touchですが、メモリーを馬鹿食いするみたいです。以前つくったノートアプリを開くと50MBくらいくいやがった。こったアプリをつくるとさらにメモリーを食いそう。ちょっときついですね。ずっとsencha-touchでつくったアプリをつかい続けるなら、まぁリロードはそんなに走らないでしょうが、他のアプリと併用させるとたちまちアウトかも。

その３：XMLHttpRequestによるajaxの動作やページの読み込みデータ(画像等)はメモリーではなく、ディスクに書き込まれるっぽい。
javascriptの変数で保持してしまうとメモリーにきます。
no-cache等をサーバーで設定しておくようにすれば、次のデータを読み込んだときに過去のデータは削除されますが、設定しないない場合は、iPhoneがディスクにキャッシュする模様。

その４：localStorageでキャッシュした場合もディスクにたまるようですが、ディスクがいくらあろうが、数MBでアウトになるみたいです。

その５：mp3等のメディアデータはメモリー上にのっかって動作するらしい。(ファイルキャッシュしろよ。)

こんなところですね。この辺チューニングをうまくやってあげるとiPhoneの楽しいアプリ作成ライフが送れそうです。

iPhone4Sで3G回線でネットができなくなった。

iPhone4Sを利用しているのですが、3G回線を利用したインターネットをつかおうとしたら、使えなくなっていました。ちなみにAUです。

１日前までは、youtubeのブックマークレットでガンガン音楽をききまくっていたので、問題なく動作していたのに・・・

というわけでいろいろな回避策を講じてみました。

その１：電源のon off右上の電源ボタンを少々長押し→スライダーで電源OFFを選択→その後再起動してみる。→結果はなおらず。

その２：仕方ないので購入したお店にいってみる。そこでやってもらったことは、電源の再起動とgoogle検索を何度か、なおらないので、iphone4Sに関する問い合わせ先の載っている冊子をもらってきた。→結果はなおらず。
itunesの復元を利用すれば、だいたい元に戻るとアドバイスをもらったので、速攻帰宅。

その３：ネットワークの設定のリセットをすれば、なんとかなるかもと思い実行してみる
→結果はなおらず。

家のiMacにて、itunesと接続し、iPhoneのソフトウェアの復元の実行を試みつつnetを検索してみたところ
その４：http://nekomac.seesaa.net/article/102945905.html
この記事を発見。電源とホームボタンを長押しすると別の再起動ができるわけですか・・・
→いったん復元作業(ソフトウェアアップデートのDL中)を停止して、試行してみる。
→なおらず。

その５：復元作業を再開しているところ。
→なんと、これでもなおらず。

http://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q1275262042
こちらの主の回答からするとネットワーク設定ではなく全リセットすればなおるかも・・・
→この方法でいけた・・・

なおった・・・
が、データ等すべて飛んだ、わーぃ

さて、再度やり直していくとしますかw

audioタグにいろんなファイルをつっこんでみた。

audioタグにmp4 m4a 3gp mp3 wavをいれてiphoneで再生してみたところ・・・
どうやらmp4系とmp3系にわかれるらしい。

mp4系の動作(mp4 m4a 3gp)について、再生中に別のウィンドウをひらいたりすると、再生がとまります。
再度再生を実行しないととまったままになる・・・

mp3の動作は別物で、再生中に別のアプリにうつったりしてもとまりません。
wavもこちら側となります。

sourceタグにtype設定をいれて、mimeに嘘をいれたりしてもダメ。
どうやってもだめなものはだめ。ということになりました。
再生できないmimeをいれると使えないsourceということで無視されるみたいです。
再生可能なmimeをいれると、読み込み時に再度確認して正しいmimeになるみたいです。
つかえねぇ。

まぁ、video/3gppがaudioタグで再生できるだけましか・・・
というわけで、エンコード変換をしないかぎり、youtubeブックマークレットはどこまでいっても、再生ボタンをおさないとだめよ・・・という制限が付きまとうことになりそうです。

あと抵抗できるとしたら、javascriptでとまっても再生がキックされるようにするくらいですかね。

audioタグとsourceタグについて。

現在youtubeブックマークレットでは、
<audio src="動画アドレス"/>
という形でタグを利用しているわけですが、
<audio>
  <source src="動画アドレス" />
</audio>
という形でもソースを指定することができます。

この挙動について、iphone上でしらべてみました。

１つめ、audioタグにsource属性をappendChildで追記したらどうなるか
追記を実行すると、データが取り込まれました。(あたりまえです。)
sourceタグは複数設定すると、一番はじめに設定されてかつ、利用可能なデータを採用するという挙動をしますので、さらにappendChildを繰り返すとsourceがいれかわりません。(はじめにいれたものが採用されるため。)
一回、removeChildで前に設定した要素を取り除けばOKみたいです。

２つめ、removeChildで要素をとりのぞいても、別のsourceを設定しないかぎりデータが有効になるっぽい。
removeChildしたから、再生がまったくできなくなるわけではないみたいです。

３つめ、sourceタグを別にもってもcacheされない。
chromeやsafariでの動作の場合はaudioデータがキャッシュされることがあるので、sourceをいれかえるとすぐに再生できたりしますが、iphone上でsourceの入れ替えを実行してしまうと、あたらしいデータが読み込みしなおしになります。

４つめ、audioタグを複数にわけておけば、キャッシュが有効になるみたい。
音楽データをいれた別のタグを準備しておけばキャッシュみたいなことが実装できるみたいです。
ただし、タグを超えて制御するためには、ちと制限がおおすぎ。

とりあえずここまでわかりました。
youtubeブックマークレットも、mp4データをもつ別々のaudioタグをつくっていけば、電波のないところでも、複数音楽ファイルの再生ができるかもしれないですね。

3G回線でのIPアドレスについて

youtubeの動画って、ipアドレスごとの接続コントロールをやってるみたいです。
なので、理論的には、ipアドレスが同じなら、同じソースにアクセスしにいけば動画を視聴できることになります。
また、m.youtube.comにはどうやらipアドレスごとの接続回数制限みたいなのが設定されているようです。
そのためwifiネットワークでは、たまに接続が超過してしまい、m.youtube.comがデータを返さなくなることがあります。

というわけで、ipアドレスがかわっていなかったら、前の動画の接続をみにいけば、安定して動作するんじゃね？と思ってます。

そのまえに・・・

3G回線で(外出先でのネットワーク)どのくらいの頻度でipアドレスがかわるか確認してみました。
すると朝家をでてから、会社につくまで、地下鉄にものるので、途中でネットワークがきれているにもかかわらず、IPアドレスは一定でした。
会社で昼過ぎまで働いて外にでたところ、このタイミングで別のIPアドレスになり、
帰宅するときにはさらに別のIPアドレスが割り当てられていました。

一定時間IPアドレスを間借りしてるみたいですね。ずっと3Gにつなぎっぱなしとかにするとまた違うかもしれませんが、とりあえず今日の検証結果はこうなりました。

iphoneのjavascriptで巨大なファイルをあつかってみる。

iphoneのmobileサファリの実行時間制限に10秒までというのがありますが、別の関数の呼び出しになってれば大丈夫みたいですね。

というわけで、デモは示すことができませんが手持ちのmp3をXMLHttpRequestをつかって読み込んできちんと全部データを取得できているか確認してみました。

やったこと。
XMLHttpRequestをつかってデータを呼び出す。
onreadystatechageが呼び出された回数を記録する。
それぞれの呼び出しのresponseTextの長さを合計して読み込んだデータ長を計算する。
かかった時間を表示する。

としてみました。
すると・・・こうなった。

読み込みにかかった時間は３分弱
ステップ数は37000回弱
読み込みサイズは59MByte
ちゃんと読み込めてますね。

XMLHttpRequestでメディアデータを呼び出すようにしておくと、分割されて処理がまわるので、問題なく動作するといったところでしょうか。

でかいサイズのファイルを扱いたい・・・というときになにかにつかえるかも！？
と思いました。

なんでこんなことやったかというと、mp3やm4aのデータをyoutubeから抽出して、localStorageに保存しておき、data URL schemeをつかってaudioタグにいれれば、音楽ファイルみたいに扱えるんじゃない！？とおもったからです。

もっとも結果としては、「追記」という動作がaudioタグのsrcに実行できなかったため、動作しなかったんですけどね。(srcを更新するたびにデータとして受け入れるみたいで、audioタグのソースのリロードが大量にはしってフリーズしました。)

mp4 -> m4a変換ができそうだったから、いけると思ったんですけどねぇ。やはりnativeアプリにはかなわないか・・・

youtube用bookmarkletプレーヤー、その４

iphoneでyoutubeの音楽をきくためのブックマークレットプレーヤー
今度はipadでも動作するとおもいます。

今回のプログラムはこちらです。いままでのとはちょっと違います。
ブックマークレットのプログラムはこちら。
javascript:var%20spt=document.createElement('script');spt.src="http://taktodtools.appspot.com/yt/app/main.js";document.body.appendChild(spt);void(0);
前までは、headに追加していましたが、ipadだとdocument.headでhead要素にアクセスできないみたいですね。
というわけでbodyに追加するようにしてあります。
iphoneなら、いままでのブックマークでも同じように動作できます。

変更点は以下
・localStorageを使うときにきちんとdeleteで前の要素を削除するようにした。
・別の曲を選択したときに、アイテム番号がうまく取得できないバグがあったので、修正。
・別の曲を選択したときの挙動を変更して、動作が安定するように調整。

こんなところです。

はじめてきた方のために作成した動画をはっておきます。

さて、今後やりたいことは
・スキン機能の充実(誰でもスキンをつくれるようにしたい。)
・プレイリストの取り込み
・m.youtube.comのIPアドレス制限の回避策追加。
・データの先読みやキャッシュを追加。
このあたりですね。後者の２つはiphoneのハード的な制限があるわけですが、なんとかいい回避策をみつけたいところですね。

では、よい音楽ライフを〜

iPadでlocalStorageを使う上での動作バグ

iPad(iPad2ではないです。)でのJavascriptの動作がおかしいことがあるらしいです。

原因を調べてみたところlocalStorageがエラーを吐いている模様。

 こういうコードを動作させると

こんな感じのエラーがでます。
どうやら文字列を短縮して追記すると出る例外みたいです。

 使う前にきちんとdeleteするようにしてやると

意図したとおりに動作しました。
youtubeのブックマークレットがipadでうまく動作しないのは、ここが原因っぽいですね。さっさと対処しておこうと思います。

みなさんもlocalStorageを使うときにはお気をつけてくださいませ。

ではでは〜

iphoneのシミュレーターについて(iPadもできるよ。)

iphoneのシミュレーターはそこそこ数がでています。僕のおすすめはMacOSで動作するiphoneSDKについてくるシミュレーターですね。

通常は以下のディレクトリにインストールされます。
/Developer/Playforms/iPhoneSimulator.platform/Developer/Applications/iPhone Simulator.app

このiPhoneシミュレーターですが、iPadもシミュレートできます。

そして、iPadでの動作不具合もちゃんとでるという素敵仕様です。
これを元にyoutubeのブックマークレット、iPadにも対応しておこうとおもってます。

このシミュレーターですが、実はローカルファイルにアクセスできちゃいます。
サーバーにアップロードしなくてもドラッグドロップで動作確認できちゃうのが、便利です。

ドラッグドロップすると、シミュレーター上でファイルが開ける。

アドレスバーをみると、ちゃんとfile://になってる。

webアプリを開発するにあたって、こういうツールはどんどん使いこなしていきたいですね。

iphone上でのaudioタグについていろいろ

html5の登場でなにかと話題になっている(いた？)videoタグがありますが、その対となっているタグがあります。

youtube用のブックマークレット(以下youtubeプログラム)で多用しているAudioタグです。

さて、このタグですが、Iphone上で動作させるといろいろな癖があります。

[癖その１] Javascriptで操作させようとすると制限がかかる。
javascriptでplayや別のソースに切り替えたりという動作は制限がくわわっていると思われていますが。実は可能です。
どうやら一回audioタグで再生をしきったタグには後からいろいろ手を加えることが可能っぽいです。
実際youtubeプログラムでは、再生そのものは、audioタグのコントロールに処理させていますが、その後の動作は、javascriptで再読み込みを実行したり別のファイルをあてがったりしています。
この制限は、移動中等でネットワークの割当がかわると初期化されるっぽいです。

[癖その２]audioタグの再生が読み込みにおいついてしまうと、再生が止まる。
再生がおいつくと停止してしまう・・・まぁ、当然といえば当然です。
問題は[癖１]の性で、場合によっては、中途でリカバリー処理をつくっても動作しないことがあることです。
電車等で音楽をきいていて、曲が変わる→ネットワークの割当がかわる。→再生がおいつく。→とまっちゃう。ということがおきるとjavascriptではどうしようもないです。

[癖その３]音楽ファイルではなく動画ファイルをaudioタグに割り当てることも可能。
Iphoneに限りませんがmp3やm4aみたいな音楽データではなく、mp4やm4vという動画ファイルを割り当てて、音楽だけ流すということが可能です。
ただし、挙動がどうなるかは、環境次第です。
例えば、Iphoneでmp3をaudioタグで再生している場合はアプリの切り替えや画面のロックを実行しても再生はとまらずそのまま聴き続けることができます。
しかし、mp4(youtubeプログラム)を再生している場合は、切り替え等を実行すると、いったん再生が止まってしまいます。

[癖その４]複数のファイルを同時に再生することはできない。
PCブラウザではまったく問題ないことなんですが、Iphone上で同時の音声ファイルを再生しようとすると、１つしか再生できません。能力的には実行可能なのかもしれませんが、残念ながら制限がくわわっているようです。
おかげでhtml5を駆使してゲームをつくっても効果音が使えないです。
同様の問題がロード動作にもおきるらしく、複数のAudioタグを準備して、同時進行でダウンロードを先行させる。(要するにcacheさせる)ということも不可能ではないっぽいのですが、意図した動作になってくれません。

[癖その５]iphoneの設定を消音設定にしていても再生を始めると音がでる。
音楽を流すための機能を有効にしたんだから、音楽をながす・・・当たり前の動作です。
ただし、再生を開始するためには、ユーザーが自分でボタンを押す必要がでてきます。
このときに、javascriptの制限が復活してしまうという特性もあります。
これのおかげで、youtubeプログラムつかっていたら、ボタンが効かなくなったわ(怒)ということがたびたびおきてます。

とまぁaudioタグはapple的には音楽を聴くためのものという位置づけになっているようですね。
裏動作がいろいろあって、こうしたらjavascriptの制限がはずせるというのがいろいろありました。そして、これからもいろいろ見つけるだろうと思います＾＾；

videoタグほどではないですが、audioタグも前途多難ですわ。

iphoneでyoutubeの音楽を聞くためのブックマークレット作りました。その３

iphoneでyoutubeの音楽を聴くためのブックマークレットを作りました。
その３。

この前とほぼ一緒ですが、読み込みまわりの最適化をすすめたり、youtubeのwebアプリっぽいスキンを準備したりしました。
ブックマークレットのプログラムはこちら。(前回と同じ)
javascript:var%20spt=document.createElement('script');spt.src="http://taktodtools.appspot.com/yt/app/main.js";document.body.appendChild(spt);void(0);

実機でやってみた解説動画も準備しました。

audioタグの動作に妙な点があり、その性で曲選択がうまくいかなかったり、途中でとまったりすることがあります。
そういうときは、１曲だけとりあえず最後まで再生しきってください。
そうなる理由は、次の記事のaudioタグの動作のところに書きなぐっておきます。

ではでは〜

iphoneのmobileサファリの動作バグその１

最近youtube用のブックマークレットを作っていると、いくつかiphone用のsafariの動作バグをみつけました。

本日はとりあえず１つめのバグ
Basic認証のあるページのtext入力のところで、ソフトウェアキーボードがでているときに、alertが発動すると・・・

Alertも閉じれないし、キーボードも閉じれないという状況になりました。
ユーザー限定サイトの中でのログイン等があると発生しそうなバグです。

どうやら先にbasic認証をすませて、データを保存している状態にすれば大丈夫になったりする模様です。
iphone4sでのみ発生する不具合っぽいです。
とりあえず、ロックしたりホームにもどってからsafariに再度アクセスするとキーボードがなくなり対処できるようになるみたいです。

うーん癖のあるデバイスですね。iphoneってw

iphoneでyoutubeの音楽を聞くためのブックマークレット作りました。その２

iphoneでyoutubeの音楽を聞くためのブックマークレット作りました。
その２。

この前のやつより、いい感じにしてみた。

今回のブックマークレットはこちら。

javascript:var%20spt=document.createElement('script');spt.src="http://taktodtools.appspot.com/yt/app/main.js";document.body.appendChild(spt);void(0);

iOSのデバイスでyoutubeにアクセスした状態で実行すれば起動します。


動作の解説の動画をつくってみました。

機能
・addで任意の動画を取り込む
・ctrlでコントロールパネルを開閉する。
・audioタグが見えるので、そこで再生停止、シークができる。
・任意の曲を再生開始することができる。
・必要なければ削除できる。
・再生中の曲がなにかわかる。
・設定でロードなしで１曲ループができる。
・音楽リストのexport、import機能

注意点やバグ
・m.youtube.comにアクセスしまくるとwifiだとアク禁くらうみたい。
・別のアプリでメモリーを使いすぎるとページが落ちるらしい。
・回線の問題で動画の読み込みに再生がおいつくと止まっちゃう。
・名前によっては、追加がうまくいかない。
・ipadのエミュレーターでうまく動作しなかった。
・iOS5のsafariのプライベートモードでは、うまく動作しない。
・ほかにも不安定要素がある。

今後の拡張
・アクセス時に利用するcssがあるのですが、これを書き換えればだれでも自由にスキンをかえられるのでそっちの拡充をやってみたい。
・再生リストの取り込みとかもやってみたい。
・mobile端末未対応動画がきちんとスキップできるか不明・・・たぶん無理。
・あとはアイデアあったらどんどん取り込みたいですね。

youtube側がaudioタグで再生するのをサポートしてくれればいいんですけどね。

あとは、時間があるときにぼちぼちプログラムを更新していければ・・とおもいます。

javascriptのfor - inではまったこと

関数の中でfor(keys in 配列)を呼び出したところ。
このkeysの定数はなんとglobal変数になってしまうみたいです。
ローカルにするなら
for(var keys in 配列)
としないとだめ。(safariで確認、ほかのブラウザは未検証)

再帰的処理をかけたところ。keysがこわれて大変なことになった・・・

iphoneでyoutubeの音楽を聞くためのブックマークレット作りました。

iPhone4Sをもちあるいているのですが、暇なときに音楽でも聴きたい・・・でもitunesで同期させるのは面倒。
PCの場合はyoutubeのプレイリストでも準備しておけば、流しっぱなしにしつつ仕事とかできるわけですが、手軽にiphoneでもできたら便利なのに・・・とおもっていました。

デフォルトでついているアプリは１つ再生がおわると、とまって詳細情報にいってしまうしwebでアクセスした場合は、画面をロックすると再生できなくなっちゃいます。

というわけで適当なブックマークレットをつくってみました。

add

javascript:var%20spt=document.createElement('script');spt.src="http://taktodtools.appspot.com/yt/add.js";document.head.appendChild(spt);void(0);

clear

javascript:var%20spt=document.createElement('script');spt.src="http://taktodtools.appspot.com/yt/clear.js";document.head.appendChild(spt);void(0);

play

javascript:var%20spt=document.createElement('script');spt.src="http://taktodtools.appspot.com/yt/play.js";document.head.appendChild(spt);void(0);

iphone4sでのみ、動作確認してあります。

この３つのブックマークレットをまずiphoneのサファリのブックマークに登録してください。

まず適当なブックマークを３つ作ります。
このページでもかまいません。

上記のブックマーク用のプログラムを押し続けると選択されコピーがでてくるので、コピーします。

ブックマークの編集で先ほどのデータを貼付けて３つのブックマークを準備します。

先ほどコピーしたデータを貼付けると若干簡単に準備できます。

 safariでyoutube.comにアクセスして、気に入った曲をみつけたら、addのブックマークを実行して、じゃんじゃん追加していく・・・

clearのブックマークを実行すると、追加されたリストがクリアされて登録しなおしになります。

リストができあがったら、playのブックマークを実行します。
すると、youtubeのwebアプリの上にplayというボタンがでてきます。
でてきたら成功。

このplayボタンを押すと、addで追加した曲が順番に再生されていきます。

ロック画面や別のアプリに移動すると、いったん止まってしまいますが、ボームボタンを２連続で押すと再生させることができます。

あとは[javascriptが有効な限り]音楽が再生され続けます。

動作がどうも安定しないときが若干あるみたいです。
そういう時はアクセス動作(データの読み込み)が完了してから１歩ずつ動作させてみてください。

作った感想：youtubeの音楽をベースに音楽を携帯するのはiphoneを買ったころからやりたいと思ってました。iphoneでの動作では、動画を再生すると制限が酷くてやりにくいのですが、audioタグで再生しちゃえばいろいろできるのでは？と思い立ちつくったのが、今回のブックマークレットです。
外の3G回線でもちょっと頭出しに時間がかかりますが、そこそこ動作するのでなかなかいけるんじゃないの？これ？と思ってます。

説明にjavascriptが有効な限り・・・と書きましたが、iphone上のアプリを別途利用していると、開いているyoutubeのページが無効になってしまい。再度アクセスし直すと自動的に読み込み直しがおこる状況になることがあります。この状態になると、javascriptによる次のファイルの読み込みがうまく動作せず、音楽を再生しきったらとまっちゃうみたいです。

ブックマークレットの形にしたのは、youtubeのメディアファイルにアクセスするために、videoplaybackのデータを引っ張ってくるのですが、端末上でうまくやる方法がどうしてもみつからなかったからです。

リスト追加等を手軽にしたのはいいのですが、管理しにくいので、もうちょっとUIをなんとかしたいですね。

動作はaudioのタグの挙動を調べまくってつくりましたので、同じiphoneでもバージョンによっては動作しなかったりするかもしれません。特にロック画面で動作するかといったところは不安・・・こんな端末でも動作したよという報告いただければうれしいです。

いろんな人にこのブックマークレットつかってもらいたいなぁ。

ではでは〜