10 April 2010

Chrome Extension TechTalk

f:id:cou929_la:20100409201730j:image

chromium-extensions-japan主催. chrome拡張開発の勉強会. 勉強会の対象は初級者ですが, 熱い内容だったと思います.

自分はfirefoxの拡張をすこし, chromeの拡張は全く経験なしという人間です. その視点からだと, chrome拡張には次のポイントがあると感じました.

  • 将来性. chromeの拡張を開発することで得られるリターンが多いように感じられました. 将来的にChrome OSにおけるアプリケーションのような存在になるとのことらしいし, HTML5の技術を学ぶにも良いフィールドです.
  • 開発が簡単(制約は多いが). firefoxの拡張の場合はXULやXPCOMなどmozilla特有の技術を学ばねばならず敷居が比較的高くなりますが, chromeの拡張はhtml/css/javascriptで構成されるため, 既存の知識を流用できる割合が多くなります.

これらのポイントから, chrome拡張はやはり魅力的で開発者が多くなっていることも納得いきます. firefoxの場合もjetpackがもう少し起動に乗ってくれば良いと思うんですが, sdkはまだまだapiが整っていないし再起動なしのインストールもfirefox3.7以降になるので, 現状では厳しいといえます. HTML5の実装もWebKitが先行しています. ただこれは両者の開発方針の違いによるもで, なんでもかんでも実装せずにspecが固まって安定したものから実装するという方針は正しいものだと思います. しかし一方で新しいAPIがいちはやく使えるWebKitに開発者はひかれるという面もあります.

今後はfirefox拡張もchrome拡張も作っていきたいなというのが最終的な感想です. Chrome OSのことを考えると, 今から拡張にコミットしておく価値は高いと感じます.

以下メモ.

Google Chrome拡張開発者のためのHTML5ミニ講座: 及川卓也(http://www.jalphant.net/)

  • 開発プラットフォームとしてのHTML5/CSS3
    • Webを開発のプラットフォームにする
    • 個別要素の集大成
  • http://www.youtube.com/watch?v=fyfu4OwjUEI
  • Desktop Notification
    • Google 提案
    • あとの白石さんのセッションで
  • Chrome OS

Chrome拡張入門: 太田昌吾(http://tako3.com/http://twitter.com/os0x)

http://docs.google.com/present/view?id=ddt83665_1307m2cft

  • Chromium
    • WebKit, V8
    • OSS
  • Google Chrome
  • WebKitのWebCore
    • WebKitのレンダリング周り
  • Chrome拡張
    • HTML/CSS/Javascript
    • Chrome OS ではアプリケーションの役割を果たす?
    • 作るの簡単
    • 制約多い
  • 拡張同士は互いに独立
  • 拡張同士の連携はchrome.extension.sendRequestでメッセージをやりとり
  • 拡張のID: URI形式
  • manifest.json
  • ここで宣言してない機能は使えない
  • 拡張の作り方
  • "拡張を作るにあたって必要なものは特にありません。あえて挙げるなら、アイコンは用意しておきましょう。"
  • パッケージング
  • chrome://extensions/ から
  • GitHub - Constellation/crxmake: making chromium extension でcuiでもパッケージングできる
  • crxになる
    • crxはzip
  • IDが開発時と変わってしまうからkeyフィールドを参照する
  • パスに日本語とかはいるとだめ
  • manifest.json
    • "run_at" 起動タイミング
  • background.html
    • ページのjsの変数がメモリ的に使える
  • ドキュメントよりもソース読むのがはやい
  • "HTML5 を使いたい!という方は、是非Chrome拡張を!!"
  • いまできないけど将来できたらいいなというAPIは?
    • webサービス上のデータを読み書き
      • 自由に使えるweb上のストレージ
    • 自分でサーバ側を作るのは面倒
  • 拡張でやらない方がいいものは?
    • 結構いっぱいある
    • マウスジェスチャ
  • さっきからよく落ちてるけど原因は拡張側?本体側?
    • 拡張側が原因で落ちることは少ない
    • dev版は不安定だから落ちがち
    • わりと拡張で無理をしてもそんなに落ちちゃうってことはないだろう

Web Form 2.0の現在: 田村健人 (google)

Google グループ

  • Formsのchrome5での進捗
  • UIはほとんどなし. APIはあり.
  • operaとはちがった見た目になりそう
    • OSネイティブに近いものになる

Notification APIの紹介: 白石俊平 (http://twitter.com/shumpei)

Google Slides - create and edit presentations online, for free.

  • webアプリがユーザに通知を行うためのapi
  • growlみたいの
  • 現在はワーキングドラフト
  • chromeでの非標準的な実装のみ
  • notificationは2種類
    • simple notification
      • アイコンとテキストのみ
      • 実装必須
    • web notification
      • htmlを埋め込みできる
  • UIは実装に任される
    • ブラウザによって見た目はけっこうかわるだろう
  • ながれ
  • 最初にユーザに通知の許可を得る
    • 広告に使われることを防ぐ意図
  • ユーザー許可
    • try, catchで自分で実装

LT

google calendar for todayの紹介, 拡張内ページ間通信の実例

@makoto_kw

Google Calendar for Todayの紹介と拡張内ページ間通信の実例

  • 当日の予定を確認するextension
  • ポイントはlifetime
    • popup.htmlは短い. background.htmlは長い
    • popupでデータ取得するとロードで待たされる
    • popupはbackground.htmlを見に行くようにする
  • popupからbackgroundを見に行くにはgetBackgroundPage()
  • backgroundからpopupへ変更通知をするにはsendRequest(), sendResponse()
  • backgroundから他へ
    • sendRequest(), onRequestListener()
  • getViews()
  • http://githubcom/makotokw/
新時代のダダ漏れマイクロブロギングツール

@kentarofukuchi

Lyq: Leak Your Query

  • Lyq
  • 検索ワードをtwitterに流すツール
Social ATND

@mouri45

Google Chrome Extensions Labs - 株式会社あゆた

  • atndの拡張
  • 過去ログ検索
  • レコメンド
  • twitterのプロフィール表示
  • 同じイベントに登録している一覧
  • やっぱり開発簡単
拡張間連携とEvent Driven JS

@Constellation

拡張間連携とEvent Driven JavaScript - Constellation Scorpius

  • apiはbackgroundだけ?
  • content script領域はそれぞれ別
    • グリモンみたいにwindowが共有されていない
  • eventを使う
chrome拡張開発者のためのfirefox拡張入門

@swdyh

Chrome拡張開発者のためのFirefox拡張開発

  • swdyhさん
  • jetpack
  • google chrome extension manager
    • chrome extensionのapiを丁寧に実装して言ってる感じ
google buzzのためのchrome拡張 tagging buzzのご紹介

@norisuke3

Google Buzz のためのChrome拡張taggingBuzz - Google スライド

  • buzzにもtwitterのfavみたいにあとからみれるタグ付けがしたい
  • goodをつけたbuzzをchrome extensionで管理