ライフハッカー［日本版］

編集部：今回、Firefoxはメジャーアップデートを行うことになりましたが、ベータ版を利用してみると、すぐに動作の高速化を体感できました。実際にはどういった改良が行われているのでしょうか？

浅井：Firefox 4ではレンダリングエンジンを大きく書き換え、3Dのグラフィックスにも対応するなど、動作面のパフォーマンスを大幅に向上させました。また、我々はこれから注目されるであろう処理の重いタスクや、Webの高速化によって実現してくる。タスクでの動作を重視した開発を行っています。Javaスクリプトの処理を高速化させたのも、その一つですね。今回、Firefox 4はモバイル向けにもリリースを行いますが、これも将来的に登場してくる、端末や技術に合わせたプラットフォームの移植を進めています。

一方で、他のブラウザでは一部のベンチマークに特化しているため良い結果が出ていますが、残念ながらほかのソフトでは速く動きません。重たい数値演算処理を行うようなベンチマークを取ると、必ずしも高速なブラウザでは無いんです。さらに、既存のWebページが速く動くように開発されたブラウザでもあることも、Firefoxとの大きな違いだと思います。

※ クリックで拡大

編集部：3Dグラフィックスの対応などでは、GPUによるグラフィックアクセラレーション機能の恩恵も大きいと思われますが。

浅井：アニメーションの処理などは、GPUの支援のおかげで従来より綺麗に動きますね。CPUへの負荷も小さくて済みます。さらに、WindowsとMacではサポートするAPIが異なるので、動作にも違いがあるんです。Windowsは、Direct2Dが良くできているので、アニメーション表現などのパフォーマンスは高くなります。

編集部：今回のアップデートでは高速化だけでなく、機能についても新たに実装されたものが数多くありました。

浅井：変更点の量を比較すると、Firefox 4は、Firefox3から3.6に移行したときの倍ぐらいはあるんです。また、機能を増やしただけでなく、これまでのバージョンアップでは手を加えなかったユーザーインターフェイスについても、今回は大幅に変更しています。この改良を行うために、我々は現在世界中にいる約23万人のFirefoxユーザーが、普段どういう操作をしているかの統計データを取って、ボタン類などは必要なものに絞り込みました。さらに、複数並んだメニューを順に開いて探すようなことがないように、多くの機能を左上のアプリケーションボタンへと統合しています。これは、Webアプリを利用する際に、なるべく表示する要素を少なくしたくなるユーザー心理を考慮したものでもあります。

編集部：こうした改良が必要になったのは、やはり以前とはWebで提供されているコンテンツが変化してきたせいもあるのでしょうか？

浅井：そうですね、Webで今使われている技術はもちろんですが、我々は次に実現するであろう技術に注力するようにしています。加速度センサーなどは、実は2年ぐらい前から既に実装しているんですよ（笑）。この技術については、モバイル版のFirefoxを作ったことで、ようやく真価が発揮できるようになったと考えています。

編集部：モバイル版のFirefox 4は、Android向けのリリースを予定しているわけですが、今後はFirefoxをほかのプラットフォームに投入する機会も出てくると思います。現時点でMozillaさんが一番注目しているものは何でしょうか？

浅井：やはりiPhoneであるとか、閉鎖的なWebの使い方をしているところには、適切なブラウザを提供したいと考えています。ただ、なかなかアップルが許可を出してくれないんですよね。当初はエンジニアが開発を進めていたのですが、SDKに違反しそうだというのが明確になって、結局コードは捨てられてしまいました。

我々は、Android版を開発するにあたり、PC版と完全に同じ描画結果を返すエンジンを利用して、可能な限り機能を無効化しないというポリシーで取り組みました。というのも、Windowsをはじめ、AndroidやiPhoneなどのOSには、それぞれ異なるブラウザが標準で入っていますよね。でも、WebKitが一部共通しているとはいえ、中身は全然違うんですよ。SVGアニメーションがこっちでは動きませんとか。キャンバスに二次元で描画してみると、実は描画結果が異なりますとか。テキストのサイズも勝手に書き換えちゃいますとか。プラットフォームに特化した狭いWebになりかけているので、どこでも同じものが動くWebを提供するというのが、我々の大きな目標ですね。

編集部：PC版と同じエンジンを利用したのには、表示の再現性を重視したのが大きな理由だということですか。

