「標準」と「開発」のエキスパートが見据える「これからのWebサービス」の姿

「Web開発者」が知っておくべきWebプラットフォーム進化の方向性

2017/03/10 14:00

　日々、新しい技術が生まれ、進化を続ける「Web」の世界。変化の激しい世界に身を置き、サービスを開発、提供することに関わるエンジニアは、この変化をいかに捉え、活用していけば良いのだろうか。今回、日本屈指のWeb企業であるYahoo! JAPANで、数多くのサービス構築に携わってきた岡部和昌氏と、Mozilla Japanで技術戦略マネージャを務め、WebやHTML周辺技術の動向に明るい浅井智也氏が「Web標準やブラウザの進化の方向性」「実サービスへの新技術の取り入れ方」「Web開発に携わるエンジニアが持つべき心構え」といったことをテーマに語った。

HTML5は「ブーム」を過ぎ、現場が実際に使える「道具」に

浅井：今回の対談は、Web標準やブラウザの進化に関することがテーマのひとつということで、私がいつも講演で使っている「テクノロジーマップ」を持ってきてみました。

岡部：……すごい量の標準仕様ですね（笑）。これを見ると、2014年にW3Cに勧告された「HTML5」に続く形で、「ECMAScript」「CSS」という各技術要素も2015年にひととおり新しい物に更新されたことが分かります。

浅井：はい。未来のWebを支える新しい標準技術として「HTML5」がブーム的に話題になるという段階は過ぎて、周辺技術の各ブラウザへの実装も進み、ようやく現場で実際に使うための足回りが整ってきたというのが、2016年の状況だったと思います。Webアプリのパフォーマンス面も進化して、スクウェア・エニックスが、スマホゲームとして有名な「乖離性ミリオンアーサー」を、UnityのWebGL出力を利用したPCブラウザ版として「Yahoo!ゲーム」でリリースしたことも、昨年末に話題となりましたね。

岡部：「WebRTC」や「WebVR」といった、マルチメディア系の技術にも、盛り上がりが感じられます。

浅井：そのほかにも、ブラウザを介してユーザー側のハードウェアを操作するためのAPIや、「HTML Components」など、さまざまなサービスを作っていくための「基盤」を支える技術が着々と整いつつあるというのが、今のトレンドです。

岡部：図で見るとキレイにまとまっているように見えますが、それでも「多い」というのが正直な感想ですね（笑）。ブラウザへの実装状況についてはどうでしょう。一昔前とだいぶ雰囲気が変わってきているようにも思うのですが。

浅井：そうですね。標準化・実装現場の感覚としては「ChromeとFirefoxが実装すれば、とりあえず標準として使える。Edgeは後からついてくる」（笑）みたいな雰囲気になっていますよね。以前は、これに「Safari」がなかなかついてきてくれないというのが悩みのタネになっていたのですが、こちらも昨年春にSafariテクノロジープレビューを公開し始めた頃からちょっと状況が変わってきています。「Safari 10」では「ECMAScript 2015」の完全サポートから「IndexedDB」や「WOFF 2.0」、またApple Payと連携する課金APIなども取り入れられていました。

　特にペイメントについてはビジネスとしてサービスを作られている方には重要だと思います。こうした動きはChromeやFirefox、Edgeでも追従する方向にあり、今後の実装の動向に注目ですね。こういったものがWebできちんと使えるようになってくると、ビジネス的にも「ストアの取引手数料が30％かかるネイティブアプリではなく、Webアプリとして実装したい」と思われるケースが増えてくるのではないでしょうか。

岡部：フロントの部分で言えば、特に日本においては、浅井さんも長く関わられていた「HTMLでの縦書き」が、Firefoxから各社のブラウザでサポートされるようになったというのが、結構大きいのではないかと思っています。

　「縦書き」に限らず、あることを実現するために「裏ワザ」的な方法を駆使してやってきたようなことが、「Web標準」として簡単に使えるようになるというのは、現場としては助かりますね。

浅井：個人的な印象として、Yahoo! JAPANはほかのサイトと比べて、ユーザー側の互換性を非常に重視したサービス提供をされている印象があります。たとえば、1つのサービスに対してフル機能版と、サブセット版の2つのページを用意されるようなケースは、ポータル系のサービスでもあまり多くないような気がするのですが、現在のWeb標準やブラウザへの実装状況から、サービス提供の方向性に変化などは出てきていますか。

岡部：自分は10年以上Yahoo! JAPANにいますが、たしかに、これまでは環境があまりリッチでないユーザーを基準にサービス提供することを重視していましたね。ただ、昨年には、マイクロソフトが各OSで旧バージョンのInternet Explorerについてサポートを打ち切るといったポリシー変更を実施しましたし、Yahoo! JAPANとしても能動的に新しいことをやれる機運が出てきているように感じています。

