Your SlideShare is downloading. ×
0
クロスブラウザ拡張ライブラリExtension.js
クロスブラウザ拡張ライブラリExtension.js
クロスブラウザ拡張ライブラリExtension.js
クロスブラウザ拡張ライブラリExtension.js
クロスブラウザ拡張ライブラリExtension.js
クロスブラウザ拡張ライブラリExtension.js
クロスブラウザ拡張ライブラリExtension.js
クロスブラウザ拡張ライブラリExtension.js
クロスブラウザ拡張ライブラリExtension.js
クロスブラウザ拡張ライブラリExtension.js
クロスブラウザ拡張ライブラリExtension.js
クロスブラウザ拡張ライブラリExtension.js
クロスブラウザ拡張ライブラリExtension.js
クロスブラウザ拡張ライブラリExtension.js
クロスブラウザ拡張ライブラリExtension.js
クロスブラウザ拡張ライブラリExtension.js
クロスブラウザ拡張ライブラリExtension.js
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

クロスブラウザ拡張ライブラリExtension.js

6,685

Published on

Firefox Developers Conference 2010 LT

Firefox Developers Conference 2010 LT

Published in: Technology, Business
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
6,685
On Slideshare
0
From Embeds
0
Number of Embeds
7
Actions
Shares
0
Downloads
4
Comments
0
Likes
3
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. クロスブラウザ拡張ライブラリ Extension.js swdyh fxdevcon 2010 11/20 LT
  • 2. ★ 自己紹介: swdyh ★ AutoPagerize開発者 ★ 次のページ自動で読み込むブラウザ拡張 ★ 去年のLTでFirefox拡張やChrome拡張 の話
  • 3. ★ 一年経つ間に、ブラウザ拡張にいろいろ 動き ★ 2010/03 Jetpack SDKがでた ★ 2010/06 Safariにも拡張機能 ★ 2010/10 Operaにも拡張機能
  • 4. ★ いろんなブラウザに向けて        拡張を書く時代
  • 5. ★ JSとHTMLで書ける拡張だけでも ★ Chrome拡張 ★ Firefox拡張(Jetpack) ★ Safari拡張 ★ Opera拡張
  • 6. ★ でも、細かい部分がけっこう違って 実際作ってみると大変!
  • 7. ★ 例えば、新規タブでURLを開くコード
  • 8. // Jetpack require('tabs').open({ url: url }) // Chrome chrome.tabs.create({ url: url }) // Safari safari.application.activeBrowserWindow.     openTab().url = url // Opera opera.extension.tabs.create({ url: url })
  • 9. ★ こういう面倒な手間を減らしたい
  • 10. ★ Extension.js
  • 11. ★ 設計方針 ★ 複数のブラウザ向けの開発を楽にする ★ 拡張の生成や変換はしない ★ あるブラウザしかない機能や違いが大 きい部分は対象にしない ★ どのブラウザでもある機能、でもAPI が違うというのを対象にする ★ APIをラップしたライブラリ
  • 12. ★ 進捗 ★ まだ少しだけ ★ いま出来てるのは、Contentスクリプ ト用の部分 ★ ↑はAutoPagerizeでは使ってる
  • 13. // Jetpack onMessage = function(res) { console.log(res) } postMessage('data') // Chrome chrome.extension.sendRequest('data', function(res) { console.log(res) }) // Safari safari.self.addEventListener('message', function(event) { console.log(event.message) }) safari.self.tab.dispatchMessage('data')
  • 14. var extension = new Extension() extension.postMessage('key', ’data’, function(res) { console.log(res) })
  • 15. ★ ブラウザ間の差異を気にせずすっきり
  • 16. ★ これから ★ Backgroundプロセスの方のAPI ★ Operaも対象に
  • 17. ★ Extension.js ★ https://github.com/swdyh/extension.js ★ ありがとうございました

×