Why would someone prefer either the lodash.js or underscore.js utility library over the other?
Lodash seems to be a drop-in replacement for underscore, the latter having been around longer.
I think both are brilliant, but I do not know enough about how they work to make an educated comparison, and I would like to know more about the differences.
I created Lo-Dash to provide more consistent cross-environment iteration support for arrays, strings, objects, and arguments
objects1. It has since become a superset of Underscore, providing more consistent API behavior, more features (like AMD support, deep clone, and deep merge), more thorough documentation and unit tests (tests which run in Node, Ringo, Rhino, Narwhal, PhantomJS, and browsers), better overall performance and optimizations for large arrays/object iteration, and more flexibility with custom builds and template pre-compilation utilities.
Because Lo-Dash is updated more frequently than Underscore, a lodash underscore
build is provided to ensure compatibility with the latest stable version of Underscore.
At one point I was even given push access to Underscore, in part because Lo-Dash is responsible for raising more than 30 issues; landing bug fixes, new features, & perf gains in Underscore v1.4.x+.
In addition there are at least 3 Backbone boilerplates that include Lo-Dash by default and Lo-Dash is now mentioned in Backbone’s official documentation.
Check out Kit Cambridge's post, Say "Hello" to Lo-Dash, for a deeper breakdown on the differences between Lo-Dash and Underscore.
Footnotes:
arguments
objects. In newer browsers, Underscore methods ignore holes in arrays, "Objects" methods iterate arguments
objects, strings are treated as array-like, and methods correctly iterate functions (ignoring their "prototype" property) and objects (iterating shadowed properties like "toString" and "valueOf"), while in older browsers they will not. Also, Underscore methods like _.clone
preserve holes in arrays, while others like _.flatten
don't.Lo-Dash is inspired by underscore, but nowadays is superior solution. You can make your custom builds, have a higher performance, support AMD and have great extra features. Check this Lo-Dash vs Underscore benchmarks on jsperf and.. this awesome post about lo-dash:
One of the most useful feature when you work with collections, is the shorthand syntax:
var characters = [
{ 'name': 'barney', 'age': 36, 'blocked': false },
{ 'name': 'fred', 'age': 40, 'blocked': true }
];
// using "_.filter" callback shorthand
_.filter(characters, { 'age': 36 });
// using underscore
_.filter(characters, function(character) { return character.age === 36; } );
// ? [{ 'name': 'barney', 'age': 36, 'blocked': false }]
(taken from lodash docs)
If like me you were expecting a list of usage differences between underscore and lodash, there's a guide for migrating from underscore to lodash.
Here's the current state of it for posterity:
- Underscore
_.any
is Lodash_.some
- Underscore
_.all
is Lodash_.every
- Underscore
_.compose
is Lodash_.flowRight
- Underscore
_.contains
is Lodash_.includes
- Underscore
_.each
doesn’t allow exiting by returningfalse
- Underscore
_.findWhere
is Lodash_.find
- Underscore
_.flatten
is deep by default while Lodash is shallow- Underscore
_.groupBy
supports an iteratee that is passed the parameters(value, index, originalArray)
, while in Lodash, the iteratee for_.groupBy
is only passed a single parameter:(value)
.- Underscore
_.indexOf
with 3rd parameterundefined
is Lodash_.indexOf
- Underscore
_.indexOf
with 3rd parametertrue
is Lodash_.sortedIndexOf
- Underscore
_.indexBy
is Lodash_.keyBy
- Underscore
_.invoke
is Lodash_.invokeMap
- Underscore
_.mapObject
is Lodash_.mapValues
- Underscore
_.max
combines Lodash_.max
&_.maxBy
- Underscore
_.min
combines Lodash_.min
&_.minBy
- Underscore
_.sample
combines Lodash_.sample
&_.sampleSize
- Underscore
_.object
combines Lodash_.fromPairs
and_.zipObject
- Underscore
_.omit
by a predicate is Lodash_.omitBy
- Underscore
_.pairs
is Lodash_.toPairs
- Underscore
_.pick
by a predicate is Lodash_.pickBy
- Underscore
_.pluck
is Lodash_.map
- Underscore
_.sortedIndex
combines Lodash_.sortedIndex
&_.sortedIndexOf
- Underscore
_.uniq
by aniteratee
is Lodash_.uniqBy
- Underscore
_.where
is Lodash_.filter
- Underscore
_.isFinite
doesn’t align withNumber.isFinite
(e.g._.isFinite('1')
returnstrue
in Underscore butfalse
in Lodash)- Underscore
_.matches
shorthand doesn’t support deep comparisons
(e.g._.filter(objects, { 'a': { 'b': 'c' } })
)- Underscore ? 1.7 & Lodash
_.template
syntax is_.template(string, option)(data)
- Lodash
_.memoize
caches areMap
like objects- Lodash doesn’t support a
context
argument for many methods in favor of_.bind
- Lodash supports implicit chaining, lazy chaining, & shortcut fusion
- Lodash split its overloaded
_.head
,_.last
,_.rest
, &_.initial
out into
_.take
,_.takeRight
,_.drop
, &_.dropRight
(i.e._.head(array, 2)
in Underscore is_.take(array, 2)
in Lodash)
In addition to John's answer, and reading up on lodash (which I had hitherto regarded as a "me-too" to underscore), and seeing the performance tests, reading the source-code, and blog posts, the few points which make lodash much superior to underscore are these:
It's not about the speed, as it is about consistency of speed (?)
If you look into underscore's source-code, you'll see in the first few lines that underscore falls-back on the native implementations of many functions. Although in an ideal world, this would have been a better approach, if you look at some of the perf links given in these slides, it is not hard to draw the conclusion that the quality of those 'native implementations' vary a lot browser-to-browser. Firefox is damn fast in some of the functions, and in some Chrome dominates. (I imagine there would be some scenarios where IE would dominate too). I believe that it's better to prefer a code whose performance is more consistent across browsers.
Do read the blog post earlier, and instead of believing it for its sake, judge for yourself by running the benchmarks. I am stunned right now, seeing a lodash performing 100-150% faster than underscore in even simple, native functions such as
Array.every
in Chrome!
The extras in lodash are also quite useful.
Here is a list of differences between lodash, and it's underscore-build is a drop-in replacement for your underscore projects.
This is 2014 and a couple of years too late. Still I think my point holds:
IMHO this discussion got blown out of proportion quite a bit. Quoting the aforementioned blog post:
Most JavaScript utility libraries, such as Underscore, Valentine, and wu, rely on the “native-first dual approach.” This approach prefers native implementations, falling back to vanilla JavaScript only if the native equivalent is not supported. But jsPerf revealed an interesting trend: the most efficient way to iterate over an array or array-like collection is to avoid the native implementations entirely, opting for simple loops instead.
As if "simple loops" and "vanilla Javascript" are more native than Array or Object method implementations. Jeez ...
It certainly would be nice to have a single source of truth, but there isn't. Even if you've been told otherwise, there is no Vanilla God, my dear. I'm sorry. The only assumption that really holds is that we are all writing Javascript code that aims at performing well in all major browsers, knowing that all of them have different implementations of the same things. It's a bitch to cope with, to put it mildly. But that's the premise, whether you like it or not.
Maybe y'all are working on large scale projects that need twitterish performance so that you really see the difference between 850,000 (underscore) vs. 2,500,000 (lodash) iterations over a list per sec right now!
I for one am not. I mean, I worked projects where I had to address performance issues, but they were never solved or caused by neither Underscore nor Lo-Dash. And unless I get hold of the real differences in implementation and performance (we're talking C++ right now) of lets say a loop over an iterable (object or array, sparse or not!), I rather don't get bothered with any claims based on the results of a benchmark platform that is already opinionated.
It only needs one single update of lets say Rhino to set its Array method implementations on fire in a fashion that not a single "medieval loop methods perform better and forever and whatnot" priest can argue his/her way around the simple fact that all of a sudden array methods in FF are much faster than his/her opinionated brainfuck. Man, you just can't cheat your runtime environment by cheating your runtime environment! Think about that when promoting ...
your utility belt
... next time.
So to keep it relevant:
Choose whatever approach fits your needs the most. As usual. I'd prefer fallbacks on actual implementations over opinionated runtime cheats anytime but even that seems to be a matter of taste nowadays. Stick to quality resources like http://developer.mozilla.com and http://caniuse.com and you'll be just fine.
I'm agree with most of things said here but I just want to point out an argument in favor of underscore.js: the size of the library.
Specially in case you are developing an app or website which intend to be use mostly on mobile devices, the size of the resulting bundle and the effect on the boot or download time may have an important role.
For comparison, these sizes are those I noticed with source-map-explorer after running ionic serve:
lodash: 523kB
underscore.js: 51.6kb
edited Feb 2020:
one can use BundlePhobia to check the current size of Lo-Dash and Underscore
Not sure if that is what OP meant, but I came accross this question because I was searching for a list of issues I have to keep in mind when migrating from underscore to lodash.
I would really appreciate if someone posted an article with a complete list of such differences. Let me start with the things I've learned the hard way (that is, things which made my code explode on production:/) :
_.flatten
in underscore is deep by default and you have to pass true as second argument to make it shallow. In lodash it is shallow by default and passing true as second argument will make it deep! :)_.last
in underscore accepts a second argument which tells how many elements you want. In lodash
there is no such option. You can emulate this with .slice
_.first
(same issue)_.template
in underscore can be used in many ways, one of which is providing the template string and data and getting HTML
back (or at least that's how it worked some time ago). In lodash
you receive a function which you should then feed with the data._(something).map(foo)
works in underscore, but in lodash I had to rewrite it to _.map(something,foo)
. Perhaps that was just a TypeScript
-issuehttp://benmccormick.org/2014/11/12/underscore-vs-lodash/
Latest article comparing the two by Ben McCormick:
Lo-Dash's API is a superset of Underscore's.
Under the hood [Lo-Dash] has been completely rewritten.
Lo-Dash is definitely not slower than Underscore.
What has Lo-Dash added?
- Usability Improvements
- Extra Functionality
- Performance Gains
- Shorthand syntaxes for chaining
- Custom Builds to only use what you need
- Semantic versioning and 100% code coverage
I just found one difference that ended up being important for me. The non-underscore-compatible version of lodash's _.extend()
does not copy over class-level-defined properties or methods.
I've created a Jasmine test in CoffeeScript that demonstrates this:
https://gist.github.com/softcraft-development/1c3964402b099893bd61
Fortunately, lodash.underscore.js
preserves Underscore's behaviour of copying everything, which for my situation was the desired behaviour.
lodash has got _.mapValues()
which is identical to underescore's _.mapObject()
.
For the most part underscore is subset of lodash. At times, like presently underscore will have cool little functions lodash doesn't have like mapObject. This one saved me a lot of time in the development of my project.
They are pretty similar, with Lodash is taking over...
They both are a utility library which takes the world of utility in JavaScript...
Seems Lodash is getting updated more regularly now, so more used in the latest projects...
Also Lodash seems is lighter by a couple of KBs...
Both have a good api and doc, but I think Lodash one is better...
Here is screenshot for each of the docs for getting the first value of an array...
underscore:
As things may get updated time to time, just check their website also...
©2020 All rights reserved.