Doug Stevenson
 デベロッパー アドボケート
2016 年、Test Lab が Firebase とともに最初のリリースを迎えたとき、サポートされていたのは Android 端末のみでした。5 月の Google I/O 2018 で、Test Lab は iOS サポートのクローズド ベータ版をリリースしました。これに含まれていたのは、一部の iOS 端末と基本的な UI でした。
Android で包括的なテストを作成するには、Espresso や UIAutomator を使い、コードを書く必要があります。これはある意味で、アプリを「リモート コントロール」するようなものです。iOS でも、同じように XCTest を使ってテストを実行します。どちらの場合でも、Test Lab はクラウドにある実際の端末群でテストを実行できます。
10 月末、プラハで開催された Firebase Summit で、Test Lab チームは iOS サポートの一般公開についてお知らせしました。10 機種の iPhone と iPad で、iOS 12 を含む 7 種類のバージョンの iOS が稼働しています。また、iOS のドキュメントとコンソール操作も改善されました。

Test Lab では、Robo の改善も数多く行われています。Robo は、Android 端末で実行されるアプリに対して、全自動でテストを行うツールです。以下では、Robo の新機能をご紹介します。

モンキー アクション

ゲームでは、システム ウィジェットを使うよりも UI がカスタマイズされていることが多いため、クロールがしづらくなります。そのため、Robo がゲームのエクスペリエンスをクロールするのも難しくなります。今回より、テスト中のアプリが実際はゲームであることを Robo が検知した場合、ゲームの UI を操作しようと、ランダムにタップやスワイプを行うようになります。これによって、クラッシュやパフォーマンスに関する有用なデータが生成されることがあります。これは、意味のある自動ゲーム クロールに向けて手始めとなる大きな一歩です。

プライベート API の検知

APK で内部 Android API が使われている場合、Test Lab がそれを検知して警告するようになりました。Android P 以降では、このような API を使うとアプリがクラッシュする場合があります。Robo がクロールを行っているときにそのような API へのアクセスが発生すると、端末ログにスタック トレースが記録されるので、アプリのコードのどの場所で違反が起こっているのかがピンポイントでわかります。

行き詰まる時の警告

Robo のクロールが行き詰まると、Test Lab がデベロッパーに警告するようになりました。たとえば、ユーザーに複雑なサインアップ フォームやログイン画面が表示される場合、Robo がフォームの要件を満たすのは難しい場合があります。このような場合、Robo は完全なクロールを継続するための操作をデベロッパーに提案します。たとえば、テスト用の認証情報を提供する、Robo Script を記述するなどです。
定期的にアプリをテストする習慣がない方は、毎日の無料枠を使って Test Lab を試してみてください。Android では、コードを書かなくても APK をアップロードするだけで Robo テストを実行できます。ぜひ、Firebase Slack の #test-lab チャンネルに感想をお寄せください。

Reviewed by Khanh LeViet - Developer Relations Team


Reviewed by Thanet Knack Praneenararat - Ads Developer Relations Team


Reviewed by Thanet Knack Praneenararat - Ads Developer Relations Team

クリック後の動作もなめらかに

ウェブページの読み込みスピードを最適化することは重要ですが、ページの読み込み時やページが表示された後にスムーズでインタラクティブなユーザー エクスペリエンスを実現することも重要です。すべてのユーザーからの入力に 10 分の 1 秒未満ですばやく応答し、ユーザー インターフェースが「ジャンク」しないようにしなければなりません。つまり、UI が停止して突然表示位置が切り替わったりしてはいけないということです。

ここ 10 年間で、私たちはできる限り多くの処理をメインスレッドからオフロードするように Chrome を進化させてきました。たとえば、イメージのデコードや JavaScript の解析を分離し、Web Worker を使えば、UI をブロックせずに長時間にわたって動作する JavaScript を実行できます。

