Performance & clarity concerns with context object

[curran]

One thing that doesn't quite feel right is how so many new objects are created during the render pass when using a context object:

// Computes the data to pass into the data join from component invocation arguments.
function dataArray(data, context) {
  data = Array.isArray(data) ? data : [data];
  return context ? data.map(d => Object.assign(Object.create(context), d)) : data;
}

What if instead of creating new objects and shallow merging each datum with the context object, we split up the API such that the lifecycle hooks refer to the context object explicitly, rather than having stuff from the context object implicitly end up on d?

Before:

const myComponent = d3.component("div")
  .render((selection, d) => {
    selection
        .text("d")
        .on("click", d.onClick);
  });

After:

const myComponent = d3.component("div")
  .render((selection, d, context) => {
    selection
        .text("d")
        .on("click", context.onClick);
  });

Pros:

• Clear separation of "data" and programmatic elements like callbacks (which would go on the context).
• The data array is unmodified, no surprises when inspecting the datum objects.

Cons:

• Custom logic will be required to specify a data property for all data elements.
• More burden on developers to think about what goes where.