ぱすたけ日記

日記っぽいのを書きます。

YAPC::Fukuoka 2017 HAKATAにトークプロポーサル出した

トーク出した。

とのこと。各位やっていきましょう。

トークプロポーサルはこういう感じです。

ブラウザ拡張のクロスブラウザ対応についてどう向き合っているか 2017

フロントエンド界ではもう10年以上に渡って話され、最近ではBabelの登場などにより枯れてきつつあるクロスブラウザという話題ですが、皆さんブラウザ拡張開発もクロスブラウザ対応をやっていく時代になってきたのを知っていますか？

数年前まではChrome・Firefox・Safari…とそれぞれ独自のAPIや機構を有していましたが、数年前からFirefoxもChromeのAPIをベースにしたWebExtensionを導入し、今年の12月にStable Release予定のFirefox v57で従来のAPIは全て廃止され、WebExtensionに一本化されることになっています。MicrosoftのEdgeもブラウザ拡張に対応しており、そのAPIはChromeのAPIを踏襲したものになっています。またこれらの動きに伴ってW3CでBrowser Extensions APIの標準化に向けた作業も始まっています。

そのような現状についての簡単な紹介を行った後に、私が実際にブラウザ拡張を開発している中で直面したクロスブラウジングに関する話題について実例を交えて紹介を行います。具体的には以下のような話題について触れる予定です。

  • クロスブラウザ対応のための開発ツールについて
    • webpackやその他私がクロスブラウザ対応のために開発したり利用しているツールについて
      • webpackを例にどのようなbuildアプローチを取ることで複数ブラウザに対応したコードを生成できるのか
      • manifest.jsonを生成するための pastak/wemf について
      • ブラウザAPIを提供するトップレベルオブジェクト名の差異を吸収する pastak/chrome-browser-object-polyfill について
  • ブラウザ間の実装差異を如何に吸収するかというテクニックについて
    • Chrome Extensionから他のブラウザでも動くソースコードに変更するための方法について
    • 現状、どのような差異・問題がブラウザ間に存在しているのか
    • ブラウザ間の差異を吸収するために現状取ることの出来るアプローチ、または発見するためのデバッグ手法、または"勘"について