Log output for objects without circular references is a mess.

[Cerbrus]

The snippets' console output for logged objects is, quite frankly, a mess.
Objects that contain no circular references are obfuscated beyond recognition. Their structure is no longer obvious.

For example:

const x = {};
const y = [];
const obj = {
  foo: x,
  bar: x,
  baz: {x, y},
  wut: [x, y]
};

console.log(obj);

Now logs:

{
  "foo": {},
  "bar": /**ref:2**/,
  "baz": {
    "x": /**ref:2**/,
    "y": []
  },
  "wut": [
    /**ref:2**/,
    /**ref:4**/
  ]
}

Instead of what you'd expect:

{
  "foo": {},
  "bar": {},
  "baz": {
    "x": {},
    "y": []
  },
  "wut": [
    {},
    []
  ]
}

What do these ref lines actually refer to? Why doesn't it just show the actual data?

I realize it's not trivial to detect the difference between circular and duplicate references, but frankly, I'd rather see a "Circular reference" error than the current state. In the current state, the object's structure is excessively obfuscated. You might as well not log it, as you'd still have to manually figure out what the object contains.

See also my report on Stack Overflow's Meta.

[gh-canon]

Essentially, as the object is serialized, every object gets a reference number and a counter. The root object is id:1, for example, subsequent references would look like ref:1. Then we retroactively strip the reference markers that appeared only once. This leaves gaps. Even if it didn't, it's ugly; I know. Plus, there's a fun bug in there where the serializer didn't mark foo as id:2 (because it was empty, apparently sigh)... so, subsequent references appear to reference a phantom object.

I've revised object visualization to use lazy tree expansion. Multi/circular references no longer matter since we're not dumping the entire object at once. Have a look.

[Cerbrus]

I've taken a look, and I'm extremely impressed.

The only modification I'd make, would be to log prototype properties under a __proto__ "sub-group", if possible (like how chrome logs [1, 2]:

Most of the times, you wouldn't need to see the prototype properties.

[gh-canon]

Thanks. The __proto__ grouping is already done.

[Cerbrus]

Looks great! 👍
I think this issue can be closed now :-)