Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is there a performance difference between import * as _ from 'lodash' and import { indexOf } from 'lodash'

I was wondering if there is any difference in memory and performance between the 2 import.

If I have lodash in my node module, does it compile all the file anyway no matter the import?

like image 995
ProgrammerGoku Avatar asked Jul 25 '17 13:07

ProgrammerGoku


People also ask

Is Lodash slow?

Performance. We can see that Lodash performs 45% slower than using the native code. In terms of seconds (milliseconds) it is probably neglect-able, but why not take the small easy wins?

Is Lodash optimized?

Lodash is extremely well-optimized as far as modern JS goes, but, as you may know, nothing can be faster than native implementation.


1 Answers

In theory, based on the specification for import, yes, there is supposed to be a difference.

The specification allows for a compliant optimization to use static analysis of a named import in order to only load what is required to provide indexOf(), if the lodash module is written as an ES2015 module.

It would create an ImportEntry record that keeps references to how to resolve the import when running static analysis on the ES2015 module, so that only the relevant export's would be evaluated.

In practice, this is not so simple, and since there is currently not a native implementation, transpilers like Babel will convert the ES2015 import syntax into a CommonJS functional equivalent.

Unfortunately, this functionally equivalent method must still evaluate the entire module, since its exports are not known until it has been fully evaluated.

This is why the ES2015 specification requires import and export to be in the top-level scope, so that static analysis will allow a JavaScript engine to optimize by determining what portions of the file can be safely omitted when evaluating code for an export.

On the other hand, there are non-native bundlers like Rollup and Webpack that perform static analysis in order to do tree-shaking and remove sections of dead code that are not referenced by import's to the module within the bundle. This optimization is independent of the use of import / export, but using named imports instead of glob stars allows for easier and more optimal static analysis to occur within these bundlers, and eventually any native implementation that will be released in the future.

TL;DR

In theory, yes there is a difference, but in practice, there isn't a difference until native implementations are available for import / export, or unless you use a bundler that performs static analysis and tree-shaking independent of the actual syntax and specification.

In any case, it is recommended to use named imports, so that you can incur any possible optimizations in whatever environment you're using.

ECMAScript Section 15.2 Modules Specification

  • ECMAScript 2015
  • ECMAScript 2016
  • ECMAScript 2017
  • ECMAScript 2018
like image 200
Patrick Roberts Avatar answered Oct 25 '22 02:10

Patrick Roberts