npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@innblockchain-exchange/array-to-tree

v0.0.3

Published

Converts an array of items with ids and parent ids to a nested tree in a performant `O(n)` way. Runs in browsers and node.

Downloads

10

Readme

Innblockchain array to tree

npm version minified size CircleCI codecov Dependency Status typings included npm license

Converts an array of items with ids and parent ids to a nested tree in a performant way (time complexity O(n)). Runs in browsers and node.

Why another package

Other packages have stricter assumptions or are not as performant, as they often use nested loops or recursion. For example:

o-unflatten requires the input to be ordered such that parent nodes always come before their children. un-flatten-tree uses 2 nested loops (time complexity O(n^2)).

This implementation does not require any order of items in the input array and focuses on runtime performance. It is the fastest amongst 4 different packages, you can find the benchmarks here. It uses an index and a single loop (time complexity O(n)). It was inspired by this discussion on StackOverflow.

Installation

yarn add innblockchain-array-to-tree

or if using npm

npm install --save innblockchain-array-to-tree

Usage

const tree = arrayToTree([
  { id: "4", parentId: null, custom: "abc" },
  { id: "31", parentId: "4", custom: "12" },
  { id: "1941", parentId: "418", custom: "de" },
  { id: "1", parentId: "418", custom: "ZZZz" },
  { id: "418", parentId: null, custom: "ü" },
]);

Which results in the following array:

[
  {
    data: { id: "4", parentId: null, custom: "abc" },
    children: [
      { data: { id: "31", parentId: "4", custom: "12" }, children: [] },
    ],
  },
  {
    data: { id: "418", parentId: null, custom: "ü" },
    children: [
      { data: { id: "1941", parentId: "418", custom: "de" }, children: [] },
      { data: { id: "1", parentId: "418", custom: "ZZZz" }, children: [] },
    ],
  },
];

Configuration

You can provide a second argument to arrayToTree with configuration options. Right now, you can set the following:

  • id: Key of the id field of the item. Also works with nested properties (e. g. "nested.parentId"). Default: "id".
  • parentId: Key of the parent's id field of the item. Also works with nested properties (e. g. "nested.parentId"). Default: "parentId".
  • nestedIds: Option to enable/disable nested ids. Default: true.
  • childrenField: Key which will contain all child nodes of the parent node. Default: "children"
  • dataField: Key which will contain all properties/data of the original items. Set to null if you don't want a container. Default: "data"
  • throwIfOrphans: Option to throw an error if the array of items contains one or more items that have no parents in the array or if the array of items contains items with a circular parent/child relationship. This option has a small runtime penalty, so it's disabled by default. When enabled, the function will throw an error containing the parentIds that were not found in the items array, or in the case of only circular item relationships a generic error. The function will throw an error if the number of nodes in the tree is smaller than the number of nodes in the original array. When disabled, the function will just ignore orphans and circular relationships and not add them to the tree. Default: false
  • rootParentIds: Object with parent ids as keys and true as values that should be considered the top or root elements of the tree. This is useful when your tree is a subset of full tree, which means there is no item whose parent id is one of undefined, null or ''. The array you pass in will be replace the default value. undefined and null are always considered to be rootParentIds. For more details, see #23. Default: {'': true}
  • assign: Option that enables Object.assign instead of the spread operator to create an item in the tree when dataField is null. This is useful if your items have a prototype that should be maintained. If enabled and dataField is null, the original node item will be used, and the children property will be assigned, calling any setters on that field. If dataField is not null, this option has no effect, since the original node will be used under the dataField of a new object. If you are unsure whether you need to enable this, it's likely fine to leave it disabled. Default: false

Example:

const tree = arrayToTree(
  [
    { num: "4", ref: null, custom: "abc" },
    { num: "31", ref: "4", custom: "12" },
    { num: "1941", ref: "418", custom: "de" },
    { num: "1", ref: "418", custom: "ZZZz" },
    { num: "418", ref: null, custom: "ü" },
  ],
  { id: "num", parentId: "ref", childrenField: "nodes" }
);

Which produces:

[
  {
    data: { num: "4", ref: null, custom: "abc" },
    nodes: [{ data: { num: "31", ref: "4", custom: "12" }, nodes: [] }],
  },
  {
    data: { num: "418", ref: null, custom: "ü" },
    nodes: [
      { data: { num: "1941", ref: "418", custom: "de" }, nodes: [] },
      { data: { num: "1", ref: "418", custom: "ZZZz" }, nodes: [] },
    ],
  },
];

Example with no data field:

const tree = arrayToTree(
  [
    { id: "4", parentId: null, custom: "abc" },
    { id: "31", parentId: "4", custom: "12" },
    { id: "1941", parentId: "418", custom: "de" },
    { id: "1", parentId: "418", custom: "ZZZz" },
    { id: "418", parentId: null, custom: "ü" },
  ],
  { dataField: null }
);

Which produces:

[
  {
    id: "4",
    parentId: null,
    custom: "abc",
    children: [{ id: "31", parentId: "4", custom: "12", children: [] }],
  },
  {
    id: "418",
    parentId: null,
    custom: "ü",
    children: [
      { id: "1941", parentId: "418", custom: "de", children: [] },
      { id: "1", parentId: "418", custom: "ZZZz", children: [] },
    ],
  },
];

Example with nested id/parentId properties:

const tree = arrayToTree(
  [
    { num: { id: "4" }, parent: { parentId: null }, custom: "abc" },
    { num: { id: "31" }, parent: { parentId: "4" }, custom: "12" },
  ],
  { id: "num.id", parentId: "parent.parentId" }
);

Which produces:

[
  {
    data: { num: { id: "4" }, parent: { parentId: null }, custom: "abc" },
    children: [
      {
        data: { num: { id: "31" }, parent: { parentId: "4" }, custom: "12" },
        children: [],
      },
    ],
  },
];

TypeScript

This project includes types, just import the module as usual:

import { arrayToTree } from "performant-array-to-tree";

const tree = arrayToTree(array);

Development

yarn version to create a new version npm login npm publish --access public to publish it to npm