Shibuya.js TECHNICAL TALK #1 レポート

Shibuya.js

YAPCからレポートづいてます。かくたにさんが行けないとのことで，代わりに？行ってきました。
http://shibuyajs.org/
会場は御茶ノ水のデジタルハリウッドでBlogHacksと同じ会場ですね。最近老眼か目が悪くなったワタシはできるだけ前から２列目をゲット。１列目には小飼弾さんが座ってらっしゃいました。以下レポート。

最後に生き残るのはJavaScriptかもな / えとこういちろう

Ruby界からはえとさん登場。えとさんは「ネットトラヴェラーズ '96」にJavaScriptの記事を書いたそうです。「おそらく日本で最初の紹介記事」とのこと。ちなみに会場には「ネットトラヴェラーズ」を知っている人はほとんどいなかったみたい。みんな若いなあ。オレは知ってるよ。

ネット・トラヴェラーズ〈’96〉

ネット・トラヴェラーズ〈’96〉

ちなみに翔泳社の「変な会社の作り方」などのシリーズには「NT2X」とついていて，これは「ネットトラヴェラーズ 200X」って意味ですね。

  • JavaScriptはその後ブラウザ戦争に巻き込まれ「意図的な非互換」が仕組まれることとなり，結果として誰も使わない技術として10年を過ごした
  • ところがライバル（JavaアプレットやらShockwaveやら）が次々と死んでしまったためもあり，ついにクライアント技術の覇者となった。「王の帰還」だ！
  • これからはサーバ側もJavaScriptになる日が来るかもしれない（だってクライアント側と違う言語覚えるの面倒）
  • でもJavaScriptってLL？ 「オレってスゲー」感が無い。
    • ライブラリ重要！ require！
    • テスティングフレームワーク重要！
    • この２つがクリアされればLLとしての「爽快感」が得られるのでは？

Prototype.jsは遅い？ JavaScriptの高速化 / id:amachang

IT戦記なid:amachangさんのトーク。髪の毛が逆立ってます。

  • JavaScriptはマルチスレッドで実行されず，全ての関数やらイベントやらがキューに溜まる
  • 高速化するには
    • DOM操作を減らす
    • アタッチしたイベントは不要になったら消す
    • あっちこっちでsetIntervalしないで一箇所にまとめる
  • Prototype.jsは関数によってはメチャクチャ重いので，mouseoverイベントにアタッチしたりしちゃダメ
  • $Aはオブジェクトのlengthをとるので遅い

とにかくソースコードがバリバリ出てきて，ベンチマーク結果が次々と並ぶので説得力抜群です。
質疑応答。

はてなよりシャープでしょ / 竹迫良範

なんて書けるんだけど「?load=effcts」ってやるとキャッシュが効かない。「#load=effcts」って書けるといいよね。という話。あ，短いな。つい聞き入ってしまったのでメモが少ないのでした。

Agile Web Development with 萌ディタ / ma.la

ニートからエンジニアにクラスチェンジした最速インターフェースの中の人。萌ディタ（萌エディタではないので注意）は凄いらしい。six apartの宮川さんも使っているらしい（メモ帳として）。

  • コンテクストに応じて動的にキーバンドやシンタックスハイライトのルールを変更できる。つまりhtml中にJavaScriptが混じるような場合，それぞれ異なるシンタックスハイライトやらキーワード補完ができる。おお便利そう。
  • Operaはメーラー（ML自動振り分けとか返信者のアドレスが自動的にアドレス帳に入るとか）。
  • Safariの罠。Safari対応のためにマックを買うとOSXがかっこよくてマカーになってしまう罠。
  • 開発サーバにいちいちコミットするのが面倒なので，PCと開発サーバの間にWEBrickをプロキシーとして置いて，サーバとWEBrickに同じ名前のファイルがあるときはWEBRickのを返すようにしている。こうすると変更したいファイルはWEBrickにおいてすぐ試すことができる。

実際にはなぜか四部構成。最後に「第五部ライブドア完」とか言ってました。質疑応答。

  • 「Safariの罠はマカーになることだけ？」「肝心なメソッドが実装されてなくて回避もできなかったり。使うなら最近のを使いましょう」
  • 「新プロダクトの公開はいつ？」「来週くらい。一月前に公開できていれば上場廃止も無かったものを...」
  • 「リファレンスにはナニを使ってますか？」「MSが公開してるやつとEMCAScriptの和訳とSpiderMonkeyをローカルに動かして動作確認したりしている」

RJS Template, Jemplate / id:secondlife

id:secondlifeさんが使っているプレゼンツールは見たことが無い。なんだろう？ Ruby on Rails 1.1から使えるようになった新しいViewシステムRJSと，perlのTT互換なJavaScript用テンプレートJemplateの比較。

  • RJSは今までHTMLに変数を埋め込む形式だったRailsのビューを，JavaScriptのDOMに置き換えたもの。AJAXなアプリと親和性が高い。Rubyで記述できる（RailsがJavaScriptに変換する）。
  • JemplateはJavaScript用のテンプレート（なのでRJSとはまったく違う）で，perlで広く使われているTTと互換形式で記述できる。これをJemplateコンパイラに通すとJavaScriptのコードに変換され，JavaScriptのロジックから使えるようになる。

Jemplateははてなマップでも一部使われているとのこと。

LightningTalk

  • JavaScriptを関数っぽく / motemen
  • モテル! XUL! / Piro
  • GreaseMonkeyをXPathでラクに / cho45
    • GMでやたらよくやる処理は要素選択。
    • 要素選択をXPath渡すと一発でやってくれる関数「$X」を作った！
  • モテル! XUL! / Piro
    • 外部出力に映像が出ない！
    • 急遽交代
  • しんスロットでくるくるストーン
    • JavaScriptだけでアニメエフェクトだ。ラスタースクロール！ キューブ回転！
    • ところでJSANはテスティング環境があるのがイイネ
  • モテル! XUL! / Piro
    • JavaScriptアプリ = HTML（構造） + CSS（外観） + JavaScript（ロジック）
    • XULアプリ = XUL（構造） + CSS（外観） + JavaScript（ロジック）
    • 生産性高いヨ（でも開発者少ないヨ）。余った時間で脱ヲタだ！
  • ブラクラの歴史 / youpy