最新のウェブアプリは、どうすればなめらかに動作させることができるでしょうか。特に、重大なワークロードがある場合はどうでしょう。私たちのチームは、このテーマを徹底的に追求しました。その最終結果が、本日リリースする Squoosh という新しいアプリです。この強力なイメージ圧縮ツールは、ほぼ瞬時に起動します。Web Assembly を使ってブラウザに内蔵されていないコーデックを処理するなど、重い作業を行っている場合でも、スムーズな UI を実現しています。これをどのように実現しているかを知りたい方は、本日開催される Jake と Mariko のセッションに注目してください。


この点に関してお伝えしたいことはこれだけではありません。Worklet、Virtual Scroller、スケジューラなど、デベロッパーがスムーズなエクスペリエンスを簡単に構築できるようにするプラットフォーム API も近日中に登場する予定です。このような多くのツールやテクニックについては、2 日目の基調講演以降で紹介します。

統合機能の強化

PWA を使うと、容易にユーザーに満足してもらい、リピート率やコンバージョン率を高めることができます。ホスト OS との統合が強化され、読み込みや実行がさらに高速になった PWA は、実に優れています。しかし統合機能のほとんどは、モバイルファーストあるいはモバイル限定の機能に重点を置いていました。

この半年間で新たにリソースを投入し、すべての PC プラットフォームに同じ機能セットを提供できるようにしています。Chrome OS は、まさにウェブの限界を広げるすばらしいプラットフォームです。そこから得た教訓をもとに、Chrome 72 をターゲットに、PC での PWA サポートを Windows および Linux、Mac 向けの Chrome に拡大いたします。


モバイルと PC の両方に機能を追加するにあたっては、コミュニティにとって重要な機能を優先できるように、皆さんの意見を取り入れたいと考えています。そこで本日、ウェブに求められている機能を把握し、協力しながら皆さんの実際のニーズに対応する取り組みについて、今後の予定をお知らせします。

web.dev によるサポート

すべての最新の Web API のリファレンス情報を 1 か所に集めてほしいという要望は承知しています。そのため、MDN と協力してウェブのコア リファレンス ドキュメントの改善を続けています。

また、すばらしいウェブ体験を提供する方法について、実践的なガイドがほしいという声も寄せられています。そこで本日、新たなアプローチとなる web.dev についてお知らせします。

web.dev は、Glitch の協力のもと、私たちのチームによるベスト プラクティス ガイドを活用して Lighthouse ツールと密接に統合されています。的を絞った直接的なベスト プラクティスと、サイトの高速性、弾力性、可用性を常に保つことができるサイト監視機能によって、皆さんのサイトの改善をサポートします。



web.dev の作業を行っていたとき、学習の参考になるすばらしいウェブ コンテンツに触発されました。Flexbox Zombies と CSS Grid Critters を作成した Dave Geddes 氏は、新たな学習ゲームを作成しました。Service Workies では、Service Worker のすべてを学ぶことができます。現在、冒険の第 1 章がベータ版として公開されています。私たちは、Dave 氏と協力して、すべての冒険を誰もが無料で利用できるようにいたします。早速おばあちゃんの話を聞いてみてください！

ウェブのデザインをブラウザで

Chrome Dev Summit では、おなじみのデベロッパー向けのツールやライブラリの最新情報をすべてカバーしますが、皆さんがフィードバックを送りたくなるような最新の早期アクセス試験運用版機能についてもお知らせしたいと思っています。

Firebug が登場し、ブラウザがデベロッパー ツール プラットフォーム自体になりうることを証明したときの衝撃は忘れることができません。そして今、私たちはウェブ上でデザインを行うことも検討しています。Lighthouse が Chrome 拡張機能として始まったように、ブラウザ内でデザインを可能にするもう 1 つの拡張機能 Project Visbug を提供します。すぐにダウンロードすることもできますが、その前にぜひこちらから動作をご覧ください。


その他のセッションについては、 ライブストリームまたは Chrome Developers Youtube チャンネルの動画をご覧ください。

