Мы давно уже живем в 2020 году, и хотелось бы понять, почему люди до сих пор активно используют JQuery, ведь эта технология уже устарела, не так ли?
В данном посте, хочу показать несколько бенчмарков, которые наглядно помогут убедиться в том, что нативный JS не на много сложнее, при этом выполняет те же операции в разы быстрее.
$.find() — данный метод позволяет найти DOM элементы, используя селектор, но не все так приятно и просто, как кажется со стороны.
.querySelector()/.querySelectorAll() — аналогом $.find(), является нативная функция .querySelector() (либо же для нескольких элементов .querySelectorAll()).
Мы видим, что при использовании встроеных функций JS, мы получаем прирост в производительности почти в 4 раза. Но не будем углубляться в корень пролбемы, суть в том, чтобы показать, почему использование данной библиотеки не целесообразно в современных реалиях.
$.hide()/$.show() — тут же, я промолчу, сравнение с реализацией на ванильном JS мне кажется не уместна, ввиду того, что это заведмомо проигрышная комбинация.
element.style.display = 'none' — просто, не правда ли? А ведь .hide и .show делаю то же самое. Однако посмотрим на сравнение скорости выполнения данного кода.
Скажем так, разница не маленькая. Ну и напоследок, еще один пример:
$.attr() — простое действие, добавить какой-то аттрибут, операция не сильно затратная по времени, но её аналог .setAttribute() все равно отрабатывает быстрее раза в 4,
Итог: возможно JQuery и хорош в проектах, где важна скорость написания (о да, скорость написания он сокращает, пусть и не сильно), или к примеру, где не важна производительность, однако зная, какие требования сейчас выставляют даже к простым landing страницам, JQuery уже может справляться не так хорошо, как хотелось бы. Решайте сами, небольшая экономия времени и большая просадка в производительности, или же наоборот.
В данном посте, хочу показать несколько бенчмарков, которые наглядно помогут убедиться в том, что нативный JS не на много сложнее, при этом выполняет те же операции в разы быстрее.
$.find() — данный метод позволяет найти DOM элементы, используя селектор, но не все так приятно и просто, как кажется со стороны.
.querySelector()/.querySelectorAll() — аналогом $.find(), является нативная функция .querySelector() (либо же для нескольких элементов .querySelectorAll()).
Мы видим, что при использовании встроеных функций JS, мы получаем прирост в производительности почти в 4 раза. Но не будем углубляться в корень пролбемы, суть в том, чтобы показать, почему использование данной библиотеки не целесообразно в современных реалиях.
$.hide()/$.show() — тут же, я промолчу, сравнение с реализацией на ванильном JS мне кажется не уместна, ввиду того, что это заведмомо проигрышная комбинация.
element.style.display = 'none' — просто, не правда ли? А ведь .hide и .show делаю то же самое. Однако посмотрим на сравнение скорости выполнения данного кода.
Скажем так, разница не маленькая. Ну и напоследок, еще один пример:
$.attr() — простое действие, добавить какой-то аттрибут, операция не сильно затратная по времени, но её аналог .setAttribute() все равно отрабатывает быстрее раза в 4,
Итог: возможно JQuery и хорош в проектах, где важна скорость написания (о да, скорость написания он сокращает, пусть и не сильно), или к примеру, где не важна производительность, однако зная, какие требования сейчас выставляют даже к простым landing страницам, JQuery уже может справляться не так хорошо, как хотелось бы. Решайте сами, небольшая экономия времени и большая просадка в производительности, или же наоборот.