nativeoverutil.md

Prefer native JS methods over user-land utils like Lodash

One Paragraph Explainer

Sometimes, using native methods is better than requiring lodash or underscore because it will not lead in a performance boost and use more space than necessary. The performance using native methods result in an overall ~50% gain which includes the following methods:

• Array.concat
• Array.fill
• Array.filter
• Array.map
• (Array|String).indexOf
• Object.find
• ...

Example: benchmark comparison - Lodash vs V8 (Native)

The graph below shows the mean of the benchmarks for a variety of Lodash methods, this shows that Lodash methods take on average 146.23% more time to complete the same tasks as V8 methods.

Code Example – Benchmark test on _.concat/Array.concat

const _ = require('lodash'),
  __ = require('underscore'),
  Suite = require('benchmark').Suite,
  opts = require('./utils'); //cf. https://github.com/Berkmann18/NativeVsUtils/blob/master/utils.js

const concatSuite = new Suite('concat', opts);
const array = [0, 1, 2];

concatSuite.add('lodash', () => _.concat(array, 3, 4, 5))
  .add('underscore', () => __.concat(array, 3, 4, 5))
  .add('native', () => array.concat(3, 4, 5))
  .run({ 'async': true });

Which returns this:

You can find a bigger list of benchmarks here or alternatively run this which would show the same but with colours.

"You don't (may not) need Lodash/Underscore"

From the repo on this matter which focuses on Lodash and Underscore.

Lodash and Underscore are great modern JavaScript utility libraries, and they are widely used by Front-end developers. However, when you are targeting modern browsers, you may find out that there are many methods which are already supported natively thanks to ECMAScript5 [ES5] and ECMAScript2015 [ES6]. If you want your project to require fewer dependencies, and you know your target browser clearly, then you may not need Lodash/Underscore.

There's also an ESLint plugin which detects where you're using libraries but don't need to.

Here's an example of that plugin in use: Consider a file called lodashLove.js shown below

const _ = require('lodash');

let arr = [0, 1, 2, 4, 8, 16];

console.log(_.map(arr, x => `d${x}`));

if (_.includes(arr, 0)) console.log('0 found');

console.log('compacted:', _.compact(arr));

Example: detecting non-v8 util usage using a linter

Here's what ESLint would output when using the YDNLU plugin.

Of course, the example above doesn't seem realistic considering what actual codebases would have but you get the idea.