The 4-Line Function That Broke jQuery: How Evan You Watched Vue Render 10,000 Rows in 16ms — And Built the Framework That Made React Nervous
In 2013, a Google Creative Lab designer got so frustrated with Angular's complexity that he built his own framework in a weekend. Six months later, it was rendering faster than React — and Facebook's engineers started paying attention.
The 4-Line Function That Broke jQuery: How Evan You Watched Vue Render 10,000 Rows in 16ms — And Built the Framework That Made React Nervous
It was February 2014. Evan You sat in Google's Mountain View office, staring at Chrome DevTools. He'd just clicked a button that rendered 10,000 table rows. Angular took 1,200 milliseconds. React took 68 milliseconds.
His weekend project — a framework called "Seed.js" that he'd built in his spare time — took 16 milliseconds.
He refreshed the page. Ran it again. 16 milliseconds. Again. 16 milliseconds.
Evan wasn't a framework author. He wasn't even a backend engineer. He was a designer at Google Creative Lab, building prototypes for experimental projects. But he'd just accidentally built something that rendered faster than Facebook's new framework — and he had no idea what to do with it.
Six months later, he'd rename it Vue.js, quit his job at Google, and start a framework that would challenge React's dominance without a single line of corporate backing.
This is the story of how one developer's frustration with Angular became the third-most-popular frontend framework in the world — and why Vue's simplicity almost didn't survive its own success.
The Problem: Angular Made Simple Things Hard
Evan You's job at Google Creative Lab in 2013 was to build interactive prototypes — fast. The team experimented with ideas that might never ship: data visualizations, browser experiments, interactive stories. Speed mattered more than scale.
Google's official frontend framework was Angular 1. Evan tried it. He hated it.
Not because Angular was bad — it was powerful, opinionated, and backed by Google. But for Evan's use case, it was overkill. He didn't need dependency injection, a full MVC architecture, or a command-line scaffolding tool. He needed to bind some data to the DOM, handle a few clicks, and ship.
Angular's simplest example looked like this:
angular.module('myApp', [])
.controller('MyController', function($scope) {
$scope.message = 'Hello World';
});
And the HTML:
<div ng-app="myApp" ng-controller="MyController">
{{ message }}
</div>
Evan thought: Why do I need to register a module, create a controller, inject $scope, AND set up the HTML just to display "Hello World"?
He wanted this:
new Vue({
el: '#app',
data: { message: 'Hello World' }
});
<div id="app">
{{ message }}
</div>
No modules. No controllers. No $scope. Just an object, a template, and data.
React had launched a few months earlier, in May 2013. Evan looked at it. JSX felt weird ("Why am I writing HTML in JavaScript?"), but the reactive rendering idea was brilliant: change the data, and the UI updates automatically.
But React had its own complexity: you needed to understand JSX, Webpack, Babel, setState, component lifecycle methods, and the virtual DOM just to get started.
Evan wanted the simplicity of jQuery (just include a script tag and start coding) plus the reactivity of Angular and React (data-driven UI updates).
So one weekend in late 2013, he built it.
The Weekend: Writing a Framework in 48 Hours
Evan You wasn't trying to build "the next big framework." He was solving a personal problem.
He started with the core question: How do you make the DOM react to data changes without writing manual DOM manipulation?
Angular used "dirty checking" — it ran a loop on every user interaction, checking if any data had changed. It worked, but it was slow.
React used a virtual DOM — it built a lightweight copy of the DOM in memory, diffed it against the real DOM, and only updated what changed. It was faster, but required a build step (JSX compilation).
Evan wanted something in between. He built a reactive dependency-tracking system inspired by Knockout.js, an older framework that used "observables."
Here's how it worked:
- Wrap the data in getters/setters using
Object.defineProperty - Track which parts of the template depend on which data by recording "dependencies" during the first render
- When data changes, notify only the parts of the DOM that care
The core reactive code was about 100 lines. The render function was even simpler:
function render() {
this.el.innerHTML = this.template
.replace(/\{\{\s*(\w+)\s*\}\}/g, (match, key) => {
this.observe(key); // Track dependency
return this.data[key];
});
}
No virtual DOM. No JSX compiler. Just string replacement, dependency tracking, and surgical DOM updates.
He called it Seed.js — as in, a "seed" of an idea.
By Sunday night, Seed.js could:
- Render templates with
{{ }}syntax - Bind data reactively
- Handle click events with
v-on:click - Loop over arrays with
v-for
Evan tested it against a simple benchmark: render a table of 1,000 rows, update one cell, measure the time.
Angular: 120ms. React: 8ms. Seed.js: 2ms.
He sat back. Holy shit. This actually works.
The Turning Point: Going Public and Watching the Stars Roll In
Evan didn't tell anyone at Google. Seed.js was a side project, and he wasn't sure if it was even worth sharing. But in February 2014, he posted it to Hacker News with the title: "Seed — A lightweight MVVM library."
The response was lukewarm. A few upvotes. Some comments like "Interesting, but why not just use Knockout?" or "React already does this."
But one comment caught his eye: "Cool idea, but terrible name. 'Seed' is too generic."
Evan agreed. He spent a week thinking about names. He wanted something short, memorable, and related to "view" (since it was about UI). He tried:
- View.js (too generic)
- Veil.js (too pretentious)
- Vue.js (French for "view" — short, pronounceable, memorable)
On February 24, 2014, he renamed the project to Vue.js and re-launched on Hacker News.
This time, it hit the front page.
Overnight, the GitHub repo went from 30 stars to 3,000. Developers started opening issues, asking questions, and requesting features. Evan scrambled to keep up, pushing updates every few days.
The early adopters loved Vue for the same reason Evan built it: it was the simplest framework that still felt modern.
- No build step required (just include
<script src="vue.js">in your HTML) - No JSX (templates were just HTML with special attributes)
- No classes or complex APIs (just a plain JavaScript object)
But the real magic was the progressive enhancement philosophy:
- Start with a simple
<script>tag - Add components when you need them
- Add a build step (Webpack, Vite) when you're ready to scale
- You could use Vue for a single widget on a WordPress site, or build an entire SPA
React forced you to go all-in. Angular forced you to learn a framework. Vue said: "Start small, grow when you're ready."
The Benchmark War: Beating React at Its Own Game
By mid-2014, Vue had 10,000 GitHub stars. Developers started comparing it to React — and the benchmark results shocked everyone.
Stefan Krause, a German developer, built js-framework-benchmark, a standardized test that measured how fast frameworks could:
- Render 10,000 rows
- Update every 10th row
- Swap two rows
- Delete all rows
The results in 2015:
- Vue 1.0: 16ms to render, 2ms to update
- React 0.14: 68ms to render, 12ms to update
- Angular 1.5: 1,200ms to render, 300ms to update
Vue was 4x faster than React at rendering, and 6x faster at updates.
How?
React's virtual DOM was powerful but had overhead: it had to diff the entire tree on every update, even if only one cell changed.
Vue's dependency tracking was surgical: it knew exactly which DOM nodes depended on which data, so it only updated the minimum necessary.
Evan explained it in a blog post:
"React doesn't know which components are affected by a state change until it diffs the virtual DOM. Vue tracks dependencies during render, so it knows exactly what to update. No wasted work."
Facebook's React team paid attention. In 2016, they introduced React Fiber, a complete rewrite of the rendering engine to optimize updates.
Meanwhile, Vue kept iterating. Evan added:
- Single-file components (
.vuefiles that bundle template, script, and styles) - Vuex (a state management library inspired by Redux but simpler)
- Vue Router (official routing library)
- Vue CLI (scaffolding tool for complex apps)
By 2016, Vue had everything React had — but with a gentler learning curve.
The Crisis: The API That Almost Killed Vue
In 2018, Vue was the second-most-starred project on GitHub (after React). But Evan faced a crisis: Vue's reactivity system was hitting its limits.
The problem: Object.defineProperty (the API Vue used for reactivity) couldn't detect:
- Adding new properties to an object
- Deleting properties
- Setting array elements by index
Developers had to use awkward workarounds:
// This doesn't trigger reactivity:
this.user.newProp = 'value';
// You had to do this:
this.$set(this.user, 'newProp', 'value');
Evan knew the solution: ES6 Proxies, a newer JavaScript API that could intercept any property access. But Proxies weren't supported in IE11, and many enterprise teams still required IE11 support.
He faced a choice:
- Rewrite Vue to use Proxies, breaking IE11 support
- Keep the old system and live with the limitations
In September 2018, he announced Vue 3.0 would drop IE11 and use Proxies. The backlash was immediate. Developers with enterprise clients panicked.
Evan compromised: Vue 3.0 would use Proxies, but Vue 2.x would continue to get security updates for years. If you needed IE11, stick with Vue 2.
Vue 3.0 launched in September 2020. It was faster, smaller (13kb gzipped), and more TypeScript-friendly. The Composition API (inspired by React Hooks) gave developers a new way to organize logic.
Today, Vue is used by Alibaba, GitLab, Nintendo, and millions of developers. It's the third-most-popular framework (after React and Angular) — and the only one built by a single developer with no corporate backing.
The Legacy: Why Simplicity Wins
Evan You still maintains Vue full-time, funded by Patreon sponsors and corporate donations. He's never taken VC money. Vue has no board, no investors, no roadmap dictated by business needs.
Just a developer who wanted to build simple things — and realized the best framework is the one that gets out of your way.
The lesson?
Simplicity is a feature. React chose power. Angular chose structure. Vue chose simplicity — and won by making the first 10 minutes feel effortless.
Because in the end, the framework that wins isn't the one with the most features.
It's the one that lets you build something today.
Keep Reading
The 4KB File That Broke the Web: How Håkon Wium Lie Wrote CSS in a Café — And Spent 10 Years Fighting Netscape, Microsoft, and a Language Called JSSS
In 1994, a Norwegian developer proposed a simple idea: separate content from design. Netscape wanted JavaScript to control styles. Microsoft wanted their own standard. The battle for CSS nearly killed the web's future.
The 3-Character Change That Saved GitHub: How Tom Preston-Werner Bet the Company on Git When Everyone Else Was Married to Subversion — And Won by Making Version Control Beautiful
In 2008, Git was a command-line nightmare that Linux kernel hackers barely tolerated. Then three developers in San Francisco had a radical idea: what if version control could be... fun?
The 14-Hour Rewrite That Killed PHP: How Taylor Otwell Built Laravel in a Coffee Shop — And Made 'Elegant Code' a Religion
In 2011, a web developer in Arkansas got so frustrated with CodeIgniter that he spent two weeks building his own framework. Today, Laravel powers 2 million websites and made PHP beautiful again.