　古いブラウザ環境を含めて、可能な限り広くサービスを提供するという基本は守りつつ、「より新しい環境のユーザーには、より高機能なサービスを提供したい」といった視点で、いろいろと新しいことを試している部署もありますよ。

浅井：「ネイティブアプリか、Webアプリか」の観点でいえば、Webアプリ自体のパフォーマンス向上に加えて、新たに出てきた「プログレッシブWebアプリ」のような考え方も、「Webアプリの再評価」を後押しすると思っています。「プログレッシブWebアプリ」は、「事前にストアから大きめのアプリをダウンロードしてインストールする」という、ネイティブアプリ導入にまつわる手間を省き、インストールの手間や容量が気になるならインストールせずブラウザ上で直接利用もできるし、ストアに行かずともブラウザ上で簡単にアプリとしてホーム画面にインストールもできる形態なのですが、こういうものが増えてくることによって、今後ますます、ネイティブアプリとWebアプリの使い分けの境界線はあいまいになっていくのではないでしょうか。

岡部：Yahoo! JAPANでは現在、複数のサービスでネイティブアプリとWebアプリの双方を提供していますが、「プログレッシブWebアプリ」は、これらと直接関わってくる技術ですね。サービスの内容によって、どの形態のアプリが最適かという「向き不向き」があると思うのですが、ユーザー体験をより良いものにできる可能性を秘めているという点で、個人的には期待して動向を見守りたいと思っています。

浅井：「HTML5とその関連技術の将来」というところで言うと、既にPCやスマホ向けのアプリだけでなく、組み込みブラウザを持つプリンタやインターホンなどはもちろん、あらゆる電子機器のUI部分をHTMLで書けるような可能性が出てきています。たとえば、Mozilla Japanでは組み込み製品でブラウザエンジンを使いやすくするプロジェクトをSoC（System on a Chip）ベンダーなどと共同で進めています。HTMLに関わるエンジニアの方は、こういった分野も含めて、視野を広げられる時代になってきています。

岡部：「HTML」と「ECMAScript」が扱えれば、どの業界で、どんなデバイスに関わることになったとしても、作りたいものが作れるような世界が近づいているんですね。

岡部和昌（おかべ・かずまさ）氏

　大学で応用化学を学んだ後、2006年にヤフー株式会社にWebデザイナーとして新卒入社。以来、同社にて数多くのサービス構築を手がける。現在はHack推進部所属。また、同社において、ある分野に突出した知識とスキルを持つ第一人者に与えられる「黒帯（ウェブデベロップメント）」（参考：『たった1％の狭き門。黒帯制度とは？』）の称号を持つエンジニアでもある。

サービスへの新技術導入を促進する可能性を秘めた「Extensible Web」

浅井：岡部さんは、Yahoo! JAPANでウェブデベロップメント分野の「黒帯」という称号を持って活動しておられますよね。「黒帯」としての活動には、具体的にどのようなものがあるのでしょうか。例えば、Yahoo! JAPANが提供するサービスへの新技術の導入に関して、何らかの影響を与えるようなことはあるのですか。

岡部：これはYahoo! JAPANに限った話ではないと思うのですが、エンジニアが日々の業務や運用ばかりに忙殺されていると、その中に新しいものを取り入れることが難しくなっていきます。「黒帯」の重要な仕事のひとつとして、社内外に向けて「こんな新しいものがある」ということを「伝える」ことがあります。

浅井：具体的には、どのような方法で「伝える」のでしょう。

岡部：いろいろありますが、社内での「勉強会」もそのひとつです。Yahoo! JAPANでも、「新しいものを積極的に取り入れていこう」という機運は高まっていて、お昼に有志が自主的に集まって、新しいことに関する知識を共有するライトニングトーク大会をやっていたりします。また、外部の有識者の方を勉強会に招いて、その方から教えていただくといったこともありますね。

浅井：Yahoo! JAPANでは、ゲームやエンターテインメント分野のサービスも多く提供されていますよね。「新しい技術の導入」という点では、こうした分野が取り組みやすいのではないかと思うのですが、いかがでしょうか。

岡部：たとえば「VR」などは、今のところYahoo! JAPANがどのような形で取り入れていくかというのは未知数ですが、サービスの受け手側としては非常に分かりやすい「先進技術」だと思っています。例えば、Yahoo! JAPANが先日主催したハッカソンイベント「Hack Day 2017」でも、VRを取り入れたものがいくつか出てきていました。社内のエンジニアも参加できるので、こういった先進技術を試して発表できる環境が用意されていることはよいと思います。

