>  기사  >  웹 프론트엔드  >  ESBench: 최신 벤치마킹 도구

ESBench: 최신 벤치마킹 도구

Barbara Streisand
Barbara Streisand원래의
2024-09-25 06:28:06167검색

benchmark.js가 2024년 4월에 종료됩니다. 이제 새로운 세대의 도구가 등장할 때입니다!

ESBench는 2024년에 출시된 새로운 JavaScript 벤치마킹 도구입니다. 최신 JS 프로젝트에 간단하고 확장 가능한 벤치마킹 지원을 제공하도록 설계되었습니다.

GitHub 저장소

문제

  • 처음에는 JavaScript가 소스에서 직접 실행되었지만 애플리케이션이 더욱 복잡해짐에 따라 이러한 경우는 점점 줄어들었습니다. 최신 애플리케이션을 구축해야 하는 경우가 많습니다. 빌드 프로세스를 통합하려면 벤치마킹 도구가 필요하며 빌드가 성능에 미치는 영향을 고려해야 합니다.

  • JavaScript에는 "공식 런타임"이 없으며 브라우저, Node, Deno 및 최근에는 Bun이 모두 고성능을 주장합니다. 하지만 자신의 코드에서는 어떻습니까? 여러 런타임에서 벤치마크를 실행하고 결과를 하나의 보고서로 내보낼 수 있는 도구가 있다면 정말 좋을 것 같습니다 —— 이것이 ESBench를 만들게 된 주된 동기였습니다.

  • JS 벤치마크 도구에서는 수행할 수 없는 몇 가지 유용한 기능이 있습니다(예: 점근적 복잡성 계산, 반환 값 검증, 결과를 대화형 차트에 표시) .

ESBench를 사용한 벤치마크

이러한 문제를 해결하기 위해 필요한 모든 기능을 포함하고 간단한 API를 갖춘 새로운 도구를 만들기로 결정했습니다.

약 1년의 개발 끝에 ESBench가 탄생했습니다.

ESBench를 온라인으로 사용해 볼 수 있습니다

스위트 쓰기

ESBench는 JS 작성 방식 중 가장 널리 사용되는 선언적 API 및 클로저를 선택합니다.

Set.has와 Array.includes 비교:

// benchmark/array-vs-set.js
export default scene => {
    const length = 1000;
    const array = Array.from({ length }, (_, i) => i);

    const set = new Set(array);
    const value = array[Math.floor(array.length / 2)];

    scene.bench("Set", () => set.has(value));
    scene.bench("Array", () => array.includes(value));
};

pnpm exec esbench를 실행하여 제품군을 실행하면 결과는 다음과 같습니다.

Suite: benchmark/array-vs-set.js
| No. |  Name |      time | time.SD |
| --: | ----: | --------: | ------: |
|   0 |   Set |   3.64 ns | 0.00 ns |
|   1 | Array | 326.36 ns | 0.17 ns |

조금 더 많은 기능

매개변수화 및 기준선은 자주 요구되는 요구사항이며 ESBench는 간단한 옵션으로 이를 지원합니다.

export default {
    baseline: { type: "type", value: Set },
    params: {
        length: [10, 10_000],
        type: [Set, Array],
    },
    setup(scene) {
        const { length, type } = scene.params;

        // Prepare
        const array = Array.from({ length }, (_, i) => i);
        const set = new Set(array);
        const value = array[Math.floor(array.length / 2)];

        // Support conditions
        if (type === Set) {
            // Define benchmark cases
            scene.bench("create", () => new Set(array));
            scene.bench("has", () => set.has(value));
        } else {
            scene.bench("create", () => [...array]);
            scene.bench("has", () => array.includes(value));
        }
    },
};

텍스트 보고서:

ESBench: A modern benchmarking tool

크로스 런타임

위의 문제로 돌아가서 런타임 전반에 걸쳐 실행합니다.

// esbench.config.js
import { defineConfig, ProcessExecutor, ViteBuilder, WebRemoteExecutor } from "esbench/host";

export default defineConfig({
    toolchains: [{
        // Build your benchmark code with Vite, require vite installed.
        builders: [new ViteBuilder()],
        executors: [
            // Run suite on Node.
            new ProcessExecutor("node"),

            // Run suite on Bun.
            new ProcessExecutor("bun"),

            // Open the default browser to run benchmark,
            // in my computer it's Firefox.
            {
                name: "Firefox",
                use: new WebRemoteExecutor({ open: {} }),
            },
        ],
    }],
});

런타임을 기준으로 설정할 수도 있습니다.

import { defineSuite } from "esbench";

export default defineSuite({
    baseline: { type: "Executor", value: "node" },
    setup(scene) {
        const length = 1000;
        const array = Array.from({ length }, (_, i) => i);

        const set = new Set(array);
        const value = array[Math.floor(array.length / 2)];

        scene.bench("Set", () => set.has(value));
        scene.bench("Array", () => array.includes(value));
    },
});

결과:

| No. |  Name | Executor |      time | time.SD | time.ratio |
| --: | ----: | -------: | --------: | ------: | ---------: |
|   0 |   Set |     node |   3.69 ns | 0.03 ns |   baseline |
|   1 |   Set |      bun |   0.00 ns | 0.00 ns |   -100.00% |
|   2 |   Set |  Firefox |   0.00 ns | 0.00 ns |   -100.00% |
|     |       |          |           |         |            |
|   3 | Array |     node | 325.02 ns | 1.00 ns |   baseline |
|   4 | Array |      bun | 324.87 ns | 0.08 ns |     -0.04% |
|   5 | Array |  Firefox | 516.70 ns | 0.75 ns |    +58.98% |
Warnings:
[No.1] Set: The function duration is indistinguishable from the empty function duration.
[No.2] Set: The function duration is indistinguishable from the empty function duration.

더 많은 사용 사례

ESBench는 기본 사용법 이상의 기능을 수행할 수 있습니다.

  • 함수의 Big-O 시간 복잡도 계산
  • zlib 함수의 압축/압축 해제 시간 및 출력 크기 측정
  • 벤치마크 전 반환 값 검증
  • GitHub Action 이미지 3개 벤치마크

결론

JavaScript로 벤치마크를 작성하는 데 지쳤다면 ESBench가 바로 여러분이 기다려온 라이브러리입니다.

위 내용은 ESBench: 최신 벤치마킹 도구의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.