技術同人誌『探求 SVGとスクリーンショット』がいい意味で変態な本だった

12月14日に開催された『技術同人誌博覧会』で手に入れた『探求 SVGとスクリーンショット』を読みました。タイトルの時点で『おっ？』となるようなものですが、めちゃくちゃ深い一冊でした。 なお、JSとフロントエンドをそれなりに程度いじっている人向けの内容でした。

探求 SVGとスクリーンショット

第1章 簡単なSVG画像をつくる

第1章はこの本唯一の初心者向けの内容です。いわゆる普通のSVGを説明した後に、ラスタ画像・リンクの埋め込み方、モノクロ化の方法などSVG Screenshotにつながる使い方の説明をしています。 言われればなるほど…となるのですが、初めて見た使い方で驚きました。

第2章 SVG Screenshot開発機

作者の開発しているSVG Screenshotについて説明しています。SVGに付与するメタ情報の取得方法、Pupperteerを使ったスクリーンショットを撮る方法などかなりテクニカルな話が読めます。 SVGはXMLをベースにしているので、それを活かしメタ情報（リンクや元URL）を付与する考えでした。その中でも画像やリンクの情報を保持し続けるなど実用性の高い形になっていて、非常に面白いものでした。

第3章 高解像度ディスプレイで撮ったスクリーンショットを適切なサイズで表示する

端末ごとの画面密度の違いを吸収するための話です。なんとこの本ではこのテーマだけで1章を割り当てています。 画面密度を考慮して表示する方法と、画面密度を算出する方法を、作者がどのようにして探っていったかがわかる内容になっています。すごく泥臭い感じですが、臨場感があって好きです。

第4章 ScreenshotMLの提案

筆者が提案しているScreenshotML（Screenshot Markup Language）について説明しています。 スクリーンショットに付随する情報をXMLで表現することで、見た目と情報の分離を行い拡張性の高い仕様を実現しようとしています。説明中でXMLにスタイルを指定するXSLやスキーマを記述するXSDなどに触れており、読者でも独自のXML拡張言語が作れるようになっています。 独自仕様を決めるときは仕様の決めが難しいと思ってるんですが、しっかり仕様を固めていて作者の強さを感じる内容でした。

付録

『PNG画像のバイナリから解像度を読み取る』、『Blinkでの画像のNaturalSize導出過程を追う』など非常にマニアックな付録です。SVGの本を読んでいてバイナリを読み始めたときはびっくりしました。

感想

SVGスクリーンショットというと、ベクターでスクリーンショットを保存するのと思いきや、ラスター画像とメタ情報を同居させる方法。ラスター画像のメタ情報より手軽に扱えるので面白い考え方だと思います。 作者はスクショなどのキャプチャを保存・共有するGyazoというサービスを提供する会社に所属しているようで、仕事と趣味が近そうで非常に楽しそうです。この本自体も同社の運営するScrapboxで執筆したらしいです。すごい（けど、意味がわからない）

私はNode.jsでXMLを作る仕事をしているのですが、仕事にも活きる内容が書いてあったので大満足です。SVGやXMLに興味のある方に読んでもらいたい同人誌でした。