Reviewed by Eiji Kitamura - Developer Relations Team
Share on Twitter Share on Facebook


プロジェクト Orinoco の取り組みによってコンカレント ガベージ コレクションを実現し、メインスレッドが解放されてジャンクが減りました。その後は、重点領域を実環境での JavaScript のパフォーマンスに移し、React.js ランタイムのパフォーマンスが 2 倍になり、Vue.js、Preact、Angular などのライブラリのパフォーマンスが最大 40% 改善しました。並列、コンカレント、増分ガベージ コレクションにより、ガベージ コレクションによるジャンクは最初に V8 がコミットされたときに比べて 100 分の 1 まで減少しています。さらに、WebAssembly も実装し、デベロッパーがウェブで JavaScript 以外のコードを予測可能なパフォーマンスで実行できるようにしました。WASM アプリを確実に高速起動できるように、Liftoff ベースライン コンパイラもリリースしました。V8 のパフォーマンスはリリースごとに徐々に増加し、長年かけて 20 倍のパフォーマンスを達成しました。上記の新しいコンポーネントは、その 10 年間積み重ねた努力の中で、まさに最新のコンポーネントです。

これまでの Chrome リリースでの V8 Bench スコア。V8 Bench は、旧 Octane ベンチマークの前身。この図で V8 Bench を使っているのは、Octane と違って初期の Chrome ベータ版を含むすべてのバージョンの Chrome で動作するため。

Chrome は、SPDY、HTTP/2、QUIC を通して、ネットワーク プロトコルやトランスポート層の進化に重要な役割を果たしています。HTTP/1.1 の制限に対処することを目的とした SPDY は、現在すべてのモダンブラウザがサポートしている HTTP/2 プロトコルの土台となりました。同時に、レイテンシとユーザー エクスペリエンスをさらに改善することを狙った QUIC にも積極的に取り組み、活発な IETF もこの取り組みをサポートしています。QUIC は、YouTube などの動画サービスに大きなメリットをもたらします。QUIC で動画を視聴すると、再バッファリングが 30% 減少することがユーザーから報告されています。

次に紹介するのは、Chrome のレンダリング パイプラインです。レンダリング パイプラインの役割は、ウェブページがユーザーの操作にすばやく反応し、毎秒 60 フレーム（fps）で表示されるようにすることです。Chrome がコンテンツを 60fps で表示するには、1 つのフレームを 16 ミリ秒でレンダリングしなければなりません。これには、JavaScript の実行、スタイルの設定、レイアウトの決定、ピクセルの描画とユーザーの画面への表示などが含まれます。この 16 ミリ秒のうち、Chrome が使う時間が少なければ少ないほど、ウェブ デベロッパーがユーザーの満足度を上げるために使える時間は増えます。レンダリング パイプラインの改善には、再描画が必要になるページ要素の特定方法の最適化や、視覚的に重ならない要素のトラッキングの向上などが含まれます。これによって、画面に新しいフレームを描画する時間が最大 35% 短縮されました。

Chrome チームは 2015 年に RAIL というユーザー中心のパフォーマンス モデルを導入し、先日このモデルが更新された。

メモリ消費量はどうでしょうか。Chrome 63 から 66 の間で、レンダラー プロセスのメモリ使用量が最大 20～30% 削減されています。サイト分離が導入されたので、今後、このメモリ削減に基づいて行うことを模索する予定です。Ignition と TurboFan も、V8 の合計メモリ使用量の削減に貢献しており、V8 をサポートするすべての端末やプラットフォームで 5～10% のメモリが節約できています。今年行われた分析から、ウェブ上のサイトの 7% がメモリリークの影響を受けていたことがわかりましたが、これは完全に修正されています。Chrome のスピードには、DOM や CSS、IndexedDB を始めとするストレージ システムなど、多くのコンポーネントが貢献しています。パフォーマンス改善の詳細については、Chromium ブログの最新記事にご注目ください。

