How Google Increased Platform Adoption & Innovation with StackBlitz

StackBlitz Enterprise is the leading on-prem browser based IDE for front-end development.

We work with some of the largest companies in the world to eliminate wasted developer hours, mitigate the security risk of executing untrusted code, and greatly reduce collaboration friction.

Learn how Google uses StackBlitz to support millions of passionate developers.

Quote author avatar
"For frameworks & design systems to succeed, they have to be incredibly easy to adopt. Setting up local environments is one of the biggest barriers."
Stephen Fluin Developer Relations Lead at Google

Developer frameworks and design systems are critical tools in the modern web development arsenal. They enable large teams to collaboratively build great products faster while ensuring consistency and accessibility across platforms and releases.

In order to capture this value internally, Google created the Angular framework as well as the corresponding UI library for their Material Design System. Angular quickly became not only the preferred internal framework for Google, but the leading framework for enterprise-scale applications worldwide

With millions of developers adopting the platform, Google’s Angular team needed a fast, secure and scalable solution to enable a team of less than 30 developers to support the rapidly growing and globally distributed user base.

The Challenge

After Angular and Angular Material launched, a wave of developers began learning and implementing the framework. Getting started often led developers to:

  1. Visit the Angular and Angular Material documentation.
  2. Pull down the example code
  3. Create a local environment and set up appropriate structure and dependencies

While the process was not technically challenging for experienced users, it was tedious and time consuming for all, slowing down learning and platform adoption.

As the community grew, more issue reports made their way back to Google’s Angular development team with more than 40,000 reports to date. When reporting an issue back to the Angular team, the reporting developer often had to include the raw code, along with the specifications for recreating the environment. Each issue required at least thirty minutes before any root cause investigation could be initiated which was taking significant time away from innovating on the platform.

Top Obstacles

  • 30+ minutes for Angular team members to review a bug report.
  • Large user base of 1,500,000+ developers visit Angular & Material documentation every month and have filed 40,000+ bug reports.
  • Security must adhere to Googles strict security requirements.

Google searched for a solution that could eliminate friction between the code and the end users. They identified browser based IDEs as the ideal way to create a fast, secure, and consistent development environment for new users as well as bug reproductions.

Basic solutions such as code pens/sandboxes were eliminated as they are unable to run the node.js based toolchain innovations introduced by Angular and other modern development frameworks.

The Angular team also explored building an internal solution, however it was not pursued due to the time it would require to meet the stringent requirements for this implementation.

Next, the Angular team explored options that rely on cloud VMs to execute the code remotely and stream the results back across the internet to the developer. They found that these solutions were less performant than local dev environments due to the latency issues introduced by separating the code execution from the UI across the cumbersome remote compute model which required significant intervention from devops and security resources for provisioning and monitoring.

The Solution

Any security breach on Google’s network has the potential to impact critical infrastructure valued in the billions of dollars.

Instead of executing code in local or remote environments, StackBlitz is the first fully featured IDE to ever utilize one of the most secure environments ever invented for code execution: the Google Chrome browser sandbox. This allows Angular Core team developers to interact with user submitted code directly with no risk of compromising their local machines, or Google’s network.

The Angular team chose StackBlitz as their browser-based IDE, integrating it with their documentation and bug handling processes in January 2018.

Quote author avatar
"Integrating StackBlitz has simplified Angular and Material's getting started experience from a tedious multi-step process into a single click."
Stephen Fluin Developer Relations Lead at Google

StackBlitz provides Google a zero footprint web development environment that boots in milliseconds, allowing immediate interaction with example projects and Material design system components. Using StackBlitz’s patent-pending WebContainer technology, modern toolchains run locally inside the browser security sandbox.

This solution offers seamless onboarding for new Angular users, and rapid prototyping for more experienced developers. This benefits the entire Angular community by increasing overall usage and platform innovation.

Quote author avatar
"Being able to instantly open and share environments has significantly reduced our team's support burden for bug reproductions and enabled rapid innovation."
Stephen Fluin Developer Relations Lead at Google

The Angular team also integrated StackBlitz into their bug tracking system to streamline recreation of user reported issues. Bug reports now require users to attach a live StackBlitz reproduction upon submission. For maintainers, a single click now replaces the time consuming and expensive process of recreating bugs in their own local environment.

The Impact

  • Live editable examples embedded in documentation enable a seamless transition from reading about Angular to adopting Angular for millions of developers each year, making it one of the most accessible platforms to adopt in 2021.
  • Single-click bug reproductions help a core team of less than 30 devs manage over 40,000 bug reports by eliminating all the setup time previously required to manually recreate issues.

StackBlitz has allowed more developers to adopt the Angular framework and Material Design System, allowed the core team to innovate instead of just maintain, and has helped Angular secure its position as one of the world’s top enterprise development frameworks.

Collaborating on code is critical for high performing development teams,

but it can often be inconvenient. For many, code collaboration requires the familiar yet unpleasant process of closing open work, committing to version control, spinning up a fresh project, pulling down a coworker’s code, and resolving dependencies before actually engaging with the codebase.

By empowering developers with instantly booting shareable coding environments, you unlock frictionless code collaboration in a way that has never been possible before.

StackBlitz helps teams

onboard new members efficiently, resolve bugs with less effort, and rapidly iterate to create world class software. We have helped some of the largest organizations in the world improve developer experience with the confidence of industry leading security.

Reach out today

Start a conversation about how StackBlitz can help your team!

enterprise @ stackblitz.com