Google、ページの負荷を軽減し、UXを改善するための新しいChrome開発ツールを発表

20 年前、Google は Web 検索エンジンとしてスタートしましたが、現在では、私たちが Web を体験し、操作する方法を支配しています。 Google 検索自体がオンライン利用の大部分を占めていますが、世界で最も人気のあるブラウザなどの他の製品も同様です。 グーグルクローム – 最も使用されているモバイル オペレーティング システムである Android と同様に、Google はウェブの他の利害関係者の中で先頭に立っている。 モバイルデバイスを使用してオンラインにアクセスするユーザーの割合が増加しており、インターネット巨人は安定性を確保するためにロード時間の短縮に重点を置いています。 アンプまたは モバイル ページの高速化 これは、ウェブページの読み込みを高速化するために Google が講じた措置の 1 つです。 昨年、「」として知られる Web 要素も導入されました。ポータル」を使用して、Web ページ間の「シームレスな」切り替えを最適化します。

というビジョンを掲げて、読み込みを非表示にする」、Googleは本日、新しい開発者ツールを発表しました。 Chrome デベロッパー サミット 2019 これは、Web をより安全でユーザーフレンドリーにすると同時に、開発者がユーザーベースと収益の拡大を支援できる可能性を高めることを目的としています。

ポータル

Google は次のような進歩を実証しました ポータル は、今年初めの Google I/O で発表して以来、Chrome Canary のフラグの背後に実装してきました。 記憶をリフレッシュするために、開発者はポータルを使用して、特定のコンテンツまたは Web ページ全体を iframe と同様に別の Web ページに埋め込むことができます。 待ち時間をなくすために、ユーザーが最初の Web ページを閲覧している間に、ポータル内のコンテンツまたはフレームが読み込まれます。

Google は、映画チケット販売サービス Fandango の例を共有しました。この例では、特定の映画のランディング ページ (ジョーカー この例では) はポータル内にバインドされています。 ユーザーがジョーカーをタップすると、次のページが完全にロードされた状態で表示されます。

ウェブバンドル

Googleが発表してるよ ウェブバンドル これは、Web 開発者が電子メール、USB、FTP などのさまざまな媒体 (これらに限定されない) を介して Web コンテンツを他のユーザーと共有できるように作成されています。 開発者は、次のような API を使用して、共有することを目的とした Web コンテンツ全体を効果的にキャッシュできるようになります。 バックグラウンドでの定期的な同期 そして コンテンツのインデックス作成 そして、エンドユーザーがインターネットに接続していない場合でも、必要なコンテンツを選択的にレンダリングします。 Web 開発者がこの機能を利用できるようにするために、Google は Chrome フラグの背後で Web バンドルを利用できるようにしていますが、2 つの API は オリジントライアル.

ネイティブのような Web エクスペリエンス

Google は、多くのユーザーが携帯電話を使用してオンラインにアクセスしていることを認識していますが、世界中のクロスデバイスの使用パターンも認識しています。 数年以上にわたり、Google は次のことを推進してきました。 プログレッシブ Web アプリ (PGA) ロード時間とデータ消費量を削減することを目的としたネイティブ Android アプリの代替として。

[ビデオ width="390" height="800" mp4=" https://static1.xdaimages.com/wordpress/wp-content/uploads/2019/11/Login_OTP_Flow_Swiggy.mp4"]

ウェブ上のアプリケーションをネイティブ アプリと連携させるために、Google は開発者向けに 3 つの新機能を発表しました。 これらは：

1. SMS受信機これにより、Web アプリでもアプリと同様に SMS ベースの認証コードを取得できるようになります。 上のビデオでは、インドの食品注文サービスである Swiggy の Web バージョンが、SMS 経由で受信した確認コードを利用するようユーザーにいかにシームレスに提案しているかがわかります。
2. コンタクトピッカーこれにより、ユーザーは WhatsApp などのメッセージング アプリでの連絡先共有と同様の方法で、Web アプリに連絡先をアップロードできるようになります。
3. ネイティブ ファイル システム APIこれにより、Web アプリにユーザーのデバイスからファイルとフォルダーを読み取り、変更を直接保存する権限と機能が与えられます。 この機能の潜在的なアプリケーションには、オンライン テキスト エディター、写真およびビデオ エディター、さらには Web ベースの IDE などが含まれる可能性があります。

