Так сложилость исторически.
Когда я писал первую версию движка, я думал о книге, как о статической странице без пользовательского ввода, на которой с помощью яваскрипта будут происходить только косметические изменения. Для этих изменений мне достаточно было нативных способов взаимодействия с элементами и управления событиями.
Ко второй версии меня начала раздражать многословность стандартных методов, и я решил попробовать Джейквери. Например, выберем все элементы с определённым классом, создадим новый элемент при клике на них и позже удалим обработчик клика:
Яваскриптconst elements = document.querySelectorAll('.element') // Нужно запомнить обработчик события, // иначе мы не сможем отключить его позже let clickHandler = function(element) { const shinyButton = document.createElement('button') shinyButton.classList.add('shiny') shinyButton.innerText = "Кнопка" this.appendChild(shinyButton) } for (let element of elements) { element.addEventListener('click', clickHandler) } // Позже for (let element of elements) { element.removeEventListener('click', clickHandler) }
Джейквериconst elements = $('.element') elements.on('click', function() { $(this).append($('<button class="shiny">Кнопка</button>')) }) // Позже elements.off('click')
Код на Джейквери получился лаконичней и понятней, поэтому мы стали использовать его в движке.
Но, к сожалению, для растущего проекта это оказалось ловушкой. Из‑за лёгкости взаимодействия с элементами и простых глобальных событий мы связали между собой логику книги и её внешний вид. Каждое изменение состояния книги приходится обрабатывать во множестве мест. В результате код превратился в спагетти с десятками условий и обработчиков глобальных событий.
Чтобы решить эту проблему, мы постепенно внедряем Реакт, который позволяет нам отделить логику компонент от их внешнего вида.
Тем не менее, Джейквери остаётся удобным инструментом для несложных проектов и прототипов. Несмотря на то, что нативный Яваскрипт сейчас позволяет сделать практически всё, что умеет Джейквери, зачастую это многословнее или менее очевидно.
По теме:
P. S. Это был совет о веб‑разработке. Хотите знать всё о коде, тестах, фронтенд‑разработке, цеэсэсе, яваскрипте, рельсах и джейде? Присылайте вопросы.