Repository: mermaid-js/mermaid
File: packages/mermaid/src/rendering-util/rendering-elements/shapes/util.ts (TypeScript)

Code before:
  if (useHtmlLabels) {
    labelEl.attr('transform', 'translate(' + -bbox.width / 2 + ', ' + -bbox.height / 2 + ')');
  } else {
    labelEl.attr('transform', 'translate(' + 0 + ', ' + -bbox.height / 2 + ')');
  }
  if (node.centerLabel) {
    labelEl.attr('transform', 'translate(' + -bbox.width / 2 + ', ' + -bbox.height / 2 + ')');
  }
  labelEl.insert('rect', ':first-child');
  return { shapeSvg, bbox, halfPadding, label: labelEl };
};
export const insertLabel = async <T extends SVGGraphicsElement>(
  parent: D3Selection<T>,
  label: string,
  options: {
    labelStyle?: string | undefined;
    icon?: boolean | undefined;
    img?: string | undefined;
    useHtmlLabels?: boolean | undefined;
    padding: number;
    width?: number | undefined;
    centerLabel?: boolean | undefined;
    addSvgBackground?: boolean | undefined;
  }
) => {
  const useHtmlLabels = getEffectiveHtmlLabels(getConfig()) || options.useHtmlLabels;

  // Create the label and insert it after the rect
  const labelEl = parent
    .insert('g')
    .attr('class', 'label')
    .attr('style', options.labelStyle || '');

  const text = await createText(labelEl, sanitizeText(decodeEntities(label), getConfig()), {
    useHtmlLabels,
    width: options.width || getConfig()?.flowchart?.wrappingWidth,
    style: options.labelStyle,
    addSvgBackground: !!options.icon || !!options.img,
  });
  // Get the size of the label
  let bbox = text.getBBox();
  const halfPadding = options.padding / 2;

  if (getEffectiveHtmlLabels(getConfig())) {
    const div = text.children[0];
    const dv = select(text);

    bbox = div.getBoundingClientRect();
    dv.attr('width', bbox.width);
    dv.attr('height', bbox.height);
  }

Review comment (performance):
**issue(perf)**: Same here, we should keep the old style where `node.useHtmlLabels` is first, so it can short-circuit and potentially improve performance.


```suggestion
  const useHtmlLabels = node.useHtmlLabels || getEffectiveHtmlLabels(getConfig());
```

Code after:
  if (useHtmlLabels) {
    labelEl.attr('transform', 'translate(' + -bbox.width / 2 + ', ' + -bbox.height / 2 + ')');
  } else {
    labelEl.attr('transform', 'translate(' + 0 + ', ' + -bbox.height / 2 + ')');
  }
  if (node.centerLabel) {
    labelEl.attr('transform', 'translate(' + -bbox.width / 2 + ', ' + -bbox.height / 2 + ')');
  }
  labelEl.insert('rect', ':first-child');
  return { shapeSvg, bbox, halfPadding, label: labelEl };
};
export const insertLabel = async <T extends SVGGraphicsElement>(
  parent: D3Selection<T>,
  label: string,
  options: {
    labelStyle?: string | undefined;
    icon?: boolean | undefined;
    img?: string | undefined;
    useHtmlLabels?: boolean | undefined;
    padding: number;
    width?: number | undefined;
    centerLabel?: boolean | undefined;
    addSvgBackground?: boolean | undefined;
  }
) => {
  const useHtmlLabels = options.useHtmlLabels ?? getEffectiveHtmlLabels(getConfig());

  // Create the label and insert it after the rect
  const labelEl = parent
    .insert('g')
    .attr('class', 'label')
    .attr('style', options.labelStyle || '');

  const text = await createText(labelEl, sanitizeText(decodeEntities(label), getConfig()), {
    useHtmlLabels,
    width: options.width || getConfig()?.flowchart?.wrappingWidth,
    style: options.labelStyle,
    addSvgBackground: !!options.icon || !!options.img,
  });
  // Get the size of the label
  let bbox = text.getBBox();
  const halfPadding = options.padding / 2;

  if (getEffectiveHtmlLabels(getConfig())) {
    const div = text.children[0];
    const dv = select(text);

    bbox = div.getBoundingClientRect();
    dv.attr('width', bbox.width);
    dv.attr('height', bbox.height);
  }