jQuery — JavaScript библиотека в света. Обществото на уеб разработчиците я създаде в края на 2000-те години, което доведе до възникването на богата екосистема от сайтове, плъгини и фреймуърци, които използват jQuery в своите основи.
Но в последните години статусът ѝ като основен инструмент за уеб разработка е разклатен. Нека да разгледаме защо jQuery стана популярна и защо излезе от мода, както и в кои случаи все още е целесъобразно да се използва за създаване на модерни сайтове.
Кратка история на jQuery
Джон Резиг () създаде първата версия на библиотеката през 2005 г., а -та, на събитие с име BarCampNYC. На авторът написа:
jQuery е JavaScript библиотека, в основата на която лежи девизът: Програмирането на JavaScript трябва да е приятно. jQuery поема често срещаните, повтарящи се задачи, елиминира ненужния маркер и ги прави кратки, елегантни и разбираеми.
jQuery има две основни предимства. Първото — е удобният API за манипулиране на уеб страниците. По-специално, тя предоставя мощни методи за селекция на елементи. Можете да избирате не само по ID или класове, jQuery позволява да пишете сложни изрази, например, за да изберете елементи въз основа на техните взаимоотношения с други елементи:
// Select every item within the list of people within the contacts element
$('#contacts ul.people li');С времето механизмът за селекция се превърна в отделна библиотека .
Второто предимство на библиотеката беше, че тя абстрахираше различията между браузърите. През онези години беше трудно да се пише код, който да работи надеждно в всички браузъри.
Липсата на стандартизация означаваше, че разработчиците трябваше да имат предвид многобройните различия между браузърите и краен случай. Погледнете и потърсете по jQuery.browser. Ето един от примерите:
// If Mozilla is used
if ( jQuery.browser == "mozilla" || jQuery.browser == "opera" ) {
// Use the handy event callback
jQuery.event.add( document, "DOMContentLoaded", jQuery.ready );
// If IE is used, use the excellent hack by Matthias Miller
// http://www.outofhanwell.com/blog/index.php?title=the_window_onload_problem_revisited
} else if ( jQuery.browser == "msie" ) {
// Only works if you document.write() it
document.write("<scr" + "ipt id=__ie_init defer=true " +
"src=javascript:void(0)></script>");
// Use the defer script hack
var script = document.getElementById("__ie_init");
script.onreadystatechange = function() {
if ( this.readyState == "complete" )
jQuery.ready();
};
// Clear from memory
script = null;
// If Safari is used
} else if ( jQuery.browser == "safari" ) {
// Continually check to see if the document.readyState is valid
jQuery.safariTimer = setInterval(function(){
// loaded and complete are both valid states
if ( document.readyState == "loaded" ||
document.readyState == "complete" ) {
// If either one are found, remove the timer
clearInterval( jQuery.safariTimer );
jQuery.safariTimer = null;
// and execute any waiting functions
jQuery.ready();
}
}, 10);
}А благодарение на jQuery разработчиците можеха да прехвърлят грижите за всички тези подводни камъни на раменете на екипа, развиващ библиотеката.
По-късно jQuery улесни внедряването на по-сложни технологии, като анимации и Ajax. Библиотеката фактически стана стандартна зависимост за уеб сайтове. И днес тя осигурява работа на огромна част от интернет пространството. W3Techs смята, че .
Контролът върху развитието на jQuery също стана по-формализиран. През 2011 г. екипът . А през 2012 г. jQuery Board.
През 2015 г. jQuery Foundation се обедини с Dojo Foundation,, който след това се обедини с Node.js Foundation в-та за създаването на, в рамките на който jQuery беше един от ".»
Променящи се обстоятелства
Въпреки това, през последните години jQuery . GitHub. Bootstrap v5 , тъй като това е неговата "" (в момента с размер 30 Кб, минимизирана и опакована). Няколко тенденции в уеб разработката отслабиха позицията на jQuery като необходим инструмент.
Браузери
По редица причини разликите и ограниченията на браузерите станаха по-малко важни. Първо, стандартите се подобриха. Основните разработчици на браузери (Apple, Google, Microsoft и Mozilla) съвместно разработват в рамките на.
Въпреки че браузерите все още се различават помежду си по редица важни аспекти, вендорите поне имат средства за намиране и създаване на обща база вместо помежду си. Съответно, API на браузерите получиха нови възможности. Например, може да замени Ajax-функциите от jQuery:
// jQuery
$.getJSON('https://api.com/songs.json')
.done(function (songs) {
console.log(songs);
})
// native
fetch('https://api.com/songs.json')
.then(function (response) {
return response.json();
})
.then(function (songs) {
console.log(songs);
});Методите и репликират средствата за селектиране от jQuery:
// jQuery
const fooDivs = $('.foo div');
// native
const fooDivs = document.querySelectorAll('.foo div');Манипулирането на класовете на елементите сега може да се извърши чрез :
// jQuery
$('#warning').toggleClass('visible');
// native
document.querySelector('#warning').classList.toggle('visible');На сайта са изброени още няколко ситуации, в които кодът на jQuery може да бъде заменен с нативен код. Някои разработчици винаги се придържат към jQuery, тъй като просто не знаят за новите API, но когато научат, започват да използват тази библиотека по-рядко.
Използването на нативни възможности позволява повишаване на производителността на страниците. Много сега могат да се реализират с помощта на CSS.
Втората причина е, че браузерите се обновяват много по-бързо от преди. В повечето от тях се прилага , с изключение на Apple Safari. Те могат да се обновяват във фонов режим без ангажиране на потребителя и не са обвързани с обновления на ОС.
Това означава, че новите възможности на браузерите и поправките на грешки се разпространяват много по-бързо, и разработчиците не трябва да чакат, докато делът на ще достигне приемливото ниво. Те могат уверено да използват нови функции и API без нужда от зареждане на jQuery или полифили.
Третата причина е, че Internet Explorer приближава към състояние на пълна неактуалност. IE отдавна е проклятие за уеб разработката по целия свят. Срещаните в него бъгове бяха широко разпространени, а тъй като IE доминираше през 2000-те години и не прилагаше „вечнозелена“ стратегия за обновления, до сега често срещаме негови стари версии.
През 2016 г. Microsoft ускори извеждането на IE от експлоатация, десета версия и по-стари, фокусирайки се само върху поддръжката на IE 11. И все по-често уеб разработчиците могат да си позволят лукса да игнорират съвместимостта с IE.
Дори jQuery спря да поддържа IE 8 и по-стари версии, започвайки от , пусната през 2013 г. И макар в някои случаи все още е необходима поддръжка на IE, например на стари сайтове, подобни ситуации възникват все по-рядко.
Нови фреймворкове
Появата на jQuery доведе до създаването на множество фреймворкове, включително съвременните лидери , и . Те имат две важни предимства пред jQuery.
Първо, те позволяват лесно разделяне на потребителския интерфейс на компоненти. Фреймворковете са проектирани да обработват рендерирането и обновлението на страницата. А jQuery обикновено се използва само за обновления, оставяйки на сървъра задачата да предостави началната страница.
От друга страна, компонентите на React, Angular и Vue позволяват тясна връзка между HTML, код и дори CSS. Както разделяме кодовата база на много самостоятелни функции и класове, така и възможността да разделим интерфейса на повторно използваеми компоненти опростява изграждането и поддръжката на сложни сайтове.
Второто предимство е, че по-съвременните фреймворкове следват декларативната парадигма, в която разработчикът описва как трябва да изглежда интерфейсът, а всички необходими промени за постигане на желаното остават на самия фреймворк. Този подход противоречи на императивния подход, характерен за jQuery кода.
В jQuery вие ясно описвате стъпките за извършване на каквито и да било промени. А в декларативен фреймворк казвате: „Според тези данни, интерфейсът трябва да изглежда така“. Това може значително да улесни писането на код без бъгове.
Разработчиците приемат нови подходи към разработката на сайтове, поради което популярността на jQuery намалява.
Кога да използвате jQuery?
Така кога следва да използвате jQuery?
Ако сложността на проекта нараства, по-добре е да започнете с друга библиотека или рамка, която позволява смислено управление на сложността. Например, разделяне на интерфейса на компоненти. Използването на jQuery в такива сайтове в началото може да изглежда приемливо, но бързо ще доведе до възникването на спагети код, когато не сте сигурни кой фрагмент влияе на коя част от страницата.
Бил съм в такава ситуация, при опит да направя каквото и да е изменение, възниква усещането за трудност. Не може да се бъде сигурен, че нищо няма да се счупи, защото селекторите на jQuery зависят от структурата на HTML, създадена от сървъра.
От другата страна на скалата са простите сайтове, които изискват само малко интерактивност или динамично съдържание. В такива случаи също не бих използвал jQuery по подразбиране, защото с нативните API може да се направи много повече.
Дори ако ми трябва нещо по-мощно, ще потърся специализирана библиотека, например, за Ajax или за анимации. Това ще е по-лесно, отколкото да зареждате цялата jQuery за малка функционалност.
Мисля, че най-доброто обяснение за използването на jQuery ще бъде, че тя предоставя обширна функционалност за работа с фронтенда на сайта. Вместо да учите разнообразни нативни API или специализирани библиотеки, можете просто да прочетете документацията на jQuery, и веднага ще станете продуктивни.
Императивният подход не е добре мащабируем, но е по-лесен за усвояване в сравнение с декларативния подход на другите библиотеки. За сайт с явно ограничени възможности, по-добре е да се приложи jQuery и спокойно да се работи: библиотеката не изисква сложна компилация или свързване.
Освен това, jQuery е полезна в случаите, когато сте сигурни, че сайтът няма да се усложнява с времето, и ако не ви интересува нативната функционалност, която определено ще изисква повече код от jQuery.
Също така можете да използвате тази библиотека, ако трябва да поддържате стари версии на IE. Тогава jQuery ще ви служи като в онези времена, когато IE беше най-популярният браузър.
Поглед към бъдещето
jQuery няма да изчезне скоро. Тя , и много разработчици предпочитат да използват нейното API, дори когато имат достъп до нативни методи. Библиотеката помогна на цяло поколение разработчици да създават сайтове, работещи във всички браузъри. И макар в много отношения нови библиотеки, фреймворци и парадигми да я замениха, jQuery изигра огромна положителна роля в изграждането на съвременния уеб.
Ако функционалността на jQuery не се промени съществено, е напълно възможно, че в следващите години използването на библиотеката ще продължи бавно, но сигурно да намалява. Новите уебсайтове обикновено се създават от самото начало с по-модерни фреймворци, а подходящите случаи на използване на jQuery се появяват все по-рядко.
Някои не харесват ускореното остаряване на инструментите за уеб разработка, но за мен това е доказателство за бърз напредък. jQuery ни позволи да правим много неща по-добре. Същото важи и за нейните наследници.
Източник: habr.com