これらの API は、Google Chrome のオリジン トライアルとしても利用可能になります。

開発者向けの新しい指標とガイダンス

一般的な「ウェブの健全性」を文脈化するために、Google は次のプロジェクトを発表しました。 ウェブ年鑑 と提携して HTTP アーカイブ. 85 人の専門家からの指導を受けて、このプロジェクトは、Web 上のベストプラクティスと最悪のプラクティスに関する実用的なデータに関する洞察を求め、傾向を視覚化することを目的としています。

このミッションには 600 万近くの Web サイトをレビューすることが含まれており、その後、これらの専門家はユーザー エクスペリエンスを向上させる方法について結論をまとめました。 20章. この実践は「年次伝統」として繰り返され、Almanac が Web 開発者にとって有益なガイドであり続けるようにします。

これに加えて、Google は開発者がベスト プラクティスに合わせて Web サイトを最適化するのに役立つ 2 つの新しい指標も導入します。 これらは：

1. 最大のコンテンツフル ペイント (LCP)、これは Web ページの「認識された」読み込み時間です。 簡単に言うと「視点に見える最大の要素」の読み込み時間です。 この意志 開発者があらゆる種類の要素を排除できるように、Web ページ上の主要な要素がどれくらいの速さで読み込まれるかを定量化します。 ラグの。 LCP はユーザーがページを操作する前の時間に対して計算されるため、ここでの目的は読み込み遅延を可能な限り最小限に抑えることです。
2. 累積レイアウトシフト (CLS)、ウェブページの安定性を測るゲージとして使用されます。 これは、開発者がページの読み込み中にボタンや特定の画像などの要素の表示部分上の位置がどのくらいの頻度で変更されるかを判断するのに役立ちます。 したがって、CLS は、開発者がページの読み込み中に要素の位置が変わるというイライラする問題を解決するのに役立ちます。 この指標は、読み込み中にページ要素が移動してユーザーを悩ませる傾向を測定する「レイアウト シフト スコア」に依存しています。 ユーザーに手間のかからないエクスペリエンスを保証するには、レイアウト シフト スコアは理想的にはゼロ、または少なくとも可能な限りゼロに近づける必要があります。

開発者がウェブサイトで最高のパフォーマンス、アクセシビリティ、効率性を達成できるよう支援することを目的として、Google は、 灯台スタックパック さまざまなフレームワークに対応します。 Lighthouse ですでにサポートされている WordPress と Next.js に加えて、Google は次のサポートを追加しています。 AMP、Angular、React などのフレームワークや、電子商取引専用の CMS である Magento など ウェブサイト。

メモリ管理の改善、プライバシーの向上、制御の強化

Googleは、Google Chromeの最大の不満の1つであるメモリ消費を改善するために時間、労力、資金を投資していると主張している。 メモリ管理の改善に取り組むだけでなく、Chrome のパフォーマンスも継続的に改善して、Web が常にすべての人にアクセスできるようにしています。デバイスの種類、インターネット速度、購買力などです。"

プライバシーの観点から、Google Chrome の次のバージョン、つまり ver79 では Cookie の処理方法が改善される予定です。 これには、ユーザーがサードパーティ Cookie をより適切に制御できるように、シークレット モードの新しいタブ ページに新しいトグルが含まれています。 [設定] ページも調整され、通常モードでこの切り替えに簡単にアクセスできるようになります。

Google は、 プライバシーサンドボックス、オンラインのプライバシーを向上させるために策定されたオープン標準のセットとして定義されています。 プライバシー サンドボックスは、Web サイトが広告によってユーザーに圧倒されたり不安を感じさせたりすることなく Cookie を導入できるようにするとともに、フィンガープリンティングをブロックする方法を見つけることを目的としています。