Google announces new Chrome developer tools to reduce page loads and build native app-like experiences

Two decades ago, Google started off as a web search engine, but today, it dominates how we experience and interact with the web. Google Search, in itself, hugely commands most of the online usage, but other products like the world’s most popular browser – Google Chrome – as well as the most used mobile operating system – Android – has put Google in the lead among other stakeholders of the web. The percentage of users going online using mobile devices has increased and so has the internet giant’s emphasis on reducing load times to ensure stickiness. AMP or accelerated mobile pages was one step Google took to ensure faster loading of webpages. Last year, it also introduced a web element known as “Portals” to optimize “seamless” switching between webpages.

With the vision to “make loading disappear,” Google today announced new developer tools at the Chrome Dev Summit 2019 to make the web safer and more user-friendly while also improving the chances of helping developers boost their user base as well as revenues.

Portals

Google demonstrated the progress that Portals has made since they launched it at Google I/O earlier this year and implemented behind a flag in Chrome Canary. To refresh your memory, Portals allows developers to embed certain content or entire webpages into another webpage just like an iframe. In order to eliminate any wait time, the content inside the Portal or the frame loads while users are still browsing the initial webpage.

Google has shared an example of movie ticketing service Fandango in which the landing page for a particular movie (Joker in the example) is bound inside a Portal. When a user taps on Joker, the next page is rendered already fully loaded.

Web Bundles

Google is announcing Web Bundles which is created to help web developers share their web content with others through a variety of mediums, including but not limited to email, USB, or FTP. Developers will be able to effectively cache the entire web content intended to be shared using APIs like Background Periodic Sync and Content Indexing and then selectively render the required content even if the end-user is not connected to the internet. To enable web developers to utilize this functionality, Google is making Web Bundles available behind a Chrome flag while the two APIs will be available as origin trials.

Native-like web experience

While being aware that plenty of users use their mobile phones to go online, Google also acknowledges the cross-device usage patterns across the world. For more than a couple of years, Google has been pushing Progressive Web Apps (PGAs) as a substitute for native Android apps with the objective of reducing loading time and data consumption.

To align the applications on the web with native apps, Google is announcing three new features for developers. These are:

1. SMS Receiver, which will allow web apps to fetch SMS-based authentication codes just like apps can. In the video above, you can see how seamlessly the web version of Swiggy, an Indian food ordering service, suggests the user to leverage the verification code received via SMS.
2. Contact Picker, which will let users upload contacts on to web apps in a fashion similar to the contact sharing on messaging apps like WhatsApp.
3. Native File System API, which will give web apps the permission and the facility to read files and folders from a user’s device and save changes to them directly. Potential applications of this feature may include online text editors, photo and video editors, even web-based IDEs, and more.

These APIs will also be available as origin trials for Google Chrome.

New metrics and guidance for developers

To help contextualize the general “health of the web,” Google has announced a project called The Web Almanac in partnership with the HTTP Archive. With guidance from 85 experts, the project is aimed at seeking insights and visualizing trends on actionable data about the best and the worst practices on the web.

The mission involved reviewing nearly 6 million websites, after which these experts have condensed their conclusions on ways to improve user experience in 20 chapters. This practice will be repeated as an “annual tradition” so that the Almanac remains a resourceful guide for web developers.

Along with this, Google is also introducing two new metrics to help developers optimize their websites for the best practices. These are:

1. Largest Contentful Paint (LCP), which the “perceived” loading time of a webpage. Simply put, it is the loading time of the “largest element visible in the viewpoint.” This will quantify how quickly are the key elements on a webpage loaded so that developers can eliminate any sort of lag. The LCP is calculated for the time before the user interacts with the page so the intent here is to minimize the loading delay as much as possible.
2. Cumulative Layout Shift (CLS), which is used the gauge the stability of webpages. It can help developers determine how often elements like buttons or a particular image changes its location on the viewable part while the page is loading. Thus, CLS can help developers eliminate this frustrating issue of elements changing their position while the page loads. This metric relies on “layout shift score” which measures the tendency of page elements to shift while loading, thereby troubling users. The layout shift score should be ideally zero – or at least as close to zero as possible – to ensure an hassle-free experience for the users.

With the objective of helping developers achieve the best performance, accessibility, and efficiency on their websites, Google is expanding the scope of Lighthouse Stack Packs to a variety of frameworks. Besides WordPress and Next.js, which is already supported by Lighthouse, Google is adding support for frameworks such as AMP, Angular, React, as well as Magento, the CMS catering exclusively to e-commerce websites.

Improve memory management, better privacy, and greater control

Google claims to be investing time, effort, and money into remedying one of the biggest complaints with Google Chrome and that is memory consumption. Besides working on improving memory management, they are also constantly improving the performance of Chrome to ensure that the web remains accessible to all irrespective of “their device type or internet speed or purchasing power.”

In terms of privacy, the next version of Google Chrome i.e. ver79 will be improving how cookies are handled. This includes a new toggle on the New Tabs Page in the Incognito mode to help users control third-party cookies much better. The Settings page will also be tweaked to make this toggle easily accessible in the regular mode.

Google is furthering its efforts into the development of Privacy Sandbox, which is defined as the set of open standards laid out to improve privacy online. The Privacy Sandbox is aimed at allowing websites to deploy cookies without making users feel overwhelmed or insecure due to ads while also finding ways to block fingerprinting.

The post Google announces new Chrome developer tools to reduce page loads and build native app-like experiences appeared first on xda-developers.

from xda-developers https://ift.tt/32B5WUx
via IFTTT