浅井：モバイル版のサイトは、PC版より規模が小さくなるわけですが、そのために新しいタグや書き方を作るというのは違うと思うんです。Webの技術というのは、例えばHTML5のタグを見ても分かるように、どんな環境でも動くようになるべく機能を広く考えているわけですよね。せっかくマルチデバイスで動くようになっているのだから、それをそのまま実装すればいいんです。後は、コンテンツ側で画面サイズに応じて表示が切り替わるようにコードを書くのが自然ですし、将来の可能性を潰さずに済みます。

編集部：今回Android版を開発するに当たって、PC版とは異なる工夫を行った点はありましたか？

浅井：モバイル版については、特にインターフェイスの研究を密に行いました。例えば、他のブラウザではタブを切り替えるだけでも、メニューを開き、プレビューをスライドさせて選択する必要があります。しかし、Firefox 4ではサイドに開いているタブのサムネイルが表示されるので、2タッチで素早くサイトを切り替えられるんです。ほかにも、間違って閉じたタブを復元する機能や、オフラインでサイトを表示するためにPDFとして保存する機能も用意しています。また、モバイル版は操作性に難がある分、機能をカスタマイズしたいという希望は多いと思うんです。まだ正式版が登場していないにも関わらず、Android版のFirefoxに向けたアドオンは、既に200以上開発されていますが、これはユーザーにとって大きなメリットになるのではないでしょうか。

編集部：ブラウザの開発を進める中で、Mozillaでは今後どのようなコンテンツの登場を想定しているのでしょうか？

浅井：一番身近なところでは、これからもソーシャルなコンテンツが注目され続けることになると思います。その一方で、プラットフォームの力が上がってきたので、デスクトップで行っていた作業が、Webにスイッチする機会も増えてくるでしょう。例えば、以前ですと画像編集などは速度的に厳しかったのですが、今ならちょっとした明るさの補正などをブラウザ上で変更できますよね？　特に、我々はオーディオを強くプッシュしているんですが、音声をリアルタイムで変換するのは、すごく楽しい力を秘めていると考えています。

編集部：Firefox 4で実装されたタブ管理の機能は、Webアプリとの相性がとてもよさそうですね。

浅井： タブを管理するパノラマ機能は、Firefox 4の大きな特徴の一つです。これは開いているタブを俯瞰で見られるという意味ですが、グループごとにまとめることで、その中のタブだけを表示できるようになっています。この機能を利用すれば、例えばプレゼンの際に表示する必要があるサイトを、前もって用意しておくことなどもできます。さらに、仕事用のグループを表示している裏で、こっそり遊び用のタブを開いておくこともできるわけです（笑）。

多数のタブを開くユーザの需要にどう応えるかについては、ブラウザの個性が見られるところです。タブが増えるとタブバーが横スクロールするものが多いです。Chromeでは、開けば開くほど1つのタブ幅が狭くなり、最後にはアイコンすら表示されずタブが区別不能になります。

タブをWindowsのタスクボタンのように重ねてグループ化する、Operaのようなタイプでは、マウス操作が上手くできないと、タブの移動のつもりで誤ってグループ化してしまったり、誤ってグループ同士を重ねて1つにしてしまうと簡単に2つのグループに戻せなかったり、まだユーザに対する優しさが少し足りないように感じます。

パノラマ機能では平面上に並べて視覚的にグループ化しますが、人間は平面上に置いているものの方が場所を把握しやすいからです。

編集部：昨年12月には、GoogleがWebアプリストアを開設しました。Firefoxを利用して何かの作業をしようとすると、やはりWebアプリを利用することになるのでしょうか？

浅井：利用する機会は今後増えてくるかもしれませんし、ブラウザのインターフェイスは、Webアプリの利用を想定したものに変わっていくでしょうね。ただ、課金システムを介してブラウザにインストールされるために「アプリ」という名前が付いていますが、そこで入手できるものは、従来あったWebサービスと何ら変わりはありません。なので、私の個人的な考えですが、今あるWebアプリストアというのは、ブックマークをちょっと見やすくしたものに過ぎないと思っています。

また、Webアプリについてはマーケットに問題があると我々は考えています。「Chrome Web Store」はオープンな場であると言われていますが、結局はGoogleのシステムを使って公開することしかできませんし、宣伝についてもGoogleの決めたルールの中でしか行えません。でも、例えば女性向けやビジネスマン向けというように、アプリを入手できる場所はいくつもあった方が便利ですよね？　そこで我々は、マーケットのシステムに特定のベンダーのものを使うのではなく、オープンな Web の技術を利用したマーケットシステムを提案しています。

編集部：Mozillaで公式のアプリを提供する場を設けることは無いのでしょうか？　例えばアドオンについては、ポータルをMozilla側で用意しているわけですが。