ウェブ デベロッパーによるウェブページの計測や最適化を強化

どこからサイトの改善を始めればよいのかを理解するのは、大変な作業です。その手助けとして、ラボ環境における状況や、ユーザーが実環境で感じる体験について把握できるいくつかのツールを検討しました。長年かけて、Chrome DevTools の Performance パネルは、ウェブページがラボ環境でどのように表示されるかを順を追って視覚化できる強力な方法となりました。サイトでパフォーマンスを改善する余地を見つける手間をさらに軽減するために、Lighthouse の開発も行いました。これは、ウェブサイトの品質を分析し、サイトのパフォーマンスに関する明快な指標とユーザー エクスペリエンスを改善するための具体的な方法を提示してくれるツールです。Lighthouse は、DevTools の Audits パネルを通して直接利用できるほか、コマンドラインからも実行できます。また、WebPageTest などの他の開発用プロダクトにも組み込まれています。
Chrome DevTools の Audits パネルで Lighthouse を実行



Lighthouse によるラボ環境のデータを補完するために、Chrome ユーザー エクスペリエンス レポートをリリースし、ユーザーが実環境で感じる体験の指標となる項目をデベロッパーに提供できるようにしました。レポートには、First Contentful Paint、First Input Delay などの項目が含まれています。現在、デベロッパーはカスタムサイトのパフォーマンス レポートを作成し、CrUX Dashboard を使って莫大な数のオリジンに対する進捗をトラッキングできるようになっています。

また、たくさんの Web Platform 機能を導入し、デベロッパーがサイトの読み込みを最適化できるようにしています。早い段階で読み込む必要があるリソースをブラウザに伝えられるように、リソースヒントや <link rel=preload> を追加しました。Chrome は、Brotli 圧縮、WOFF2 ウェブフォント圧縮、イメージの WebP サポートなど、バイト削減をサポートするアプローチを実装したブラウザの先駆けでもあります。

今後、ますます多くのブラウザでこれらの機能がサポートされることを楽しみにしています。Chrome は Service Worker を実装しているので、何度もページにアクセスする際にオフライン キャッシュやネットワーク レジリエンスを活用できます。この機能が幅広くモダンブラウザでサポートされていることをうれしく思います。


実際に、現在の Google 検索は、繰り返し検索を行う際の便宜的キャッシュに Service Worker とナビゲーション プリロードを使っています。これにより、繰り返しアクセスする場合のページの読み込み時間が半分になっています。

将来的に、イメージや iframe のネイティブ遅延読み込み、AV1 などの画像形式を含む新しい標準によって、ユーザーに対して効率的にコンテンツを提供できるようになるでしょう。今からとても楽しみです。

Chrome を使ってデータプラン内でウェブをもっと楽しむ


ここ 10 年間で、ウェブページのサイズは増加の一途をたどっています。しかし、初めてオンラインの世界にデビューする多くのユーザーにとっては、データは法外に高価だったり、耐えられないほど遅い可能性もあります。それに対応するため、ここ数年で、Chrome データセーバーなどのデータを意識した機能がリリースされてきました。データセーバーは、インテリジェントにページを最適化し、データ消費量を最大 92% 削減します。

さらに、データを節約する新しい方法も模索しています。Chrome for Android を対象に、接続速度が遅いユーザーのために、ページをスマートに最適化して重要なコンテンツが最初に表示されるようにする機能の開発を進めています。このようなページ変換によって、完全なページよりもはるかに早く読み込めるようになります。この機能については、再現性、網羅性、パフォーマンスをさらに向上させる作業を続けています。

データやネットワークに制限のあるユーザーのために、ガードレールを設ける実験も行っています。たとえば、Chrome にネイティブ遅延読み込みを導入する方法や、たくさんのデータを使った場合にページの追加リクエストを停止するオプションをユーザーに提供する方法を模索しています。

