🛠️ Tiny: A tiny refactor

Hey ,

I'm thrilled to help you learn JavaScript. Unfortunately, you've landed on a page where you cannot access with your current purchase.

Please upgrade (use this link) access this content.

I'm super eager to help you learn more!

🛠️ Tiny: A tiny refactor

Source

If you look at the code in Tiny, you’ll notice we run four lines of code every time we render a component — regardless whether it’s the main component or descendants.

These are the three lines of code we run:

_render(comp)
_addEventListeners(comp)
_renderChildComponents(comp)

We can put _addEventListeners and _renderChildComponents inside _render so we only have to write one line.

function _render (comp) {
  comp.element.innerHTML = comp.template()
  _addEventListeners(comp)
  _renderChildComponents(comp)
}

I’d leave you to remove the extra lines from the rest of your code :)