浅井：Mozillaでマーケットを作るつもりはありません。我々はあくまでも皆さんがWebを開発する上での土台を提供する側でありたいと思っています。これは業界の常になりますが、誰かがオープンな技術を提供しないと状況は変わっていきませんよね。かつて、Internet Explorerの独占だったWeb業界を変えられたように、我々はクローズドなマーケットに対抗するような選択肢の一つでありたいと考えています。

編集部：ユーザーにとっては非常にありがたい考えだと思います。非営利法人のMozillaだからこそ実現できることも多そうですね。

浅井：Mozillaの開発では、プライバシーを重視していることも大きな特徴だと思います。例えば、同期機能についてはGoogle Chromeでも提供していますが、残念ながらGoogleアカウント紐付けですから、ブックマークなどの個人情報は彼らに管理されているんです。こうしたことを避けるために、Firefox 4では同期データをクライアント側で暗号化してから送信するようにしています。なので、Mozillaの管理者がSyncサーバーを見ても、データの中身をのぞき見することはできません。

また、最近ではあらゆるWebサイトで、Cookieなどを利用したユーザーのトラッキングが行われていますよね。ユーザーがどのサイトにいって、どんな買い物をしたのかというのが全部監視される世界が近づいているわけです。そこで、最近ではブラウザに「Do Not Track」と呼ばれるような、行動追跡を防ぐ機能が実装されはじめています。Google などはブロックリスト方式の提案をしていますが、Firefox 4ではもっとシンプルに、設定一つで行動追跡を拒否できる機能を用意しました。これは、 クロール拒否を明記した robots.txt ファイルを置いたりリンクに nofollow 属性を付けてリンク先のクロールを禁止したりするのと同様に、より包括的な行動追跡拒否システムを実現するためのものです。

編集部：こうして話を伺っていると、完全にプライベートなWeb環境を作るには、まだまだハードルが高いのでしょうか？

浅井：難しいと思います。例えば、先ほどお話しした同期機能であれば、個人情報を収集するような実装をするクライアントが絶えないわけです。なので、我々のように適切な実装を続けていくような存在がいなければ、業界は変わらない、もしくはもっと酷くなっていくでしょうね。

編集部：ほかにも何かMozillaさんならではの活動というものはあるのでしょうか？

加藤：Mozillaではインターネットの公共性維持や技術革新の一環として、世界中の環境団体と協力して自然環境を守る活動を行っています。Firefox 4のリリースキャンペーンの一環としては、3月1日に「Virtual Park ―トゥムクマケ―」というウェブサイトを立ち上げました。これは、Firefox 4のコードネームの元になったトゥムクマケ国立公園について知り、自然やWebの環境について考えるきっかけにしてもらえればとの思いで立ち上げたプロジェクトです。またMozilla は、WWF のトゥムクマケおよびアマゾンの自然保護活動に賛同しており、このサイトに用意したリンク先から寄付していただくこともできます。

編集部：ウェブサイトというのは、Firefox 4のリリースと何か関係するような内容になっているのですか？

加藤：サイト上では、CSS transformやCSS transitions、Audio Date APIなど、Firefox 4で導入された最新のWeb技術が使われており、将来のWeb体験を先取りできるような内容になっています。加えて、Twitterによる参加型のオンラインテーマパークになっているのも大きな特徴で、皆さんにトゥムクマケに関する話題をつぶやいていただくと、それがグリッド状に並んでパークの規模がどんどん広がっていきます。

編集部：例えば「トゥムクマケって何？」といった話題や、Firefox 4の感想などをツイートする感じですかね？

加藤：「♯mozpark」のハッシュタグを付けたツイートが土地のように表示されるようになっているので、「トゥムクマケって何？」「ブラジルにあるらしいよ！」というように、ツイートが広がっていく様子を、パークを探検しながら楽しんでいただきたいと考えております。

浅井：このサイトの開発は「アマゾンの広い自然を体感してほしい」、そんな思いから始まりました。現在はまだテスト運用なので規模は小さいのですが、デモ用にツイートを2万件ほど並べてみたところ、アマゾンの広大さを感じ取れるような、スケールの大きいサービスになったと自負しています。

ツイートはパークの中心から配置されていくのですが、緑の濃さにグラデーションがあるのが分かりますでしょうか？　実はパークでは、ツイートした時間帯が現地時間で遅いものほど、暗く表示されるようになっています。開発のテストは大抵夜に行うのですが、これは現地時間でいうとちょうど昼になるんです。だから、テスト版のサイトでは中心部ほど明るくて、そこから濃い緑が広がっていくようになりました。

