ZIPデータはわざわざダウンロードしなくてもブラウザのローカル環境で操作することができる話

Javascriptでバイナリデータを扱うというような、いわゆる変態チックなプログラミングをするのってなんかワクワクしますよね？ 玄人エンジニアのほとんどがこの手の話をした時に目がキラキラしています。 そして、Javascriptでバイナリデータを扱うことによって何ができるようになるかというと、インストールして使うようなアプリケーションの操作が、ホームページでできてしまうという事なんですね。 例えば画像データを思ったとおりに編集したり、別のアプリで作成したそのアプリ専用データを読み込んだり、色々なデータを自由に扱うことができるようになるわけです。 もちろん、バイナリデータにはちゃんとした仕様を把握する必要もあるし、バイナリアドレスで間違った扱いをしてしまうと、データ自体を壊してしまう可能性もあります。 ちゃんとデータ仕様の理解をするために、汎用データに関しては、それぞれの公開されたリファレンスを読み込むことも重要です。

ログデータは膨大すぎる話

アプリケーション開発をしていると、膨大に膨れ上がるデータをできるだけ小さく抑えたいと考えるケースが多いです。 例えば、たくさんの人がアクセスするwebサイトのログデータって、かなりサーバー・ストレージを圧迫するやっかいなデータでもあります。 だって、UserAgen（ユーザーエージェント）tというアクセスしてきたWebブラウザの情報を格納するだけでも、１００人いたらデータボリュームが１００倍になるし、一人あたり3ページ読むようなページであればそこから更に3倍ものデータ量になります。 ちなみに、このブログをみているあなたのUserAgentは、次のような感じです。

だいたい最近のブラウザの傾向だと、100バイトから２００バイトぐらいの容量だと思います。 一人平均３ページぐらいを閲覧して、１日1000人訪問するwebサイトを１ヶ月（３０日とする）運用したとすると・・・

100バイト ✕ 1000人 ✕ 3ページ ✕ 30日 = 9,000,000 (9MB)

9MBものデータが溜まっていきます。 これを１年運用すると、9MB ✕ 12ヶ月 = 108MBになります。 まさに煩悩のかたまりです。 まあ、こうしたログデータは、tgzやzipなどで圧縮すると1/10ぐらいの容量になるし、再度確認する必要がなければ、保存期限を決めて別のストレージにうつしてしまえばいいだけなんですけどね。

ZIPデータをホームページで扱うと便利になる話

上記のようなログデータ以外に、世の中のホームページではzipファイルで配布しているようなWebサイトがたくさんあります。 またデータをアップロードする時に、zipデータとしてアップすることを求めるwebサイトもあったして、それらを扱う人はきっと、サーバーにアップロードされたzipデータを、一旦自分のパソコンにダウンロードして、それを回答してようやくファイルとお目見えすることでしょう。 でも、ほとんどのWEBブラウザがHTML5で搭載したFILE APIを使えば、インターネット上のWebサイトを見ているWebブラウザの中だけでZIPファイルを圧縮したり解凍したり、中のファイルを見たりすることが可能になります。 エンジニアの人ならもうおわかりでしょう。 こうした操作が簡単にできるようになると、わざわざ容量の大きいZIPデータをサーバーに一旦アップロードしなくても、色々な操作ができるようになるし、サーバーに配置しておくべきデータを、HTML内でアーカイブすることができるようになり、めちゃくちゃパケットコスパの良いサービス提供ができるようになります。

実際のところ、ライブラリを使うと便利だという話

Javascriptで動作する、zlib.jsという便利なライブラリを使って、ホームページでzipなどのアーカイブデータの操作ができるということがわかったので、実際にそれを使ってアプリを作ってみたら、なんとまあサーバーアップロードするよりも作業時間も早くなるし、サーバー・ストレージが膨らむことも無くなり、非常に便利になりました。 zlib.jsのgithubはこちらです。 https://github.com/imaya/zlib.js/ 先日から作っている「自炊のためのブックリーダーアプリ」で、自炊した書籍データをサーバーにいちいちアップロードするという手順がなんとももどかしくて、どうしてもローカルで操作したいと思ってネットで調べていたら、できてしまったというかなり興奮する技術革新でした。

あとがき

多くのサイトで、このzlib.jsというライブラリは、node.js環境で使うケースが多く、普通に静的なHTMLのjavascriptで動作させている記述があまりなかったので、。自分でやりくりしてみて問題なくできたので、コレを利用したツールを今現在構築中です。 データベースではなくて、実際のリアルデータを扱うようなアプリやWebサービスを構築する時の必須機能になりそうなので、便利に扱えるように、zlib.jsをフォークする形で、ライブラリ化しておきたいですね。 まだそのライブラリは作っている途中なので、できたらこのブログで報告しますね。 実際のどうすりゃいいプログラムコードも、ソースを使って解説します。 今回は技術的に出来るという話と、使い方や概要などのお話だけで終わりたいと思います。