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