浅井：「黒帯」である岡部さんに対して、社内から「こういう新しいサービスをやりたい」とか、「こういう問題を解決したいがどうしたらいいか」というような相談が、より若いエンジニアから持ちかけられることもあるのですか。

岡部：それもありますね。そういった相談に対しては具体的な「解決策」よりも、いくつかの選択肢を示して、それを選んでもらうような感じです。まずは「こういった技術や、やり方がある」ということを知ってもらうことが大事だと思っていますので。

　ただ、いつも悩ましいと思っているのは「どの技術をどの段階で取り入れるべきか」のタイミングですよね。サービスを提供している立場からすると、新しく出てきたものをすぐさま取り入れるというのは現実的ではありません。そのあたりについて、何かお考えはありますか。

浅井：「標準」は定められているとしても、そこから派生するフレームワークやツールの変化は本当に目まぐるしいですからね。その中から、どれかを取り入れるのには慎重にならざるを得ないというのは、当然だと思います。個人的には、そうした状況の中で光明になると思っているのが「Extensible Web」という考え方です。

　これまで、Web標準やブラウザ実装というのは「何年かおきに大規模な更新」が行われるのが常で、そのことが新たな技術の導入に対するハードルになっていたと思います。Extensible Webでは、標準API、ブラウザ実装、さらにそれらによって実現されるライブラリを含めて、短期間でインクリメンタルに更新していくことで、Webプラットフォームの進化そのものを加速していこうという考え方が基本になっています。

　互換性についても、一定のルールのもとで維持しながら、少しずつ変えていく方針になります。ですので、採用する側もある時点で大規模な入れ替えを決断するのではなく、様子を見ながら少規模に対応していけるようになるはずです。

　つまり、理想としては、すぐに古いものになってしまう可能性がある新しい技術の導入を大きな覚悟で決断するのではなく、今よりも少し気楽に取り入れていけるような環境になるのではないだろうかと期待されているのです。私としても、そうした開発スタイルと採用スタイルが、Web開発の領域全体に広がっていくと良いと思っています。

岡部：「インクリメンタルな進化を継続する」という考え方が主流になるとすれば、われわれのようなサービスを開発している側からの積極的なフィードバックが、さらに重要になりますよね。

浅井：そのとおりです。現状でも「標準に合ったコードを書いているのに、特定のブラウザでうまく動かない」といったケースに頭を悩ませている開発者の方は多いと思うのですが、そういった場合は「自分で何とか回避策を講じる」のではなく、ブラウザベンダーに対して声を上げてほしいと思っています。そもそも「標準に合ったコードが動かない」のは、ブラウザ側のバグが原因であることも多いんですよ。

岡部：たしかに、現場側には「ブラウザベンダーとコミュニケーションする」という発想はあまりないかもしれません。どちらかといえば「ブラウザに合わせて作る」といった意識のほうが強いと思います。

浅井：たとえばMozillaでは、ブラウザベンダーに対してブラウザの違いによる挙動の非互換問題を報告できる「WebCompat」といったサイトを運営しています。このサイト、UIは英語ですが、英語でうまく説明できないという人は、日本語で書いてしまっても大丈夫ですよ。日本語ができるスタッフがフォローアップしますので。

岡部：英語でのコミュニケーションが壁になっている人にはありがたいですね。また、ベンダー側にもそうした声を受け入れる体制があるということが分かっていれば、自分でコードをコントリビュートするようなことまでは難しい人にとっても、敷居は大きく下がると思います。

浅井：ぜひ、あらゆる手段を使って、多くのWeb開発者に、ブラウザベンダーへ直接声を届けるということを実践してほしいと思っています。実際に、FacebookではGoogleやMozillaと協力して、ブラウザキャッシュの仕組みを変え、ページの再読込にかかるリソースの削減とロードパフォーマンスの向上を実現するという取り組みを行いました（参考：『This browser tweak saved 60% of requests to Facebook』）。

　Yahoo! JAPANのような日本のサービス事業者も、ブラウザベンダーと「日本だとこうだ」「こういう実装や仕様があれば、ユーザー体験はもっと良くなる」という話を、活発にできるようになるといいですよね。互いに協力しながら、日本発でWebプラットフォームを進化させるようなことができれば、すばらしいと思っています。

浅井智也（あさい・ともや）氏

　Mozilla Japan技術戦略マネージャ。学生時代にWeb技術文書や書籍を翻訳、Firefox 1.0からMozilla製品の日本語リリースを担当。インターネットをすべての人々の利益のため発展させるMozillaの目標に共感し、大学院卒業後Mozilla Japanに参加。最新Web技術の啓蒙をしつつ、Webの領域拡大のため、企業や教育機関と共に製品展開、研究開発、コミュニティ作りをリードしている。

