Benchmark: Destructuring vs Variables

Destructuring vs Variables (version: 3)

Script Preparation code:

window.testData = {fname: 'John', lname: 'Doe', age: 35, country: 'UK'};

Tests:

Destructuring all CONST
const {fname, lname, age, country} = testData;
Destructuring each CONST
const {fname} = testData; const {lname} = testData; const {age} = testData; const {country} = testData;
Destructuring all as CONST
const {fname: fn, lname: ln, age: a, country: c} = testData;
Destructuring each as CONST
const {fname: fn} = testData; const {lname: ln} = testData; const {age: a} = testData; const {country: c} = testData;
Variables CONST
const fname = testData.fname; const lname = testData.lname; const age = testData.age; const country = testData.country;
Destructuring all LET
let {fname, lname, age, country} = testData;
Destructuring each LET
let {fname} = testData; let {lname} = testData; let {age} = testData; let {country} = testData;
Destructuring all as LET
let {fname: fn, lname: ln, age: a, country: c} = testData;
Destructuring each as LET
let {fname: fn} = testData; let {lname: ln} = testData; let {age: a} = testData; let {country: c} = testData;
Variables LET
let fname = testData.fname; let lname = testData.lname; let age = testData.age; let country = testData.country;

Rendered benchmark preparation results:

Previous results

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

Latest run results:

Run details: (Test run date: 3 years ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 11_2_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/89.0.4389.82 Safari/537.36

Browser/OS: Chrome 89 on Mac OS X 11.2.2