The Razor Sharp Evolution of Flutter and Dart

Quick Overview

The evolution of Flutter for the web involved a radical departure from the initial approach (Razor/Chrome-based) due to frustration, leading the team to rewrite the rendering engine using Dart to achieve a 20x performance improvement over JavaScript benchmarks and adopt a game-engine-like rendering model, which ultimately led to the project being renamed from Razor to Flutter and adopting Dart for both compilation and JIT execution.

Key Points: The initial web rendering approach, codenamed 'Razor,' was frustrating because it relied on Chrome and faced issues like CSS cascading and security problems when trying to maintain native form controls. The team realized they needed a radical change, leading them to cut away most of the web-specific code and focus on building a fast rendering mode for the web using Dart. By rewriting the rendering engine, they achieved a performance improvement of 20 times faster than previous benchmarks for Chrome, moving from a 1% improvement to a 20x improvement. The core philosophy shifted to building a language that supported both AOT (Ahead-of-Time) compilation for native deployment and JIT (Just-in-Time) compilation for a nice development experience, which Dart provided. The project was renamed from 'Razor' to 'Sky' and eventually to 'Flutter' after realizing the original web approach was flawed and required rebuilding the rendering stack entirely. The fundamental difference between Flutter/Dart and React Native is that Flutter/Dart uses a game-engine approach (like Skia) for rendering, while React Native relies more on native platform controls and is closer to the traditional web rendering model.

Context: The video features two speakers discussing the early development history and architectural decisions behind Flutter's web support. The first speaker describes the intense frustration encountered when trying to make the initial web implementation, codenamed 'Razor,' performant and reliable, contrasting it with the later, successful approach that leveraged Dart's unique compilation capabilities for mobile and web rendering.