Benchmark: reactive vs preactive

Script Preparation code:

let shouldTrack = false;

function preactive(obj) {
    obj.v = reactive(obj)
    return obj;
}

function reactive(obj) {
    return new Proxy(obj, {
        get(target, key) {
            if (shouldTrack) {
                console.log("tracking")
            };
            return target[key]
        }
    })
}

function getPreactive() {
    return preactive({
        a: "a",
        b: "h",
        c: "i",
        d: "j",
        e: "k",
        f: "l",
        g: "m",
    });
}

function getReactive() {
    return reactive({
        a: "a",
        b: "h",
        c: "i",
        d: "j",
        e: "k",
        f: "l",
        g: "m",
    });
}


function preactiveNoTrack() {
    const foo = getPreactive();
    const vFo_ = getReactive();
    foo.a;
    foo.b;
    foo.c;
    foo.d;
    foo.e;
    foo.f;
    foo.g;
}

function preactiveTrack() {
    const foo = getPreactive();
    const vFo_ = getReactive();
    foo.v.a;
    foo.v.b;
    foo.v.c;
    foo.v.d;
    foo.v.e;
    foo.v.f;
    foo.v.g;
}


function reactiveTrack() {
    const foo = getPreactive();
    const vFoo = getReactive();
    vFoo.a;
    vFoo.b;
    vFoo.c;
    vFoo.d;
    vFoo.e;
    vFoo.f;
    vFoo.g;
}

Tests:

preactive - no track
preactiveNoTrack();
reactive - track & no track
reactiveTrack();
Preactive - track
preactiveTrack();
init reactive
getReactive();
init preactive
getPreactive();

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
preactive - no track
reactive - track & no track
Preactive - track
init reactive
init preactive

Fastest: N/A

Slowest: N/A

ⓘ Get performance results from real users on your website with Request Metrics.

Website Performance Monitoring by Request Metrics

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/110.0.0.0 Safari/537.36

Browser/OS: Chrome 110 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
preactive - no track	1224832.0 Ops/sec
reactive - track & no track	819023.4 Ops/sec
Preactive - track	822312.6 Ops/sec
init reactive	3140184.0 Ops/sec
init preactive	2447145.0 Ops/sec

reactive vs preactive (version: 1)

Comparing performance of: preactive - no track vs reactive - track & no track vs Preactive - track vs init reactive vs init preactive

Created: one year ago by: Registered User

Jump to the latest result

preactive - no track

reactive - track & no track

Preactive - track

init reactive

init preactive

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A