million

> Want to **automatically find and fix performance issues**? Check out [Million Lint](https://million.dev/).

<a href="https://million.dev">
  <img src="https://raw.githubusercontent.com/aidenybai/million/main/.github/assets/banner.png" alt="Million.js Banner" />
</a>

<div align="center">
  <a href="https://img.shields.io/github/actions/workflow/status/aidenybai/million/ci.yml?branch=main" target="_blank"><img src="https://img.shields.io/github/actions/workflow/status/aidenybai/million/ci.yml?branch=main&style=flat&colorA=000000&colorB=000000" alt="CI" /></a>
  <a href="https://www.npmjs.com/package/million" target="_blank"><img src="https://img.shields.io/npm/v/million?style=flat&colorA=000000&colorB=000000" alt="NPM Version" /></a>
    <a href="https://www.npmjs.com/package/million" target="_blank"><img src="https://img.shields.io/npm/dt/million.svg?style=flat&colorA=000000&colorB=000000" alt="NPM Downloads" /></a>
  <a href="https://discord.gg/X9yFbcV2rF" target="_blank"><img src="https://img.shields.io/discord/938129049539186758?style=flat&colorA=000000&colorB=000000&label=discord&logo=discord&logoColor=ffffff" /></a>

<table>
    <tbody>
      <tr>
        <td>
          <a href="https://million.dev/docs/introduction">📚 Read the docs</a>
        </td>
        <td>
          <a href="https://www.youtube.com/watch?v=VkezQMb1DHw">🎦 Watch video</a>
        </td>
        <td>
          <a href="https://million.dev/chat">💬 Join our Discord</a>
        </td>
        <td>
          <a href="https://twitter.com/milliondotjs">🌐 Follow on Twitter</a>
        </td>
      </tr>
    </tbody>
  </table>
</div>

## What is Million.js?

Million.js is an extremely fast and lightweight optimizing compiler that make [components](https://react.dev) up to [_**70% faster**_](https://krausest.github.io/js-framework-benchmark/current.html).

> Oh man... Another [`/virtual dom|javascript/gi`](https://regexr.com/6mr5f) framework? I'm fine with [React](https://reactjs.org) already, why do I need this?

Million.js works with React and makes reconciliation faster. By using a fine-tuned, optimized virtual DOM, Million.js reduces the overhead of diffing ([_try it out here_](https://demo.million.dev))

**TL;DR:** Imagine [React](https://react.dev) components running at the speed of raw JavaScript.

### [**👉 Setup Million.js in seconds! →**](https://million.dev/)

## Installation

The Million.js CLI will automatically install the package and configure your project for you.

```bash
npx million@latest
```

Once your down, just run your project and information should show up in your command line!

> Having issues installing? [**→ View the installation guide**](https://million.dev/docs/install)

## Why Million.js?

To understand why to use Million.js, we need to understand how React updates interfaces. When an application's state or props change, React undergoes an update in two parts: rendering and reconciliation.

To show this, let's say this is our `App`:

```jsx
function A