rendering of templates inspired by htmx

render.js

const templateCache = {}
let render = async (data, selector, target, swap = "innerHTML") => {
    let cache = templateCache["selector"];
    if(cache){
        tmpl = cache;
    }
    else if(selector.startsWith("/")){
        try {
            const res = await fetch(selector);
            if (res.status === 200){
                tmpl = await res.text();
            }else{
                throw Error(`Invalid template url: ${selector}`)
            }
        } catch (error) {
            throw error;
        }
    }
    else{
        const templateNode = document.querySelector(selector);
        tmpl = templateNode.innerHTML;
    }
    
    if(!tmpl){
        throw Error(`template with selector ${selector} is empty!`)
    }

    templateCache[selector] = tmpl
    var rendered = Mustache.render(tmpl, data);
    if (swap === "innerHTML") {
        document.querySelector(target).innerHTML = rendered;
    } else if (swap === "outerHTML") {
        document.querySelector(target).outerHTML = rendered;
    } else if (swap === "textContent") {
        document.querySelector(target).textContent = rendered;
    } else if (swap === "beforebegin") {
        document
            .querySelector(target)
            .insertAdjacentHTML("beforebegin", rendered);
    } else if (swap === "afterbegin") {
        document.querySelector(target).insertAdjacentHTML("afterbegin", rendered);
    } else if (swap === "beforeend") {
        document.querySelector(target).insertAdjacentHTML("beforeend", rendered);
    } else if (swap === "afterend") {
        document.querySelector(target).insertAdjacentHTML("afterend", rendered);
    } else if (swap === "delete") {
        document.querySelector(target).remove();
    } else if (swap === "none") {
        //do nothing
    }
};