jQuery — biblioteka JavaScript na świecie. Społeczność web developerów stworzyła ją pod koniec lat 2000, co doprowadziło do powstania bogatego ekosystemu stron, wtyczek i frameworków wykorzystujących jQuery.
Jednak w ostatnich latach jej status głównego narzędzia do tworzenia stron internetowych osłabł. Przyjrzyjmy się, dlaczego jQuery stała się popularna i dlaczego wyszła z mody, a także w jakich przypadkach nadal warto jej używać do tworzenia nowoczesnych witryn.
Krótka historia jQuery
John Resig () stworzył pierwszą wersję biblioteki w 2005 roku, a -m, na wydarzeniu nazwanym BarCampNYC. Na autor napisał:
jQuery — to biblioteka JavaScript, której motto brzmi: Programowanie w JavaScript powinno być przyjemne. jQuery zajmuje się częstymi, powtarzającymi się zadaniami, usuwa wszelkie niepotrzebne znaczki i czyni je krótkimi, eleganckimi i zrozumiałymi.
jQuery ma dwie główne zalety. Pierwsza — to wygodne API do manipulowania stronami internetowymi. W szczególności oferuje potężne metody do wyboru elementów. Można wybierać nie tylko po ID lub klasach, jQuery pozwala pisać skomplikowane wyrażenia, na przykład, aby wybierać elementy na podstawie ich powiązań z innymi elementami:
// Select every item within the list of people within the contacts element
$('#contacts ul.people li');Z biegiem czasu mechanizm wyboru przekształcił się w osobną bibliotekę .
Drugą zaletą biblioteki jest to, że zniekształca różnice między przeglądarkami. W tamtych czasach było trudno pisać kod, który mógłby wiarygodnie działać we wszystkich przeglądarkach.
Brak standaryzacji oznaczał, że programiści musieli brać pod uwagę liczne różnice między przeglądarkami i szczególne przypadki. Spójrz na i poszukaj w jQuery.browser. Oto jeden z przykładów:
// 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);
}A dzięki jQuery programiści mogli zdjąć z siebie troski o wszystkie te pułapki, przekazując je zespołowi rozwijającemu bibliotekę.
Później jQuery ułatwiła wdrożenie bardziej złożonych technologii, takich jak animacje i Ajax. Biblioteka stała się w rzeczywistości standardowym zależnością dla stron internetowych. I dzisiaj obsługuje ogromną część internetu. W3Techs uważa, że .
Kontrola rozwoju jQuery stała się również bardziej sformalizowana. W 2011 roku zespół . A w 2012 roku jQuery Board.
W 2015 roku fundacja jQuery połączyła się z fundacją Dojo,, która następnie zjednoczyła się z fundacją Node.js w-m w celu utworzenia, w ramach którego jQuery była jednym z „.»
Zmieniające się okoliczności
Jednak w ostatnich latach jQuery . GitHub. Bootstrap v5 , ponieważ jest to jego „” (obecnie mająca rozmiar 30 KB, zminimalizowana i spakowana). Kilka trendów w tworzeniu stron osłabiło pozycję jQuery jako niezbędnego narzędzia.
Przeglądarki
Z różnych powodów różnice i ograniczenia przeglądarek stały się mniej istotne. Po pierwsze, poprawiła się standaryzacja. Główni twórcy przeglądarek (Apple, Google, Microsoft i Mozilla) wspólnie opracowują w ramach.
Chociaż przeglądarki nadal różnią się od siebie w kilku istotnych kwestiach, dostawcy mają przynajmniej narzędzie do poszukiwania i tworzenia wspólnej bazy zamiast ze sobą. W związku z tym API przeglądarek zyskały nowe możliwości. Na przykład, może zastąpić funkcje Ajax z 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);
});Metody i powielają metody wyboru z jQuery:
// jQuery
const fooDivs = $('.foo div');
// native
const fooDivs = document.querySelectorAll('.foo div');Manipulowanie klasami elementów jest teraz możliwe za pomocą :
// jQuery
$('#warning').toggleClass('visible');
// native
document.querySelector('#warning').classList.toggle('visible');Na stronie wymieniono kilka innych sytuacji, w których kod jQuery można zastąpić natywnym kodem. Niektórzy deweloperzy wciąż trzymają się jQuery, ponieważ po prostu nie znają nowych API, ale kiedy się dowiadują, zaczynają rzadziej używać tej biblioteki.
Wykorzystanie natywnych możliwości pozwala zwiększyć wydajność stron. Wiele można teraz zrealizować za pomocą CSS.
Drugim powodem jest to, że przeglądarki są aktualizowane znacznie szybciej niż kiedyś. Większość z nich stosuje , z wyjątkiem Apple Safari. Mogą być aktualizowane w tle bez udziału użytkownika i nie są związane z aktualizacjami systemu operacyjnego.
Oznacza to, że nowe możliwości przeglądarek i poprawki błędów rozprzestrzeniają się znacznie szybciej i deweloperzy nie muszą czekać, aż udział osiągnie akceptowalny poziom. Mogą pewnie korzystać z nowych funkcji i API bez ładowania jQuery czy polifilów.
Trzecia przyczyna polega na tym, że Internet Explorer zbliża się do stanu całkowitego nieaktualności. IE od dawna jest zmorą dla web developerów na całym świecie. Typowe dla niego błędy były szeroko rozpowszechnione, a ponieważ IE dominował w latach 2000, nie wprowadzając „wiecznie zielonej” strategii aktualizacji, często spotyka się jego stare wersje.
W 2016 roku Microsoft przyspieszył wycofywanie IE z eksploatacji, dziesiątej i wcześniejszych wersji, ograniczając wsparcie do IE 11. Coraz częściej web deweloperzy mogą sobie pozwolić na luksus ignorowania kompatybilności z IE.
Nawet jQuery przestał wspierać IE 8 i niższe wersje od , która pojawiła się w 2013 roku. I chociaż w niektórych przypadkach nadal wymagana jest pomoc dla IE, przykładowo na starych stronach, sytuacje te zdarzają się coraz rzadziej.
Nowe frameworki
Od pojawienia się jQuery stworzono wiele frameworków, w tym nowoczesnych liderów , i . Mają dwa ważne atuty w porównaniu do jQuery.
Po pierwsze, umożliwiają łatwe dzielenie interfejsu użytkownika na komponenty. Frameworki zaprojektowane są tak, aby zająć się renderowaniem i aktualizacją strony. Natomiast jQuery zazwyczaj używane jest tylko do aktualizacji, pozostawiając serwerowi zadanie dostarczenia początkowej strony.
Z drugiej strony, komponenty React, Angular i Vue pozwalają silnie powiązać HTML, kod, a nawet CSS. Gdy dzielimy bazę kodu na wiele autonomicznych funkcji i klas, możliwość podziału interfejsu na wielokrotnego użytku komponenty ułatwia budowę i utrzymanie złożonych stron.
Drugim atutem jest to, że nowsze frameworki stosują paradygmat deklaratywny, w którym programista opisuje, jak powinien wyglądać interfejs, a wszystkie niezbędne zmiany dla osiągnięcia zamierzonego efektu zleca frameworkowi. To podejście kontrastuje z imperatywnym podejściem typowym dla kodu jQuery.
W jQuery wyraźnie określasz kroki do wprowadzenia jakichkolwiek zmian. A w deklaratywnym frameworku mówisz: „Na podstawie tych danych, interfejs powinien wyglądać tak”. To może znacznie ułatwić pisanie kodu bez błędów.
Programiści przyjęli nowe podejścia do tworzenia stron internetowych, przez co popularność jQuery spadła.
Kiedy używać jQuery?
A zatem kiedy należy używać jQuery?
Jeśli złożoność projektu będzie rosła, to lepiej zacząć z inną biblioteką lub frameworkiem, który umożliwia sensowne zarządzanie złożonością. Na przykład, dzielenie interfejsu na komponenty. Użycie jQuery w takich stronach na początku może wydawać się akceptowalne, ale szybko doprowadzi to do powstania spaghetti kodu, gdy nie będziesz pewny, który fragment wpływa na którą część strony.
Byłem w takiej sytuacji, gdy przy próbie wprowadzenia jakiejkolwiek zmiany pojawia się uczucie trudnego zadania. Nie można być pewnym, że niczego się nie zepsuje, ponieważ selektory jQuery zależą od struktury HTML stworzonej przez serwer.
Na końcu skali znajdują się proste strony, które wymagają jedynie odrobiny interaktywności lub treści dynamicznych. W takich przypadkach też nie używałbym jQuery domyślnie, ponieważ z natywnymi API można zrobić znacznie więcej.
Nawet jeśli będę potrzebował czegoś bardziej zaawansowanego, poszukam specjalistycznej biblioteki, na przykład, do Ajax lub do animacji. To będzie prostsze niż ładowanie całego jQuery dla niewielkiej funkcjonalności.
Myślę, że najlepszym uzasadnieniem używania jQuery jest to, że oferuje kompleksową funkcjonalność do pracy z frontendem strony. Zamiast uczyć się różnych natywnych API lub specjalistycznych bibliotek, możesz po prostu przeczytać dokumentację jQuery, a od razu staniesz się produktywny.
Podejście imperatywne źle się skaluje, ale łatwiej je opanować niż deklaratywne podejście innych bibliotek. Dla strony o wyraźnie ograniczonych możliwościach lepiej zastosować jQuery i spokojnie pracować: biblioteka nie wymaga skomplikowanego ładowania lub kompilacji.
Ponadto, jQuery sprawdza się w przypadkach, gdy jesteś pewien, że strona nie będzie z czasem się skomplikować, i jeśli nie interesuje cię natywna funkcjonalność, która na pewno wymaga napisania więcej kodu niż jQuery.
Możesz również korzystać z tej biblioteki, jeśli musisz wspierać stare wersje IE. Wtedy jQuery będzie dla ciebie przydatne, jak w czasach, gdy IE był najpopularniejszą przeglądarką.
Spojrzenie w przyszłość
jQuery nie zniknie jeszcze przez jakiś czas. Ona , a wielu programistów woli korzystać z jej API, nawet przy dostępności metod natywnych. Biblioteka pomogła całemu pokoleniu programistów tworzyć strony internetowe działające w każdej przeglądarki. I chociaż w wielu aspektach zostały zastąpione przez nowe biblioteki, frameworki i paradygmy, jQuery odegrała ogromną pozytywną rolę w tworzeniu nowoczesnego webu.
Jeśli funkcjonalność jQuery nie ulegnie znacznym zmianom, to całkiem możliwe, że w najbliższych latach korzystanie z tej biblioteki będzie powoli, ale nieuchronnie malało. Nowe strony internetowe zazwyczaj są tworzone od samego początku z użyciem nowocześniejszych frameworków, a odpowiednie przypadki użycia jQuery zdarzają się coraz rzadziej.
Niektórzy nie lubią intensywności dezaktualizacji narzędzi do tworzenia stron internetowych, ale dla mnie to dowód na szybki postęp. jQuery pozwoliła nam robić wiele rzeczy lepiej. To samo dotyczy jej następców.
Źródło: habr.com
