The New Microsoft Edge – Microsoft Build 2020

Melanie Richards recently presented new and upcoming features for users and web developers that are being incorporated into the new Chromium-based Microsoft Edge. Since moving to Chromium, Edge has been slowing gaining user share, passing Firefox to become the second browser on desktop/laptop devices (according to netmarketshare).

Melanie Richards summarized at Microsoft Build 2020 the initiatives contributed to Chromium by the Microsoft Edge team to improve both user and developer experience for the Edge browser. Microsoft has made over 3,000 commits into the Chromium project since announcing in December 2018 the switch to the Chromium engine. Those commits bring updates to the browser UI, web platform, JavaScript engine, developer tooling, Skia compositing, and more.

In her presentation, Richards narrowed in on a few selected features concerning the web platform, web applications, and developer tooling. InfoQ previously reported on the collaboration between Microsoft and Google to refresh form controls. The effort aimed at producing a more modern look, together with better touch support and accessibility. This is part of a larger effort seeking to standardize in-page controls (Open UI).

Developers rewriting their own controls primarily complain about the difficulty of customizing the control’s look and feel uniformly across browsers engines. In a survey, developers signaled the <select> control as a primary offender and target for customization. As a matter of fact, Jed Watson reported at React Conf 2019 on the popularity of his react-select component (2.5M weekly downloads) and the difficulty of crafting a good API for it.

Richards also demoed a Microsoft Edge feature that supports the Windows’ high contrast feature. The feature leverages the forced-colors specification part of the new W3C’s Media Queries Level 5 specifications and the CSS system colors specifications from the CSS Color Module Level 4 specifications.

Richards reminded that Edge now boasts 100% HTML5 accessibility score, improved inking latency (important for touch devices), reduction in scrolling latency, increased memory and battery usage. The mentioned improvements in performance, battery life, and privacy seem to have convinced Joanna Stern from the Wall Street Journal which recommended that Mac users switch to Edge or Safari as their primary browser. In one test, Edge used 665MB of RAM with six pages loaded while Chrome used 1.4GB. Another test showed memory usage reduction of up to 27% when browsing with Microsoft Edge.

Richards further demoed the role that the Storage Access API plays in privacy protection, and how Edge prevents user tracking. Richards also showcased specific features supporting foldable devices and faster client-side media editing.

The new Edge also caters to web applications. On the one hand, PWAs benefit in Edge from significant additions in their capabilities. PWAs can run on OS login (Edge 83/Windows 10), can register key-based shortcuts, be launched automatically when the user clicks on certain URLs, customize window controls (e.g. the window title bar), and more. On the other hand, WebView2 allows developers to embed web content into native apps.

Developer tooling (dev tools) can now be used in 11 languages, and benefits from improved accessibility across the board. The DOM can be visualized in 3D, which allows faster debugging involving z-index:

The New Microsoft Edge - Microsoft Build 2020

Just like with Chrome, developers may preview incoming features with the beta, dev and canary channels. New beta and stable versions are published every six weeks. Origin trials are also available in the Microsoft Edge Origin Trials program.

Microsoft also announced at Build that the new Edge browser, previously only available as a manual download, will be delivered via Windows Update as an automatic install, replacing the legacy version of Edge (exceptions may apply for Enterprise customers). This may explain the recent increase in market share of Edge, which is now the second browser on desktop/laptop devices (according to netmarketshare).

Other features that are not discussed in Richard’s talk have been presented at Build 2020. They include Collections, a feature that helps users organize, save, and share content (links, images, text, notes, and more); a collaboration with Pinterest for content discovery; a sidebar search; new syncing and customization options for IT professionals; and more.

Microsoft made available online a thorough and informative list of upcoming or current features, together with a description of the problem motivation the new feature, and the designed solution (Microsoft Edge Explainers). The full talk has been recorded as part of the Microsoft Build 2020 and is available online.