Как эффективнее реализовать поиск на сайте

Допустим есть сайт с постами у которых есть теги. На сайте есть поиск по этим тегам, тоесть вводишь слова/буквы через пробел и тебе выводит теги по совпадениям. Эти теги можно выбрать, а двойным кликом исключить. При вводе слов в строку поиска посылается запрос в бд и приходит ответ. Главный вопрос заключается в том, как эффективно организовать работу поиска.

Есть демка, полностью показывающая, как должен вести себя поиск.

Вот мой код, который работает с запросами.

// родитель всех тегов
const tagList = document.querySelector(".tags-list");
// строка поиска
const searchInput = $(".search__input-form");
// массив всех тегов. возможно, лучше сделать его живым
let arrayitem = [];

searchInput.on("input", function () {
    let textInp = searchInput.val().trim().toLowerCase();

    $.ajax({
        type: "GET",
        url: urlTag,
        data: { operation: textInp },
        dataType: "json",
        success: function (response) {
        // response вида { "tags": [{name: "text", slug: "text"},] }

            function createTags(nameTag, slugTag) {
                let tag = document.createElement("div");
                tag.className = "tags-list__tag";
                tag.style = "display: none;";
                tag.innerHTML = `
                    <input class="tags-list__checkbox hidden-input three-pos-inp" id="id_${slugTag}" name="${slugTag}"
                    readonly tabindex="-1" type="number" value="0">
                    <span>${nameTag}</span>`;

                return tag;
            }

            
            if (arrayitem.length !== 0) {
                arrayitem.forEach(function (e) {
                    // если тег, который на странице, не выбрал, то мы его удалим с страницы
                    let valueinp = e.querySelector(".three-pos-inp").value;

                    if (valueinp === "0") {
                        e.remove();
                    } else {
                        // иначе мы убираем выделение, затем удаляем этот тег из response чтобы он не создался повторно в след. цикле
                        let txtTag = e.getElementsByTagName("span")[0].textContent;
                        e.getElementsByTagName("span")[0].innerHTML = txtTag;
                        response["tags"].splice(
                            response["tags"].findIndex((tag) => {
                                return tag.name === txtTag;
                            }),
                            1,
                        );
                    }
                });
            }

            // добавляем новые теги на страницу
            response["tags"].forEach((tag) => {
                let newTag = createTags(tag.name, tag.slug);
                tagList.append(newTag);
                show(newTag);
            });


            arrayitem = document.querySelectorAll(".tags-list__tag");
            // сортировка тегов чтобы выбранные были всегда вначале
            tagSort(arrayitem);

            // подсветка букв желтым. разделяем строку пользователя по пробелам и ищем в каждом теге совпадения
            arrayitem.forEach(function (e) {
                textInp.split(" ").forEach(function (text) {
                    if (searchForMatches(e.innerText, text)) {
                        e.getElementsByTagName("span")[0].innerHTML = inserMark(
                            e.innerText,
                            e.innerText.toLowerCase().search(text),
                            text.length,
                        );
                    }
                });
            });
        },
    });
});