編集部：最終的には年輪のような模様ができそうですね（笑）。

浅井：ところが、実際はそのようになりません。というのも、広がり方にも意味が持たせてあって、似たようなつぶやきは近い場所に配置されるようになっているんです。なので、場所によっては半島のように横に伸びていく場所も出てきます。自分がツイートした土地へはリプライによるリンクからアクセスできるので、周辺で似たような話題を取り上げているツイートを見ていただくのも楽しいと思いますよ。パークの全景の中で急に伸びているような場所があれば、最近の話題は何だろう？　とズームしていただくのもいいかもしれません。

また、ツイートをクリックして中身を表示させると、土地が盛り上がるように高くなっていくので、パークで人気を集めるようなツイートを考えるのも面白いと思います。まぁ、人によってはカチカチカチと何度もクリックして、自分の土地を高くする人も出てくるかもしれませんが（笑）。

※ クリックで拡大

編集部：ただタイムラインで見るのではない、新しいTwitterの楽しみ方を提案しているわけですね。

浅井：もちろん、ツイートをただ集めるだけではなく、そこからアマゾンの自然に興味を持っていただくような工夫もしています。例えば、特定のキーワードが含まれているツイートの上には、木や動物のシルエットなどが表示されるような仕掛けを用意しました。

編集部：どんなアニメーションが表示されるんだろうと、ツイートするのも楽しくなりそうですね。

浅井：あるツイートでは「きゃーきゃー」と書き込まれたので、木が2本立ったこともありますよ（笑）。また、動物のシルエットに触れたりクリックすると、写真や情報が表示されるので、図鑑のようにアマゾンの知識を得ることも可能です。

編集部：ほかにも、今回のサイトで新しい技術が導入されているような場所がありますか？

浅井：音声をオンにすると、大自然をイメージさせるようなBGMが流れるのですが、実はここにもFirefox 4の新しいAudio Date APIの技術がこっそりと組み込まれていて、音声に合わせて画面下にはヒストグラムが表示されるようになっています。

これまでビデオやグラフィックについては、画像検出などの処理を行えたのですが、実はオーディオについては操作する仕様がありませんでした。ただ、最近ではゲームやマルチメディアがWebでも使われてきていますので、今回音声の合成や編集などを行うAPIを用意させていただきました。

また、先ほどツイートをクリックして文字をライトボックス状に表示させましたが、このときのアニメーションが、CSS transitionsを利用したことで非常に滑らかになりました。これまでのCSSなどでは単純な平行移動や拡大・縮小しかできませんでしたが、Firefox 4では形が歪むようなアニメーションも表示させられます。これは、通常のCSSにコードに追加するだけで表現できるので、Web開発者にとってはインパクトのある技術ではないでしょうか。

さらに、パーク上の土地は設定で表示を歪ませているだけなので、文字の選択や検索なども通常のWebと同じように行えます。上から下へと流し込むだけでなく、コンテンツを歪ませて配置するのも新しいサイトの演出になるかもしれませんね。

その他では、SVGで描かれた木についても、マウスでポイントすると葉の形や座標をリアルタイムで変えて、ザワザワと風に揺れるようなアニメーションを動作させられます。SVGは拡大縮小しても劣化しないベクター形式の画像で、最近では Internet Explorer 9がサポートしたことでも再び注目されていますが、アニメーション機能についてはFirefox 4などだけがサポートしています。

編集部：今回のようなAPIを利用したサイトを、別のブラウザやFirefox3.6で開くとどうなるのでしょうか？

浅井：例えば、Google Chromeなどでは、CSS transitionsやSVGを利用したアニメーションの一部は動きますが、Audio Date APIのように我々が重視して実装したものは動きません。また、Firefox 3.6でVirtual Parkを開くと、先ほど紹介したCSS transitionsを利用したアニメーションや、SVGアニメーションは再現されないんです。

編集部：こうして比較してみると、コンテンツのリッチ感が全然違いますね！　Firefox 4を導入するユーザーが増えるきっかけになりそうです。

浅井：一部では、ブラウザのバージョンが上がったときにサイトを作り直さなければいけないとか、サイトは古いブラウザに向けた技術でサイトを作らなければいけないと誤解されているところがあります。しかし、実際には互換性を維持した上で、ユーザーにとって致命的にならない範囲で新しい技術を入れていくというのが、最近の流行りになっているんです。今回のサイトでは、Audio Date APIなどはあまり目立たせずに使っているのですが、新しい可能性を生み出す技術なので、いつか皆さんに使っていただくきっかけになればと思います。