まだ始まったばかり

これらの変更点は、デベロッパーや企業がユーザーに便利なコンテンツをすばやく提供する際に役立ちます。しかし、まだやるべきことがあります。今後 10 年間で行われるページ読み込みパフォーマンスの改善に乾杯しましょう！


Reviewed by Eiji Kitamura - Developer Relations Team

Share on Twitter Share on Facebook

ラーニングパス

機能やベスト プラクティスが盛り込まれた 10 種類のミニコースから選択できます。たとえば、 アプリのリリース前テスト、 アプリの技術的パフォーマンスの評価、 アプリの収益化などがあります。

インタラクティブな学習

マルチメディアを多用したインタラクティブな e ラーニングで学習できます。

評価

重要な Play Console 機能やモバイルアプリのベスト プラクティスについての新たな知識をテストできます。

実績

新たなスキルをアピールしましょう。Play Academy プロフィールに、堂々たる実績バッジが掲載されます。

今すぐ学習を始めましょう

Google Play の無償の e ラーニング コンテンツは、簡単にご利用いただけます。g.co/play/academy にアクセスしてサインアップを行い、デベロッパーとしての学習の旅を始めましょう。コンテンツは日本語でご利用いただけます。一番下の言語メニューから「日本語」を選択してください。

また、今後の Play Academy ニュースにもご注目ください。皆さんが最新の機能やプログラムから後れをとることなく、アプリやゲームのビジネス拡大に必要な最新情報をタイムリーに入手できるように、コースは定期的にアップデートいたします。

このブログ投稿はどのくらい役に立ちましたか？
★ ★ ★ ★ ★


Reviewed by Yuichi Araki - Developer Relations Team
Share on Twitter Share on Facebook



amp-orientation-observer による傾きと連動したアニメーション

端末の傾きと指定したアニメーション フレームを低レベルで同期させる <amp-orientation-observer> がリリースされました。この機能を利用すると、ページの背景のわずかな移動、イメージのパン、傾きに応じたアニメーションなど、さまざまな効果を実現できます。シーン上で重なり合った複数のコンポーネントを異なる速度で移動させて、レイヤーに対応した 3D 空間を作成することもできます。
image4


amp-image-slider によるイメージの比較

<amp-image-slider> を使うと、2 つのイメージを重ねて比較することができます。これは、「事前と事後」の写真を表示するような場合に特に便利です。このコンポーネントの詳細については、先日のブログ投稿をご覧ください。
image2


Google アド マネージャーによる AMP ストーリーの広告サポート（ベータ版）

Google アド マネージャーが、サイト運営者によって生成される AMP ストーリーでの直販広告の提供をサポートしました。詳細については、こちらをご覧ください。




image3
ストーリー ページの 1 つに表示される Google Pixel 2 の広告

その他の主な新機能

近日中にリリースされる特筆すべき機能

* * *
作業したりフィードバックを寄せてくださっている AMP 開発コミュニティの方々に感謝いたします。いつものように、問題や機能リクエストがありましたら遠慮なくお知らせください。

Reviewed by Yusuke Utsunomiya - Mobile Solution Consultant, gTech
Share on Twitter Share on Facebook


Google Cloud に代表されるクラウド技術の進化が引き起こすその先の世界を、機械学習、VR / AR、IoT などの領域で活躍されている方々と一緒に議論するイベント「INEVITABLE ja night」。 9 月 18 日に開催した第 6 回目のイベントは、「日本の情シスを巡る不可避な流れ」をテーマに、現役の CIO や情シスでの業務経験のある方々をお招きして、日本企業における情報システム部門は今後どのような役割を果たすべきか、どのように進化すべきか、さらには、情シス的な人材が今後どのように活躍できるのかについて、議論しました。


現役 CIO が語る情シスの現状と未来

