Run results for: plus sign vs template literals vs foreach

Test name	Executions per second
✓ template literals	95,999 Ops/sec
plus sign table	95,824 Ops/sec

plus sign table

const UaDiv = document.createElement('div');
UaDiv.id = 'Ua';
const alpha=['a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z']

const tags = ['😓 awkward', '🫥 bad expression', '🖼 bad framing', '🍞 bland', '🏟 distracting', '💨 blurry',
              '⚡️ bright', '🚊 busy', '🌈 colorful', '🕶 cool', '🌚 dark', '😬 forced smile', '🧂 grainy', '🚨 overedited',
              '🚶 poor posture', '🔭 too far away', '🔎 too close up'];

for (let index = 0; index < 17; ++index) {
  let tag = tags[index];
  const span = document.createElement('span');
  span.id = 'Q' + alpha[index];
  span.className = 'BZ';
  span.textContent = tag;
  UaDiv.appendChild(span);
}

template literals

const UaDiv = document.createElement('div');
UaDiv.id = 'Ua';
const alpha=['a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z']

const tags = ['😓 awkward', '🫥 bad expression', '🖼 bad framing', '🍞 bland', '🏟 distracting', '💨 blurry',
              '⚡️ bright', '🚊 busy', '🌈 colorful', '🕶 cool', '🌚 dark', '😬 forced smile', '🧂 grainy', '🚨 overedited',
              '🚶 poor posture', '🔭 too far away', '🔎 too close up'];

for (let index = 0; index < 17; ++index) {
  let tag = tags[index];
  const span = document.createElement('span');
  span.id = `Q${alpha[index]}`;
  span.className = 'BZ';
  span.textContent = tag;
  UaDiv.appendChild(span);
}

foreach

const UaDiv = document.createElement('div');
UaDiv.id = 'Ua';
const alpha=['a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z']

const tags = ['😓 awkward', '🫥 bad expression', '🖼 bad framing', '🍞 bland', '🏟 distracting', '💨 blurry',
              '⚡️ bright', '🚊 busy', '🌈 colorful', '🕶 cool', '🌚 dark', '😬 forced smile', '🧂 grainy', '🚨 overedited',
              '🚶 poor posture', '🔭 too far away', '🔎 too close up'];

tags.forEach((tag, index) => {
  const span = document.createElement('span');
  span.id = `Q${alpha[index]}`;
  span.className = 'BZ';
  span.textContent = tag;
  UaDiv.appendChild(span);
});