2人のエキスパートから、将来の「エキスパート」へのアドバイス

浅井：岡部さんは、どのような経緯でWeb開発者を目指されたのですか。

岡部：私の場合は、完全に「趣味」からでしたね。Webの技術やサイトを作ることが好きでYahoo! JAPANに入り、実際の業務でフロント系を覚えるうちに「この分野を究めたい」と思うようになりました。長く組織の中にいると、途中で管理職的な立場を求められるようにもなるのですが、自分としては、企業の視点で人的リソースをマネジメントすることよりも、Web開発者としての自分の力を高めつつ、それを人に伝えることを続けたいと思ってきました。もちろん、そのためには足りない知識やスキルだらけでしたので、調べて、人に聞いて、覚えるといったことを常に繰り返していましたね。そうした経緯があって、今では「黒帯」という称号をいただいています。

浅井：そうした経験をしてこられた岡部さんの立場で、これから「エキスパート」を目指そうと思っている若手のWeb開発者に対してアドバイスするとしたら、どんなことでしょうか。

岡部：そうですね。特にこの業界では、毎日のように新しい技術が出てきているので、追いつくのが大変だと思いますが、そうした技術は、必ず、従来あった何らかの「課題」を「解決」するために出てきているのだということを理解しておくといいのではないでしょうか。つまり、ある技術を使いたいと思った時「なぜそれを使いたいのか」を自分で理解していて、人に説明できることが重要だと思っています。

浅井：たしかに「新しいので使いたい」という発想は危険かもしれませんね。特に、仕事として取り入れる場合には、自社の状況やビジネス上の課題と結びつけて「技術」の有用性を考えられることが大切だろうと思います。

岡部：浅井さんが、現在のお立場になられた、そもそものきっかけは何だったのですか。

浅井：私の場合は、学生のころからWebの技術や、そのオープン性に強く惹かれていました。Mozillaで翻訳のボランティアを始めたのも「インターネットの自由を守る」というMozillaのコンセプトに共感したのがきっかけです。

　技術翻訳を多く手がけるなかで、最新技術の動向や仕様そのものについて、過去の経緯を含めて理解している必要があり、そのための知識を身につけていたら、徐々にそのことについて人前で話す機会をいただけるようになったといった感じです。今ではMozillaのメンバーとして、サービス事業者やハードベンダーの方とも情報交換をさせていただく立場ですが、その原動力になっているのは、今でも「Webが好き」「Webをみんなに使って欲しい」という学生のころからの思いですね。

岡部：いわば「Web標準」のエキスパートですよね。その立場から、Web開発者に伝えたいことは何かありますか。

浅井：そうですね。今、世の中には次々と新しいWebサイトやサービスが生まれており、Web開発者に対するニーズも、実際の開発者の数も、急速な勢いで伸びています。一方で、経験のある「熟練したWebエンジニア」の価値が非常に高まっているとも感じています。

　では「熟練したWebエンジニア」と、そうでないエンジニアの差がどこにあるのかといえば、フレームワークやツールの選定がうまくできるかといったことももちろんですが、それ以上に「より多くのお客さまに確実に使ってもらえるサイトが作れるか」というところにあると思います。

　要素としては、サービスとしての可用性や快適さ、アプリケーションの品質といったものもあると思いますが、最も基本的なところだと「クロスブラウザ」をきちんと考慮してサービスが作れているかといったことです。特定のブラウザに強く依存するフレームワークを多用して「何でもいいからとりあえず動く」というレベルであれば、アマチュアが趣味で作るサービスと変わりません。「お客さまに確実に使ってもらえる」ことを意識して、サービスを作れるかどうか。そのための知識とノウハウを持っているかどうかが「プロのWebエンジニア」として重要なことなのではないかと思っています。

岡部：たしかに、そうした感覚を身につけるのはプロとして必要です。あと、よく社内でも言っているのですが、何かを始めようとするときに「今何ができるか」ではなく「何がしたいか」を重視するということも、特に若手には勧めたいですね。「何がしたいか」が明確なら、そのための手段については、周りからサポートも得やすくなりますし。

浅井：「こういうことがしたい」という「思い」のために技術を身につけるというのは、たしかに大切ですね。自分も、翻訳や講演を引き受けた後で、そのテーマについて慌てて勉強するといった経験を、過去に何度もしてきました（笑）。「思い」の実現のために、ある技術を「のめりこんで」身につける機会を意識して作るようにしていくと、自然とその分野の「エキスパート」になれるだろうと思います。

（「Yahoo! JAPAN Tech Blog」Yahoo! JAPANから、最新の技術情報を発信しています。併せてご覧ください）