2013/08/26(#html5j)第41回 HTML5とか勉強会

close_yutori @kimukou2628

(#html5j ust at http://t.co/QsDDbFXK9P ) http://t.co/jj9BgGqlwP P16 実際のフィルター処理。ソースコードは P17見てね！

拡大

kubosho @kubosho_

WebSpeech APIなんてあったのか(ただしW3Cでドラフトになってないし、Chromeのみ実装) #html5j

OISHI Ryosuke @roishi2j2

"音声認識は、WebSpeech APIを使ってます。W3Cでドラフトにもなっていない、Chromeのみの実装です。認識は、Googleさんが頑張っています。使い方も簡単です。" #html5j

close_yutori @kimukou2628

(#html5j ust at http://t.co/QsDDbFXK9P ) http://t.co/jj9BgGqlwP P18 最新の音声認識（Androidの音声認識の機能を流用してるのかも？ とのお話

拡大

wakasa masao @wks

当日の動画はこちらです。あんまりマンガテレビは出てきませんが・・。http://t.co/b2H0W5QBSi #html5j

拡大

OISHI Ryosuke @roishi2j2

"あと意外に重要なのが、先ほどの比留間さんのスライドにもありましたが、httpsにしてやる必要があります。httpだと認識の度にダイアログが出てしまいます" #html5j

close_yutori @kimukou2628

(#html5j ust at http://t.co/QsDDbFXK9P ) http://t.co/jj9BgGqlwP P19 httpsにするというテクは実は重要！（httpだと毎回 デバイスにアクセスしますか？とか聞かれてしまうので

拡大

シライシシュンペイ @Shumpei

.@komasshu のセッション。 #html5j http://t.co/3HtRpDPd1T

拡大

Ryosuke Tsuji @thujikun

デバイス使う系アプリはhttpsにしないと都度確認求められてうざくなる。 #html5j

OISHI Ryosuke @roishi2j2

"あとHeadTrackr.jsを使って顔検出をしています。Face.jsより高速に動きます。MBPで30fpsくらいです。" #html5j

kyo_ago @kyo_ago

デバイスへのアクセスに毎回確認必要なのはMitM考えてるのかな(それでもリロード時でいい気もするけど) #html5j

close_yutori @kimukou2628

(#html5j ust at http://t.co/QsDDbFXK9P ) http://t.co/jj9BgGqlwP P20 Face.jsが遅いのでこっちを使う＝＞ただし複数認識は無理ですよ とのこと

拡大

edom18@XR / MESON CTO @edo_m18

Headtrackr.jsはどっかで使ってみたいな。 #html5j

シライシシュンペイ @Shumpei

マンガテレビについての記事 http://t.co/cIJZq9Dj2R #html5j #html5exp

close_yutori @kimukou2628

(#html5j ust at http://t.co/QsDDbFXK9P ) http://t.co/jj9BgGqlwP P23 高速化のポイント＜＝30万回のループを何とかしよう！ P24 目標（60フレーム目指そう！

拡大

OISHI Ryosuke @roishi2j2

"白石さんという人から目標を出されました。マンガカフィルター処理を60fps @ MBPで。1回あたりの処理を30msec以下に抑える必要があります。パフォーマンスチェックにはChromeのWeb ToolのPerfilesがかなり便利です。" #html5j

だーすー𝕏（Hiroshi Suda） @suda_hiroshi

パフォーマンス確認にはCrome開発ツールのProfilesが便利． #html5j

OISHI Ryosuke @roishi2j2

"画像を取ってくるのに7ms、マンガ化処理に4msかかっています。高速化するときに何をすればいいのかがすぐにわかります" #html5j

Ryosuke Tsuji @thujikun

Chromeのprofileタグ使うとパフォーマンスが簡単に計測できる。 #html5j

close_yutori @kimukou2628

(#html5j ust at http://t.co/QsDDbFXK9P ) http://t.co/jj9BgGqlwP P26 ちょっとした書き方でだいぶパフォーマンスが変わるとのこと プロパティアクセス、関数アクセス ＝＞凄い遅い ベタ書き、変数を使う

拡大

だーすー𝕏（Hiroshi Suda） @suda_hiroshi

60fps出すためには，関数のインライン展開と，パラメータをプロパティではなく変数で渡すことを徹底する． #html5j

Keiji Yoshida @_yosssi

マンガテレビのJavaScriptチューニング：関数を使用しない、プロパティアクセスではなく変数を使用 #html5j

Ryosuke Tsuji @thujikun

関数使うより直書き、プロパティより変数使う方が速い。でも読みにくくなりそう。。。 #html5j

close_yutori @kimukou2628

(#html5j ust at http://t.co/QsDDbFXK9P ) http://t.co/jj9BgGqlwP P26 構造化プログラミングっぽい奴使うと遅くなるって話に似てるかも（汗

拡大

Keiji Yoshida @_yosssi

マンガテレビのJavaScriptチューニング：関数呼出し減らす、プロパティ参照を減らす、演算処理を減らす #html5j