前半のテーマは「現役 CIO に聞く。情シスと CIO の役割を巡る不可避な流れ」ということで、以下の3名の方に登壇いただきました。
  • 友岡 賢二さん（フジテック株式会社 常務執行役 情報システム部長）
  • 成田 敏博さん（株式会社ディー・エヌ・エー 経営企画本部 IT 戦略部部長）
  • 金山 裕樹さん（株式会社スタートトゥデイテクノロジーズ 代表取締役 CINO（Chief Innovation Officer））

（左から、友岡さん、成田さん、金山さん。聞き手は小島 英揮さん（Still Day One 合同会社 代表社員 パラレルマーケター・エバンジェリスト））
「クラウドとモバイルを組み合わせることがまずは重要だが、日本の製造業の多くはまだそのレベルには達していない。先進的な取り組みを社内でどのように説得し、導入を促進するか」（友岡さん）「ビジネスの現場の方が IT に詳しい企業において情シスが果たす役割の一つがチームワークを活性化する”ビジネスコラボレーションハブ”を実現すること」（成田さん）「ビジネス変革のために IT をどう活用し、”コーポレートエンジニアリング”を実現するか」（金山さん）と、それぞれの立場から情シスの現状と将来への期待を語っていただきました。

業界も、会社における情シスの役割も異なる御三方ですが、共通する考えもあるようです。たとえば、いずれも社内システムは内製化を積極的に進めているとのこと。自らの手を動かすことで課題解決を人任せにせずに進めることが大切であり、また、構築したシステムは、運用の過程で、仮説立案・検証・改善というフィードバックループを回していくことで、システムの価値を高めていくべきと述べていました。こうした変化は、開発や運用をいっしょに行う社外パートナーとの付き合い方にも影響しているとのこと。IT サービスを購入・試用し、前述のフィードバックループを共に回せるパートナーが求められていると言います。

さらには、自社内のみならず他社や異業種との交流も推進しているそうです。様々なノウハウを競合他社を問わずに共有することで、新たな知識を得たり技術力を磨くことができるだけでなく、自らを客観的に評価できるようになるとのこと。情シスに所属しているメンバーは社外のコミュニティにどんどん参加すべきだということも、3 名の一致した意見でした。

参加者からは、CIO のロールモデルとして三者三様の考え方に共感したという声も多数あがったセッションでした。

クロスオーバー時代にみる情シス的キャリア

イベント後半は、金融業界から 2 名のゲストを招いて、情シス的な人材が金融の分野で活躍するには何をすべきか、キャリア形成の観点から様々なお話を語っていただきました。


（左：大久保さん、右：黒須さん）
現在、5 社目の大久保さんと 4 社目の黒須さん。それぞれのキャリア形成は異なるアプローチでした。大久保さんは、自らが理想とするスキルマップを描き、不足しているスキルや経験を身につけるために転職を繰り返してきたそうです。特に、外部コミュニティに参画して、さまざまな背景を持つ人々との交流を通じて、自分に足りないものが何かを意識し始めたとのこと。コミュニティに参加する重要性がここでも語られていました。

一方、黒須さんは「この業種、この会社に勤めたいというよりも、自分が関わることで世の中にインパクトを与えられることが実現できるか」を重視しているとのこと。自らを「わらしべ長者的キャリア」と語るように、ルート営業、データセンター事業のアライアンス開拓、クラウド導入支援と、その時に所属した企業で身につけた技術や知識、経験を次の職場でどのように活かすかを心がけてきたそうです。「敵を作らない対人スキルとテクノロジーを噛み砕いてわかりやすく説明するスキル」も大切であると、黒須さんは語っていました。

今回の INEVITABLE ja night は、過去 5 回とは異なり、テクノロジーではなく、それを使う情シスという組織をテーマにお送りしました。今回登壇された 5 名のゲストスピーカーそれぞれの考え方は、イベントの参加者にとって、大いに刺激になったようです。


Posted by Takuo Suzuki - Developer Relations Team
Share on Twitter Share on Facebook