본문 바로가기

클라이언트/JavaScript
[자바스크립트(JavaScript)] Million.js

// Million.js

- 빠르고 효율적인 JavaScript 프레임워크

- 공식 홈페이지에 보면, 컴포넌트를 최대 70%나 빠르게 만들어주는 매우 빠르고 가벼운 최적화 컴파일러라고 설명이 되어있다.

- React의 가상 DOM 매커니즘을 대체하여 더 효율적인 매커니즘으로 DOM 업데이트를 수행한다.

- 공식 홈페이지: https://million.dev/

 

Million.js | Million.js

The Virtual DOM Replacement for React

million.dev


1. 설치

npm install million

2. 컴파일러 추가

- vite 기반의 React 프로젝트인 경우 vite.config.js 파일을 수정하여 추가한다.

import million from "million/compiler";
import react from "@vitejs/plugin-react";
import { defineConfig } from "vite";
 
export default defineConfig({
  plugins: [million.vite({ auto: true }), react()],
});

※ 만약 컴포넌트와 관련된 런타임 에러가 발생한 경우, 주석을 사용하여 해당 컴포넌트의 오류를 무시할 수 있다.

// million-ignore
function 컴포넌트명() {
  return ...
}

이 외에도 Block 컴포넌트 For 컴포넌트를 제공하여 빠른 렌더링, 최적화된 리스트 렌더링이 가능하다.

하지만 문서, 자료들이 부족하다는 치명적인 단점이 있다..