Создание кастомного шаблонизатора на js

Всем привет! У меня есть файл index.js который служит описанием контекста, вызывалкой того какие данные нужно рендерить. Есть файл chat.tmpl.js – описывает шаблоны. А файл templator.js принимает шаблон и рендерит его. Объясните пожалуйста как написать метод compile что бы он возвращал разметку из шаблона. Заранее спасибо!

index.js

const chatsTmpl = new window.Templator(window.chatsTemplate);
const chatsElementTmpl = new window.Templator(window.chatsElementTemplate);

const context = {
  items: [1, 2, 3, 4]
    .map(item => chatsElementTmpl.compile({ name: item }))
    .join("\n\t"),
  className: "chat",
  chat: {
    id: 123
  },
  handleClick: function() {
    console.log(document.querySelector(".chat"));
  }
};

const root = document.querySelector(".root");
root.innerHTML = chatsTmpl.compile(context);

chat.tmpl.js

window.chatsTemplate = (function() {
  return `
<ul class="{{ className }}" data-chat-id="{{chat.id}}" onClick="{{handleClick}}">
  {{ items }}
</ul>
`;
})();

window.chatsElementTemplate = (function() {
  return `<li>{{name}}</li>`;
})();

templator.js

(function() {
  class Templator {
    constructor(template) {
      this._template = template;
    }

    compile(ctx) {
     // Необходимо написать метод
    }
  }

  window.Templator = Templator;
})();