@kyanny's blog

My thoughts, my life. Views/opinions are my own.

vc-git の vc-annotate をコンパクトな見た目にする

vc-annotate は Emacs のキラーフィーチャーと言っても過言ではない便利な機能だが、 vc-git でパスの深い位置にあるファイルを annotate すると肝心のコードが隅に追いやられてしまって見づらい。 v キーでアノテーションのオンオフをトグルできるが、キーバインドを忘れがちだし、 author と変更日時まで隠れてしまうとそれはそれで困る。

vc-annotate は内部的に git blame コマンドを利用しているが、引数もろとも vc-git.el でハードコードされており、残念ながらここをカスタマイズする標準的な方法は提供されていない。幸いコマンドを実行する部分が個別の関数になっているので advice で上書きできる。

(defadvice vc-git-annotate-command (around vc-git-annotate-command activate)
  "suppress relative path of file from git blame output"
  (let ((name (file-relative-name file)))
    (vc-git-command buf 'async nil "blame" "--date=iso" rev "--" name)))

advice 適用前。表示部分の多くの部分をファイルパスが占めており、肝心のコードがほとんど見えない。

f:id:a666666:20140816021445p:plain

advice 適用後。オリジナルの引数から "-C" "-C" を抜いた。これでファイルパスが表示されなくなった。

f:id:a666666:20140816021504p:plain

git blame--date オプションを変更して日付部分を短くするのも試してみたが、 vc-annotate がコードの各行を色づけする際に利用しているパーサーの正規表現と相性が悪いようで色がつかなくなってしまったので、日付はデフォルトのままで我慢している。

Say hello from Philippines

#philippines #manila #sunset

先週の日曜から出張でフィリピンに来ている。 Quipper のマニラオフィスが首都マニラのビジネスエリアであるマカティにあり、一週間ほど滞在している。

目的はマニラオフィスのスタッフとの交流、そして学校訪問だ。 Quipper は現在 Quipper School という、学校の先生と生徒に向けた学習プラットフォームを提供している。マニラ勤務のスタッフは頻繁にフィリピン中の学校を訪問し、サービスを紹介したり先生や生徒が利用し始めるステップを手助けしたりしているが、開発者も自分たちが作っているサービスが現場でどのように使われているのかその目で確かめ、より良いプロダクトを作る糧としよう、というのがこの出張の趣旨だ。

f:id:a666666:20140711131206j:plain

学校訪問は人生屈指の印象に残る出来事だった。僕は海外経験に乏しく、東南アジアを訪れたのもこれが初めてだったが、どんな場所か想像もつかなかった海の向こうの国で、先生たちが Quipper School に強い関心を持ち、生徒たちがとても楽しそうに我々のサービスを使って算数の問題を解いたりしている様子を間近で見られたことは、非常に良い経験になった。

Quipper School はフィリピンだけでなく、インドネシア、タイ、ベトナム、イギリス、ロシア、トルコ、スペインでサービスを展開しているが、特にフィリピンとインドネシアでの成長が顕著で、会社としてもマニラを拠点として東南アジアでのサービス拡大を目指し、ここマニラで Ruby デベロッパを積極的に採用し始めている。せっかく東京から開発者が来ているタイミングなので、マニラでのプレゼンスを高めるべくデベロッパ向けのセミナーイベントを開催した。

Web Developer Seminar -- “Working at a global startup in search for better careers as a web developer”

https://speakerdeck.com/kyanny/web-developer-seminar

英語でのスピーチは初めてで、お世辞にもいい出来だったとは言えないが、参加してくれたたくさんのデベロッパたちと交流することができた。マニラオフィスで働いている二人のデベロッパとも、このイベントを通じてオフラインでコラボレーションできたのも良い経験になった。

Book: JavaScript Ninjaの極意 ライブラリ開発のための知識とコーディング

jQuery の John Resig (とテキサス在住の白ひげのおじさん)が書いた JavaScript の中上級者向けの本。タイトルと表紙の奇抜さが気になって読んでみた。

独特すぎて評価が難しい本。独自の assert 関数を全てのサンプルコードの実行結果に使うのにはおどろいた(console.log でいいじゃん)。全体的に、一般的でない手法を採用していて異質な印象を受けた。「関数的」とか、用語も奇妙。仕事で必要なので JavaScript を習得したいという人には薦めない。高度な内容も少なくないが、そういうトピックは Effective JavaScript を読めばいい。

独特なのは意図したもののようにも感じられた。一般的なプログラミングの専門書(実用書)と比べるとセオリーに沿っていないように感じられる部分が多いが、逆に言えば「お約束」に頼っていないということ。十分な前提知識を持っていない読者にも JavaScript という言語を丁寧に説明しようとして、あえて一風変わった教え方を試みたのかもしれない(入門編にあたる章の話)。

John Resig は Khan Academy で Computer Science の学部長をつとめているそうだ。 Khan Academy はその理念からしておそらく、仕事を得るために技能を身につける職業訓練校のような性質のものではないだろう。となると John Resig の Khan Academy での仕事は、趣味や教養としてプログラミングを学ぶ人のためのものであるはずだ。そういう思想がこの本になにがしかの影響を与えた結果、ふつうのプログラミング書籍と比べて風変わりに仕上がったのかもしれない。

テクニック面では、ブラウザ検出よりも機能検出やオブジェクト検出を利用したほうが未来の変更に対して強いコードになる、という話がためになった。こういう話題こそ忍者にふさわしい。もっと踏み込んでもよかったと思う。終盤のイベント、DOM、CSSセレクタの話題はだいぶ駆け足で、やっつけ仕事な印象を受けた。 jQuery のソースコードを読む手引きにはなるかもしれない。

クセの強い本にもかかわらず、訳者はとてもよい仕事をしたと思う。訳注はたいへん丁寧で、参考文献やオンラインのリソースを細かく添えて本文を補い、補足が必要な訳語についてもしっかり解説している。 Effective JavaScript も翻訳した方らしい。この人の訳書なら名前買いしてみてもよさそうだな、と思った。

JavaScript Ninjaの極意 ライブラリ開発のための知識とコーディング (Programmers’ SELECTION)

JavaScript Ninjaの極意 ライブラリ開発のための知識とコーディング (Programmers’ SELECTION)

Submitted CFP for #rubykaigi 2014

RubyKaigi 2014 の Call for Presentations に応募した。昨年に引き続き bundle update ネタ。またかよと思われそうだけど、動機の説明からして面倒くさいこのニッチな領域にここまで強い関心を抱く人はあまりいそうにないので、「いま自分にしか出せない CFP」にはなったと思う。

応募内容を清書するのは締め切りぎりぎりになってしまったけど、常日頃から考えていることなので書くべき内容には困らず、応募後(特に reject されちゃった場合!)に「もっとこうしておけばよかった」と後悔することはないだろうな、と自信を持って Submit ボタンを押せたので満足。

My CPF is accepted. I became a speaker!

pjax を利用したサイト向けの Chrome Extension の書き方

Chrome Extension の Content Scripts を使うと Greasemonkey のようにウェブサイトを加工できて便利だが、 Content Scripts はページのロード後に一度だけ実行されるので、 github.com のように pjax を利用しているサイトではページ遷移後に期待通り実行されないことがある。

pjax は pjax:success などの独自イベントを発火するが、 Content Scripts はサンドボックス環境で実行されるので pjax が発火するイベントを Listen することができない。しかし DOM の変更時に発生するイベントを Listen することはできる。

DOM の変更を検知するためには DOMSubtreeModified が利用できるが、このイベントは DOM Level 3 で deprecated になってしまった。 Mutation events も同様なので、 MutationObserver を使うのがよい。 WIP Pull Request Unhighlignter for GitHub では MutationObserver を利用した。

https://github.com/kyanny/chrome-ext-wip-pull-request-unhighlighter-for-github/blob/134fea5c17ba261c5354ec86c50108261a77ca7c/app.js#L29-L47

MutationObserver はどの要素からのイベントを受け取るかをオプションで細かく制御できるが、設定を誤ると期待するイベントが発火されないので注意。先のスクリプトでは childList: true, subtree: true というオプションを指定して body 以下の全ての子要素(孫要素も含む)からのイベントを受け取り、イベントハンドラ内で mutation.type をチェックして childList のときのみ DOM を変更するスクリプトを実行している。