Run results for: Lodash: differenceBy vs reduce

Run details:

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

Browser: Chrome 129

Operating system: Mac OS X 10.15.7

Device Platform: Desktop

Date tested: one year ago

Test name	Executions per second
Lodash differenceBy	310594.4 Ops/sec
javascript filter map	442551.3 Ops/sec
javascript reduce	588669.9 Ops/sec

HTML Preparation code:

<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.21/lodash.min.js"></script>

Script Preparation code:

var allWorkspaces = [
  { id: 'id', name: 'name' },
  { id: 'id0', name: 'name0' },
  { id: 'id1', name: 'name1' },
  { id: 'id2', name: 'name2' },
  { id: 'id3', name: 'name3' },
  { id: 'id4', name: 'name4' },
  { id: 'id5', name: 'name5' },
  { id: 'id6', name: 'name6' },
  { id: 'id7', name: 'name7' },
  { id: 'id8', name: 'name8' },
  { id: 'id9', name: 'name9' },
  { id: 'id10', name: 'name10' },
  { id: 'id11', name: 'name11' },
  { id: 'id12', name: 'name12' },
  { id: 'id13', name: 'name13' },
  { id: 'id14', name: 'name14' },
  { id: 'id15', name: 'name15' },
  { id: 'id16', name: 'name16' },
  { id: 'id17', name: 'name17' },
  { id: 'id18', name: 'name18' },
  { id: 'id19', name: 'name19' },
  { id: 'id20', name: 'name20' },
  { id: 'id21', name: 'name21' },
  { id: 'id22', name: 'name22' },
  { id: 'id23', name: 'name23' },
  { id: 'id24', name: 'name24' },
  { id: 'id25', name: 'name25' },
  { id: 'id26', name: 'name26' },
  { id: 'id27', name: 'name27' },
  { id: 'id28', name: 'name28' },
  { id: 'id29', name: 'name29' },
  { id: 'id30', name: 'name30' },
  { id: 'id31', name: 'name31' },
  { id: 'id32', name: 'name32' },
  { id: 'id33', name: 'name33' },
  { id: 'id34', name: 'name34' },
  { id: 'id35', name: 'name35' },
  { id: 'id36', name: 'name36' },
  { id: 'id37', name: 'name37' },
  { id: 'id38', name: 'name38' },
  { id: 'id39', name: 'name39' },
  { id: 'id40', name: 'name40' },
  { id: 'id41', name: 'name41' },
  { id: 'id42', name: 'name42' },
  { id: 'id43', name: 'name43' },
  { id: 'id44', name: 'name44' },
  { id: 'id45', name: 'name45' },
  { id: 'id46', name: 'name46' },
  { id: 'id47', name: 'name47' },
  { id: 'id48', name: 'name48' },
  { id: 'id49', name: 'name49' },
  { id: 'id50', name: 'name50' },
  { id: 'id51', name: 'name51' },
  { id: 'id52', name: 'name52' },
  { id: 'id53', name: 'name53' },
  { id: 'id54', name: 'name54' },
  { id: 'id55', name: 'name55' },
  { id: 'id56', name: 'name56' },
  { id: 'id57', name: 'name57' },
  { id: 'id58', name: 'name58' },
  { id: 'id59', name: 'name59' },
  { id: 'id60', name: 'name60' },
  { id: 'id61', name: 'name61' },
  { id: 'id62', name: 'name62' },
  { id: 'id63', name: 'name63' },
  { id: 'id64', name: 'name64' },
  { id: 'id65', name: 'name65' },
  { id: 'id66', name: 'name66' },
  { id: 'id67', name: 'name67' },
]

var selectedWorkspaces = [
 { id: 'id30', name: 'name30' },
  { id: 'id1', name: 'name1' },
  { id: 'id62', name: 'name62' },
  { id: 'id25', name: 'name25' },
  { id: 'id42', name: 'name42' },
  { id: 'id64', name: 'name64' },
  { id: 'id27', name: 'name27' },
  { id: 'id67', name: 'name67' },
  { id: 'id52', name: 'name52' },
  { id: 'id0', name: 'name0' },
  { id: 'id41', name: 'name41' },
  { id: 'id5', name: 'name5' },
  { id: 'id36', name: 'name36' },
  { id: 'id44', name: 'name44' },
  { id: 'id46', name: 'name46' },
  { id: 'id45', name: 'name45' },
  { id: 'id63', name: 'name63' },
  { id: 'id15', name: 'name15' },
  { id: 'id18', name: 'name18' },
  { id: 'id66', name: 'name66' },
  { id: 'id47', name: 'name47' },
  { id: 'id43', name: 'name43' },
  { id: 'id17', name: 'name17' },
  { id: 'id60', name: 'name60' },
  { id: 'id', name: 'name' },
  { id: 'id4', name: 'name4' },
  { id: 'id39', name: 'name39' },
  { id: 'id22', name: 'name22' },
  { id: 'id54', name: 'name54' },
  { id: 'id55', name: 'name55' },
  { id: 'id57', name: 'name57' },
  { id: 'id8', name: 'name8' },
  { id: 'id9', name: 'name9' },
]

Tests:

Lodash differenceBy
_.differenceBy( allWorkspaces, selectedWorkspaces, 'id', )
javascript filter map
const workspacesIds = selectedWorkspaces.map((workspace) => workspace.id); allWorkspaces .filter((workspace) => !workspacesIds.includes(workspace.id)) .map((workspace) => workspace.id);
javascript reduce
const workspacesIds = new Set(selectedWorkspaces.map((workspace) => workspace.id)); allWorkspaces.reduce((acc, workspace) => { if (!workspacesIds.has(workspace)) { acc.push(workspace) } return acc; }, [])

Run results for: Lodash: differenceBy vs reduce

Comparing performance of: lodash differenceBy with javascript reduce

Lodash differenceBy

javascript filter map

javascript reduce