{"id":38523,"date":"2019-10-31T22:24:17","date_gmt":"2019-10-31T19:24:17","guid":{"rendered":"https:\/\/prohoster.info\/blog\/istoriya-i-nasledie-jquery\/"},"modified":"2019-10-31T22:24:17","modified_gmt":"2019-10-31T19:24:17","slug":"istoriya-i-nasledie-jquery","status":"publish","type":"post","link":"https:\/\/prohoster.info\/cs\/blog\/news\/istoriya-i-nasledie-jquery","title":{"rendered":"Historie a d\u011bdictv\u00ed jQuery","gt_translate_keys":[{"key":"rendered","format":"text"}]},"content":{"rendered":"<p><img decoding=\"async\" alt=\"Historie a d\u011bdictv\u00ed jQuery\" src=\"\/wp-content\/uploads\/2019\/10\/beb7b33761181e6b478031cf1b85e6c6.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\njQuery \u2014 <noindex><a rel=\"nofollow\" href=\"https:\/\/trends.builtwith.com\/javascript\/jQuery\">to je nejpopul\u00e1rn\u011bj\u0161\u00ed<\/a><\/noindex> JavaScriptov\u00e1 knihovna na sv\u011bt\u011b. Spole\u010denstv\u00ed webov\u00fdch v\u00fdvoj\u00e1\u0159\u016f ji vytvo\u0159ilo na konci 2000. let, co\u017e vedlo k vzniku bohat\u00e9ho ekosyst\u00e9mu web\u016f, plugin\u016f a framework\u016f, kter\u00e9 jQuery vyu\u017e\u00edvaj\u00ed v pozad\u00ed.<\/p>\n<p>Ale v posledn\u00edch letech jej\u00ed status hlavn\u00edho n\u00e1stroje pro webov\u00fd v\u00fdvoj poklesl. Poj\u010fme se pod\u00edvat, pro\u010d se jQuery stalo popul\u00e1rn\u00ed a pro\u010d vy\u0161lo z m\u00f3dy, a tak\u00e9 v jak\u00fdch situac\u00edch je st\u00e1le smyslupln\u00e9 pou\u017e\u00edvat ji pro tvorbu modern\u00edch webov\u00fdch str\u00e1nek.<br \/>\n<noindex><a rel=\"nofollow\" name=\"habracut\"><\/a><\/noindex><\/p>\n<h2>Kr\u00e1tk\u00e1 historie jQuery<\/h2>\n<p>\nJohn Resig (<noindex><a rel=\"nofollow\" href=\"https:\/\/johnresig.com\/\">John Resig<\/a><\/noindex>) vytvo\u0159il prvn\u00ed verzi knihovny v roce 2005 a <noindex><a rel=\"nofollow\" href=\"https:\/\/johnresig.com\/blog\/barcampnyc-wrap-up\/\">publikoval ji v roce 2006<\/a><\/noindex>-m na akci zvan\u00e9 BarCampNYC. Na <noindex><a rel=\"nofollow\" href=\"https:\/\/web.archive.org\/web\/20060203025710\/http:\/\/jquery.com\/\">ofici\u00e1ln\u00edch str\u00e1nk\u00e1ch jQuery<\/a><\/noindex> autor napsal:<\/p>\n<blockquote><p>jQuery je JavaScriptov\u00e1 knihovna, kter\u00e1 vych\u00e1z\u00ed z motto: Programov\u00e1n\u00ed v JavaScriptu by m\u011blo b\u00fdt p\u0159\u00edjemn\u00e9. jQuery se zam\u011b\u0159uje na \u010dast\u00e9, opakuj\u00edc\u00ed se \u00fakoly, odstra\u0148uje ve\u0161ker\u00e9 zbyte\u010dn\u00e9 zna\u010dkov\u00e1n\u00ed a \u010din\u00ed je kr\u00e1tk\u00fdmi, elegantn\u00edmi a srozumiteln\u00fdmi.<\/p><\/blockquote>\n<p>\njQuery m\u00e1 dv\u011b hlavn\u00ed v\u00fdhody. Prvn\u00ed je pohodln\u00e9 API pro manipulaci s webov\u00fdmi str\u00e1nkami. Zejm\u00e9na poskytuje siln\u00e9 metody pro v\u00fdb\u011br prvk\u016f. M\u016f\u017eete vyb\u00edrat nejen podle ID nebo t\u0159\u00edd; jQuery umo\u017e\u0148uje ps\u00e1t slo\u017eit\u00e9 v\u00fdrazy, nap\u0159\u00edklad pro vyb\u00edr\u00e1n\u00ed prvk\u016f na z\u00e1klad\u011b jejich vztah\u016f k jin\u00fdm prvk\u016fm:<\/p>\n<pre><code class=\"javascript\">\/\/ Select every item within the list of people within the contacts element\n$('#contacts ul.people li');<\/code><\/pre>\n<p>\nPostupem \u010dasu se mechanismus v\u00fdb\u011bru p\u0159em\u011bnil na samostatnou knihovnu <noindex><a rel=\"nofollow\" href=\"https:\/\/sizzlejs.com\/\">Sizzle<\/a><\/noindex>.<\/p>\n<p>Druhou v\u00fdhodou knihovny bylo to, \u017ee abstrahovala rozd\u00edly mezi prohl\u00ed\u017ee\u010di. V t\u011bch letech bylo obt\u00ed\u017en\u00e9 ps\u00e1t k\u00f3d, kter\u00fd by spolehliv\u011b fungoval ve v\u0161ech prohl\u00ed\u017ee\u010d\u00edch. <\/p>\n<p>Nedostatek standardizace znamenal, \u017ee v\u00fdvoj\u00e1\u0159i museli br\u00e1t v \u00favahu \u010detn\u00e9 rozd\u00edly mezi prohl\u00ed\u017ee\u010di a okrajov\u00e9 p\u0159\u00edpady. Pod\u00edvejte se na <noindex><a rel=\"nofollow\" href=\"https:\/\/github.com\/daniellmb\/jquery-archive\/blob\/master\/jquery.2006-07-01.js\">tenhle ran\u00fd zdrojov\u00fd k\u00f3d jQuery<\/a><\/noindex> a hledejte jQuery.browser. Tady je jeden z p\u0159\u00edklad\u016f:<\/p>\n<pre><code class=\"javascript\">\/\/ If Mozilla is used\nif ( jQuery.browser == \"mozilla\" || jQuery.browser == \"opera\" ) {\n        \/\/ Use the handy event callback\n        jQuery.event.add( document, \"DOMContentLoaded\", jQuery.ready );\n\n\/\/ If IE is used, use the excellent hack by Matthias Miller\n\/\/ http:\/\/www.outofhanwell.com\/blog\/index.php?title=the_window_onload_problem_revisited\n} else if ( jQuery.browser == \"msie\" ) {\n\n        \/\/ Only works if you document.write() it\n        document.write(\"&lt;scr\" + \"ipt id=__ie_init defer=true \" + \n                \"src=javascript:void(0)&gt;&lt;\/script&gt;\");\n\n        \/\/ Use the defer script hack\n        var script = document.getElementById(\"__ie_init\");\n        script.onreadystatechange = function() {\n                if ( this.readyState == \"complete\" )\n                        jQuery.ready();\n        };\n\n        \/\/ Clear from memory\n        script = null;\n\n\/\/ If Safari  is used\n} else if ( jQuery.browser == \"safari\" ) {\n        \/\/ Continually check to see if the document.readyState is valid\n        jQuery.safariTimer = setInterval(function(){\n                \/\/ loaded and complete are both valid states\n                if ( document.readyState == \"loaded\" || \n                        document.readyState == \"complete\" ) {\n\n                        \/\/ If either one are found, remove the timer\n                        clearInterval( jQuery.safariTimer );\n                        jQuery.safariTimer = null;\n\n                        \/\/ and execute any waiting functions\n                        jQuery.ready();\n                }\n        }, 10);\n}<\/code><\/pre>\n<p>\nA d\u00edky jQuery mohli v\u00fdvoj\u00e1\u0159i p\u0159esunout starosti o v\u0161echny tyto \u00faskal\u00ed na bedra t\u00fdmu vyv\u00edjej\u00edc\u00edho knihovnu.<\/p>\n<p>Pozd\u011bji jQuery usnadnila implementaci slo\u017eit\u011bj\u0161\u00edch technologi\u00ed, jako jsou animace a Ajax. Knihovna se de facto stala standardn\u00ed z\u00e1vislost\u00ed pro webov\u00e9 str\u00e1nky. A dnes zaji\u0161\u0165uje fungov\u00e1n\u00ed obrovsk\u00e9 \u010d\u00e1sti internetu. W3Techs uv\u00e1d\u00ed, \u017ee <noindex><a rel=\"nofollow\" href=\"https:\/\/w3techs.com\/technologies\/details\/js-jquery\/all\/all\">74 % webov\u00fdch str\u00e1nek dnes pou\u017e\u00edv\u00e1 jQuery<\/a><\/noindex>.<\/p>\n<p>Kontrola nad v\u00fdvojem jQuery se tak\u00e9 stala form\u00e1ln\u011bj\u0161\u00ed. V roce 2011 t\u00fdm <noindex><a rel=\"nofollow\" href=\"https:\/\/blog.jquery.com\/2011\/11\/18\/getting-board-of-jquery\/\">vytvo\u0159il jQuery Board<\/a><\/noindex>. A v roce 2012 jQuery Board<noindex><a rel=\"nofollow\" href=\"https:\/\/blog.jquery.com\/2012\/03\/06\/announcing-the-jquery-foundation\/\"> prom\u011bnila se v jQuery Foundation<\/a><\/noindex>.<\/p>\n<p>V roce 2015 se jQuery Foundation slou\u010dila s Dojo Foundation,<noindex><a rel=\"nofollow\" href=\"https:\/\/blog.jquery.com\/2015\/09\/01\/jquery-foundation-and-dojo-foundation-to-merge\/\"> aby vytvo\u0159ila JS Foundation<\/a><\/noindex>, kter\u00e1 se pot\u00e9 spojila s Node.js Foundation v<noindex><a rel=\"nofollow\" href=\"https:\/\/medium.com\/@nodejs\/introducing-the-openjs-foundation-the-next-phase-of-javascript-ecosystem-growth-d4911b42664f\"> 2019<\/a><\/noindex>-m za \u00fa\u010delem vytvo\u0159en\u00ed<noindex><a rel=\"nofollow\" href=\"https:\/\/openjsf.org\/\"> OpenJS Foundation<\/a><\/noindex>, v r\u00e1mci kter\u00e9ho byla jQuery jednou z &#171;<noindex><a rel=\"nofollow\" href=\"https:\/\/openjsf.org\/projects\/#impact\">pr\u016fkopnick\u00fdch projekt\u016f<\/a><\/noindex>.&#187;<\/p>\n<h2>M\u011bn\u00edc\u00ed se okolnosti<\/h2>\n<p>\nAv\u0161ak v posledn\u00edch letech jQuery <noindex><a rel=\"nofollow\" href=\"https:\/\/trends.google.com\/trends\/explore\/TIMESERIES\/1564319400?hl=en-US&amp;tz=240&amp;date=all&amp;geo=US&amp;q=jquery&amp;sni=3\">ztratila na popularit\u011b<\/a><\/noindex>. GitHub<noindex><a rel=\"nofollow\" href=\"https:\/\/github.blog\/2018-09-06-removing-jquery-from-github-frontend\/\"> odebral knihovnu z frontendu sv\u00e9ho webu<\/a><\/noindex>. Bootstrap v5 <noindex><a rel=\"nofollow\" href=\"https:\/\/github.com\/twbs\/bootstrap\/pull\/23586\">se zbav\u00ed jQuery<\/a><\/noindex>, proto\u017ee to je jeho \"<noindex><a rel=\"nofollow\" href=\"https:\/\/blog.getbootstrap.com\/2019\/02\/11\/bootstrap-4-3-0\/\">nejv\u011bt\u0161\u00ed z\u00e1vislost klienta pro oby\u010dejn\u00fd JavaScript<\/a><\/noindex>\" (v sou\u010dasnosti velikost\u00ed 30 kB, minifikov\u00e1no a zabalen\u00e9). N\u011bkolik trend\u016f ve webov\u00e9m v\u00fdvoji oslabilo postaven\u00ed jQuery jako nezbytn\u00e9ho n\u00e1stroje.<\/p>\n<h3>Prohl\u00ed\u017ee\u010de<\/h3>\n<p>\nZ n\u011bkolika d\u016fvod\u016f se rozd\u00edly a omezen\u00ed prohl\u00ed\u017ee\u010d\u016f staly m\u00e9n\u011b d\u016fle\u017eit\u00fdmi. Za prv\u00e9, standardizace se zlep\u0161ila. Hlavn\u00ed v\u00fdvoj\u00e1\u0159i prohl\u00ed\u017ee\u010d\u016f (Apple, Google, Microsoft a Mozilla) spole\u010dn\u011b vyv\u00edjej\u00ed<noindex><a rel=\"nofollow\" href=\"https:\/\/spec.whatwg.org\/\"> webov\u00e9 standardy<\/a><\/noindex> v r\u00e1mci<noindex><a rel=\"nofollow\" href=\"https:\/\/whatwg.org\/\"> Web Hypertext Application Technology Working Group<\/a><\/noindex>.<br \/>\nI kdy\u017e se prohl\u00ed\u017ee\u010de st\u00e1le li\u0161\u00ed v n\u011bkolika d\u016fle\u017eit\u00fdch aspektech, maj\u00ed dodavatel\u00e9 alespo\u0148 prost\u0159edky na nalezen\u00ed a vytvo\u0159en\u00ed spole\u010dn\u00e9ho z\u00e1kladu m\u00edsto <noindex><a rel=\"nofollow\" href=\"https:\/\/thehistoryoftheweb.com\/browser-wars\/\">trval\u00e9 v\u00e1lky<\/a><\/noindex> mezi sebou. V d\u016fsledku toho z\u00edskala API prohl\u00ed\u017ee\u010d\u016f nov\u00e9 mo\u017enosti. Nap\u0159\u00edklad, <noindex><a rel=\"nofollow\" href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Fetch_API\">Fetch API<\/a><\/noindex> m\u016f\u017ee nahradit funkce Ajax z jQuery:<\/p>\n<pre><code class=\"javascript\">\/\/ jQuery\n$.getJSON('https:\/\/api.com\/songs.json')\n    .done(function (songs) {\n        console.log(songs);\n    })\n\n\/\/ native\nfetch('https:\/\/api.com\/songs.json')\n    .then(function (response) {\n        return response.json();\n    })\n    .then(function (songs) {\n        console.log(songs);\n    });<\/code><\/pre>\n<p>\nMetody <noindex><a rel=\"nofollow\" href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Document\/querySelector\">querySelector<\/a><\/noindex> a<noindex><a rel=\"nofollow\" href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Document\/querySelectorAll\"> querySelectorAll<\/a><\/noindex> duplikuj\u00ed prost\u0159edky v\u00fdb\u011bru z jQuery:<\/p>\n<pre><code class=\"javascript\">\/\/ jQuery\nconst fooDivs = $('.foo div');\n\n\/\/ native\nconst fooDivs = document.querySelectorAll('.foo div');<\/code><\/pre>\n<p>\nManipulace s t\u0159\u00eddami prvk\u016f nyn\u00ed m\u016f\u017ee prob\u00edhat pomoc\u00ed <noindex><a rel=\"nofollow\" href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Element\/classList\">classList<\/a><\/noindex>:<\/p>\n<pre><code class=\"javascript\">\/\/ jQuery\n$('#warning').toggleClass('visible');\n\n\/\/ native\ndocument.querySelector('#warning').classList.toggle('visible');<\/code><\/pre>\n<p>\nNa webu<noindex><a rel=\"nofollow\" href=\"http:\/\/youmightnotneedjquery.com\/\"> Mo\u017en\u00e1 nepot\u0159ebujete jQuery<\/a><\/noindex> bylo uvedeno n\u011bkolik dal\u0161\u00edch situac\u00ed, ve kter\u00fdch m\u016f\u017ee b\u00fdt k\u00f3d jQuery nahrazen nativn\u00edm k\u00f3dem. N\u011bkte\u0159\u00ed v\u00fdvoj\u00e1\u0159i se v\u017edy dr\u017e\u00ed jQuery, proto\u017ee jednodu\u0161e nev\u011bd\u00ed o nov\u00fdch API, ale kdy\u017e se dozv\u011bd\u00ed, za\u010dnou tuto knihovnu pou\u017e\u00edvat m\u00e9n\u011b.<\/p>\n<p>Pou\u017eit\u00ed nativn\u00edch funkc\u00ed zvy\u0161uje v\u00fdkon str\u00e1nek. Mnoho <noindex><a rel=\"nofollow\" href=\"https:\/\/api.jquery.com\/category\/effects\/\">efekt\u016f animace z jQuery<\/a><\/noindex> lze nyn\u00ed realizovat<noindex><a rel=\"nofollow\" href=\"https:\/\/dev.opera.com\/articles\/css3-vs-jquery-animations\/\"> mnohem efektivn\u011bji<\/a><\/noindex> pomoc\u00ed CSS.<\/p>\n<p>Druh\u00fd d\u016fvod spo\u010d\u00edv\u00e1 v tom, \u017ee se prohl\u00ed\u017ee\u010de aktualizuj\u00ed rychleji ne\u017e d\u0159\u00edve. V\u011bt\u0161ina z nich pou\u017e\u00edv\u00e1 <noindex><a rel=\"nofollow\" href=\"https:\/\/www.techopedia.com\/definition\/31094\/evergreen-browser\">\"v\u011b\u010dn\u011b zelenou\" strategii aktualizace<\/a><\/noindex>, s v\u00fdjimkou Apple Safari. Mohou se aktualizovat na pozad\u00ed bez \u00fa\u010dasti u\u017eivatele a nejsou v\u00e1z\u00e1ny na aktualizace OS.<\/p>\n<p>To znamen\u00e1, \u017ee nov\u00e9 mo\u017enosti prohl\u00ed\u017ee\u010d\u016f a opravy chyb se \u0161\u00ed\u0159\u00ed mnohem rychleji a v\u00fdvoj\u00e1\u0159i nemus\u00ed \u010dekat, a\u017e se pod\u00edl <noindex><a rel=\"nofollow\" href=\"https:\/\/caniuse.com\/\">Can I Use<\/a><\/noindex> dos\u00e1hne p\u0159ijateln\u00fdch \u00farovn\u00ed. Mohou sebejist\u011b vyu\u017e\u00edvat nov\u00e9 funkce a API bez na\u010d\u00edt\u00e1n\u00ed jQuery nebo polyfill\u016f.<\/p>\n<p>T\u0159et\u00ed d\u016fvod spo\u010d\u00edv\u00e1 v tom, \u017ee Internet Explorer se bl\u00ed\u017e\u00ed k \u00fapln\u00e9 zastaralosti. IE u\u017e dlouho p\u0159edstavuje probl\u00e9m pro webov\u00fd v\u00fdvoj po cel\u00e9m sv\u011bt\u011b. Charakteristick\u00e9 chyby byly \u0161iroce roz\u0161\u00ed\u0159en\u00e9, a proto\u017ee IE dominoval v 2000. letech a nepou\u017e\u00edval \u00abv\u011b\u010dn\u011b zelenou\u00bb strategii aktualizace, dodnes se \u010dasto setk\u00e1v\u00e1me s jeho star\u00fdmi verzemi.<\/p>\n<p>V roce 2016 Microsoft urychlil odstran\u011bn\u00ed IE z provozu, <noindex><a rel=\"nofollow\" href=\"https:\/\/www.microsoft.com\/en-us\/microsoft-365\/windows\/end-of-ie-support\">p\u0159estal podporovat<\/a><\/noindex> des\u00e1tou a star\u0161\u00ed verze, omezil se na podporu IE 11. A \u010d\u00edm d\u00e1l \u010dast\u011bji si webov\u00ed v\u00fdvoj\u00e1\u0159i mohou dovolit luxus ignorovat kompatibilitu s IE.<\/p>\n<p>Dokonce i jQuery p\u0159estal podporovat IE 8 a ni\u017e\u0161\u00ed od <noindex><a rel=\"nofollow\" href=\"https:\/\/blog.jquery.com\/2013\/04\/18\/jquery-2-0-released\/\">verze 2.0<\/a><\/noindex>, kter\u00e1 vy\u0161la v roce 2013. A\u010dkoli v n\u011bkter\u00fdch p\u0159\u00edpadech je st\u00e1le t\u0159eba podporovat IE, nap\u0159\u00edklad na star\u00fdch str\u00e1nk\u00e1ch, tyto situace nast\u00e1vaj\u00ed \u010d\u00edm d\u00e1l m\u00e9n\u011b.<\/p>\n<h3>Nov\u00e9 frameworky<\/h3>\n<p>\nOd doby, kdy byl jQuery uveden, bylo vytvo\u0159eno mnoho framework\u016f, v\u010detn\u011b modern\u00edch l\u00eddr\u016f <noindex><a rel=\"nofollow\" href=\"https:\/\/reactjs.org\/\">React<\/a><\/noindex>,<noindex><a rel=\"nofollow\" href=\"https:\/\/angular.io\/\"> Angular<\/a><\/noindex> a <noindex><a rel=\"nofollow\" href=\"https:\/\/vuejs.org\/\">Vue<\/a><\/noindex>. Maj\u00ed dv\u011b d\u016fle\u017eit\u00e1 v\u00fdhody oproti jQuery.<\/p>\n<p>Za prv\u00e9, umo\u017e\u0148uj\u00ed snadno rozd\u011blit u\u017eivatelsk\u00e9 rozhran\u00ed na komponenty. Frameworky jsou navr\u017eeny tak, aby zpracov\u00e1valy vykreslov\u00e1n\u00ed a aktualizaci str\u00e1nky. A jQuery se obvykle pou\u017e\u00edv\u00e1 pouze k aktualizaci, zat\u00edmco server zaji\u0161\u0165uje dod\u00e1n\u00ed po\u010d\u00e1te\u010dn\u00ed str\u00e1nky.<\/p>\n<p>Na druhou stranu, komponenty React, Angular a Vue umo\u017e\u0148uj\u00ed \u00fazk\u00e9 propojen\u00ed HTML, k\u00f3du a dokonce i CSS. Stejn\u011b jako d\u011bl\u00edme k\u00f3dovou z\u00e1kladnu na mnoho sob\u011bsta\u010dn\u00fdch funkc\u00ed a t\u0159\u00edd, mo\u017enost rozd\u011blit rozhran\u00ed na znovu pou\u017eiteln\u00e9 komponenty usnad\u0148uje sestavov\u00e1n\u00ed a \u00fadr\u017ebu slo\u017eit\u00fdch web\u016f.<\/p>\n<p>Druhou v\u00fdhodou je, \u017ee nov\u011bj\u0161\u00ed frameworky dodr\u017euj\u00ed deklarativn\u00ed paradigmu, v r\u00e1mci kter\u00e9 v\u00fdvoj\u00e1\u0159 popisuje, jak by m\u011blo rozhran\u00ed vypadat, a proveden\u00ed v\u0161ech nezbytn\u00fdch zm\u011bn pro dosa\u017een\u00ed po\u017eadovan\u00e9ho p\u0159en\u00e1\u0161\u00ed na framework. Tento p\u0159\u00edstup je v rozporu s imperativn\u00edm p\u0159\u00edstupem charakteristick\u00fdm pro k\u00f3d jQuery.<\/p>\n<p>V jQuery v\u00fdslovn\u011b uv\u00e1d\u00edte kroky k proveden\u00ed jak\u00fdchkoli zm\u011bn. A v deklarativn\u00edm frameworku \u0159\u00edk\u00e1te: \u00abDle t\u011bchto dat by m\u011blo rozhran\u00ed vypadat takto\u00bb. To m\u016f\u017ee v\u00fdrazn\u011b usnadnit psan\u00ed k\u00f3du bez chyb.<\/p>\n<p>V\u00fdvoj\u00e1\u0159i p\u0159ijali nov\u00e9 p\u0159\u00edstupy k v\u00fdvoji webov\u00fdch str\u00e1nek, co\u017e vedlo ke sn\u00ed\u017een\u00ed obl\u00edbenosti jQuery.<\/p>\n<h2>Kdy pou\u017e\u00edt jQuery?<\/h2>\n<p>\nTak kdy tedy <i>by m\u011blo <\/i>b\u00fdt pou\u017eito jQuery?<\/p>\n<p>Pokud se slo\u017eitost projektu bude zvy\u0161ovat, je lep\u0161\u00ed za\u010d\u00edt s jinou knihovnou nebo frameworkem, kter\u00fd umo\u017e\u0148uje smyslupln\u011b \u0159\u00eddit slo\u017eitost. Nap\u0159\u00edklad odd\u011blit u\u017eivatelsk\u00e9 rozhran\u00ed na komponenty. Pou\u017eit\u00ed jQuery na takov\u00fdch str\u00e1nk\u00e1ch v po\u010d\u00e1te\u010dn\u00edch f\u00e1z\u00edch m\u016f\u017ee vypadat p\u0159ijateln\u00e9, ale rychle to povede k vzniku \u0161pagetov\u00e9ho k\u00f3du, kdy si nebudete jisti, kter\u00fd fragment ovliv\u0148uje kterou \u010d\u00e1st str\u00e1nky.<\/p>\n<p>Byl jsem v takov\u00e9 situaci, kdy p\u0159i pokusu prov\u00e9st jakoukoli zm\u011bnu vznikal pocit t\u011b\u017ek\u00e9ho \u00fakolu. Nen\u00ed mo\u017en\u00e9 si b\u00fdt jist\u00fd, \u017ee nic nezhod\u00edte, proto\u017ee selektory jQuery z\u00e1vis\u00ed na HTML struktu\u0159e vytv\u00e1\u0159en\u00e9 serverem.<\/p>\n<p>Na druh\u00e9m konci spektra jsou jednoduch\u00e9 weby, kter\u00e9 vy\u017eaduj\u00ed pouze trochu interaktivity nebo dynamick\u00e9ho obsahu. V takov\u00fdch p\u0159\u00edpadech bych tak\u00e9 nezapnul jQuery jako v\u00fdchoz\u00ed volbu, proto\u017ee pomoc\u00ed nativn\u00edch API lze ud\u011blat mnohem v\u00edce.<\/p>\n<p>I kdy\u017e budu pot\u0159ebovat n\u011bco mocn\u011bj\u0161\u00edho, budu hledat specializovanou knihovnu, nap\u0159\u00edklad <noindex><a rel=\"nofollow\" href=\"https:\/\/github.com\/axios\/axios\">axios<\/a><\/noindex> pro Ajax nebo<noindex><a rel=\"nofollow\" href=\"https:\/\/daneden.github.io\/animate.css\/\"> Animate.css<\/a><\/noindex> pro animace. Bude to jednodu\u0161\u0161\u00ed, ne\u017e na\u010d\u00edtat cel\u00e9 jQuery kv\u016fli mal\u00e9 funk\u010dnosti.<\/p>\n<p>Mysl\u00edm, \u017ee nejlep\u0161\u00ed od\u016fvodn\u011bn\u00ed pro pou\u017eit\u00ed jQuery je to, \u017ee poskytuje komplexn\u00ed funkcionalitu pro pr\u00e1ci s frontendem webu. M\u00edsto toho, abyste studovali r\u016fzn\u00e1 nativn\u00ed API nebo specializovan\u00e9 knihovny, m\u016f\u017eete si p\u0159e\u010d\u00edst pouze dokumentaci jQuery a okam\u017eit\u011b se st\u00e1t produktivn\u00edmi.<\/p>\n<p>Imperativn\u00ed p\u0159\u00edstup se \u0161patn\u011b \u0161k\u00e1luje, ale je jednodu\u0161\u0161\u00ed se ho nau\u010dit ne\u017e deklarativn\u00ed p\u0159\u00edstupy jin\u00fdch knihoven. Pro web s jasn\u011b omezen\u00fdmi mo\u017enostmi je lep\u0161\u00ed pou\u017e\u00edt jQuery a bez obav pracovat: knihovna nevy\u017eaduje slo\u017eit\u00e9 sestaven\u00ed nebo kompilaci.<\/p>\n<p>Krom\u011b toho je jQuery dobr\u00e9 pro p\u0159\u00edpady, kdy si jste jisti, \u017ee web se v pr\u016fb\u011bhu \u010dasu nezkomplikuje, a pokud v\u00e1s netr\u00e1p\u00ed nativn\u00ed funk\u010dnost, kter\u00e1 bezpochyby vy\u017eaduje v\u00edce k\u00f3du ne\u017e jQuery.<\/p>\n<p>Tuto knihovnu m\u016f\u017eete tak\u00e9 pou\u017e\u00edvat, pokud pot\u0159ebujete podporu star\u0161\u00edch verz\u00ed IE. V takov\u00e9m p\u0159\u00edpad\u011b v\u00e1m jQuery poslou\u017e\u00ed jako v dob\u011b, kdy byl IE nejpopul\u00e1rn\u011bj\u0161\u00edm prohl\u00ed\u017ee\u010dem.<\/p>\n<h2>Pohled do budoucnosti<\/h2>\n<p>\njQuery je\u0161t\u011b dlouho nezmiz\u00ed. Ona <noindex><a rel=\"nofollow\" href=\"https:\/\/github.com\/jquery\/jquery\">se aktivn\u011b vyv\u00edj\u00ed<\/a><\/noindex>, a mnoz\u00ed v\u00fdvoj\u00e1\u0159i d\u00e1vaj\u00ed p\u0159ednost pou\u017e\u00edv\u00e1n\u00ed jej\u00edho API, i kdy\u017e jsou k dispozici nativn\u00ed metody. Knihovna pomohla cel\u00e9mu generaci v\u00fdvoj\u00e1\u0159\u016f vytv\u00e1\u0159et webov\u00e9 str\u00e1nky, kter\u00e9 funguj\u00ed na jak\u00fdchkoli prohl\u00ed\u017ee\u010d\u00edch. A i kdy\u017e ji v mnoha ohledech nahradily nov\u00e9 knihovny, r\u00e1mce a paradigmy, jQuery sehr\u00e1la obrovskou pozitivn\u00ed roli p\u0159i utv\u00e1\u0159en\u00ed modern\u00edho webu.<\/p>\n<p>Pokud se funk\u010dnost jQuery podstatn\u011b nezm\u011bn\u00ed, je velmi pravd\u011bpodobn\u00e9, \u017ee v n\u00e1sleduj\u00edc\u00edch n\u011bkolika letech bude pou\u017e\u00edv\u00e1n\u00ed knihovny i nad\u00e1le pomalu, ale jist\u011b klesat. Nov\u00e9 webov\u00e9 str\u00e1nky se obvykle od za\u010d\u00e1tku vytv\u00e1\u0159ej\u00ed pomoc\u00ed modern\u011bj\u0161\u00edch r\u00e1mc\u016f a vhodn\u00e9 sc\u00e9n\u00e1\u0159e pro pou\u017eit\u00ed jQuery se objevuj\u00ed \u010d\u00edm d\u00e1l m\u00e9n\u011b.<\/p>\n<p>N\u011bkomu se nel\u00edb\u00ed intenzita zastar\u00e1v\u00e1n\u00ed n\u00e1stroj\u016f pro webov\u00fd v\u00fdvoj, ale pro m\u011b je to d\u016fkaz rychl\u00e9ho pokroku. jQuery n\u00e1m umo\u017enila dos\u00e1hnout mnoha v\u011bc\u00ed l\u00e9pe. To plat\u00ed i pro jej\u00ed n\u00e1stupce.<br \/>\n<br \/>Zdroj: <a content=\"nofollow\" rel=\"nofollow\" href=\"https:\/\/habr.com\/ru\/company\/mailru\/blog\/468169\/\">habr.com<\/a><\/p>","protected":false,"gt_translate_keys":[{"key":"rendered","format":"html"}]},"excerpt":{"rendered":"<p>jQuery \u2014 \u044d\u0442\u043e \u0441\u0430\u043c\u0430\u044f \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u0430\u044f \u0432 \u043c\u0438\u0440\u0435 JavaScript-\u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430. \u0421\u043e\u043e\u0431\u0449\u0435\u0441\u0442\u0432\u043e \u0432\u0435\u0431-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u0432 \u0441\u043e\u0437\u0434\u0430\u043b\u043e \u0435\u0451 \u0432 \u043a\u043e\u043d\u0446\u0435 2000-\u0445, \u0447\u0442\u043e \u043f\u0440\u0438\u0432\u0435\u043b\u043e \u043a \u0432\u043e\u0437\u043d\u0438\u043a\u043d\u043e\u0432\u0435\u043d\u0438\u044e \u0431\u043e\u0433\u0430\u0442\u043e\u0439 \u044d\u043a\u043e\u0441\u0438\u0441\u0442\u0435\u043c\u044b \u0441\u0430\u0439\u0442\u043e\u0432, \u043f\u043b\u0430\u0433\u0438\u043d\u043e\u0432 \u0438 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u043e\u0432, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0449\u0438\u0445 \u043f\u043e\u0434 \u043a\u0430\u043f\u043e\u0442\u043e\u043c jQuery. \u041d\u043e \u0432 \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0438\u0435 \u0433\u043e\u0434\u044b \u0435\u0451 \u0441\u0442\u0430\u0442\u0443\u0441 \u0433\u043b\u0430\u0432\u043d\u043e\u0433\u043e \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u0430 \u0434\u043b\u044f \u0432\u0435\u0431-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u043f\u043e\u0448\u0430\u0442\u043d\u0443\u043b\u0441\u044f. \u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u043c, \u043f\u043e\u0447\u0435\u043c\u0443 jQuery \u0441\u0442\u0430\u043b\u0430 \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u043e\u0439 \u0438 \u043f\u043e\u0447\u0435\u043c\u0443 \u043e\u043d\u0430 \u0432\u044b\u0448\u043b\u0430 \u0438\u0437 \u043c\u043e\u0434\u044b, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0432 [&hellip;]<\/p>\n","protected":false,"gt_translate_keys":[{"key":"rendered","format":"html"}]},"author":1,"featured_media":28907,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[702],"tags":[],"class_list":["post-38523","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-news"],"aioseo_notices":[],"aioseo_head":"\n\t\t<!-- All in One SEO 5.0.3 - aioseo.com -->\n\t<meta name=\"description\" content=\"jQuery \u2014\" \/>\n\t<meta name=\"robots\" content=\"max-image-preview:large\" \/>\n\t<meta name=\"author\" content=\"Yuri Gagarin\"\/>\n\t<link rel=\"canonical\" href=\"https:\/\/prohoster.info\/cs\/blog\/news\/istoriya-i-nasledie-jquery\" \/>\n\t\t<meta name=\"generator\" content=\"All in One SEO (AIOSEO) 5.0.3\" \/>\n\t\t<meta property=\"og:locale\" content=\"cs_CZ\" \/>\n\t\t<meta property=\"og:site_name\" content=\"ProHoster | \u041a\u0443\u043f\u0438\u0442\u044c \u043d\u0430\u0434\u0435\u0436\u043d\u044b\u0439 \u0445\u043e\u0441\u0442\u0438\u043d\u0433 \u0434\u043b\u044f \u0441\u0430\u0439\u0442\u043e\u0432 \u0441 \u0437\u0430\u0449\u0438\u0442\u043e\u0439 \u043e\u0442 DDoS, VPS VDS \u0441\u0435\u0440\u0432\u0435\u0440\u044b\" \/>\n\t\t<meta property=\"og:type\" content=\"article\" \/>\n\t\t<meta property=\"og:title\" content=\"\ud83e\udd47\u0418\u0441\u0442\u043e\u0440\u0438\u044f \u0438 \u043d\u0430\u0441\u043b\u0435\u0434\u0438\u0435 jQuery | ProHoster\" \/>\n\t\t<meta property=\"og:description\" content=\"jQuery \u2014\" \/>\n\t\t<meta property=\"og:url\" content=\"https:\/\/prohoster.info\/cs\/blog\/news\/istoriya-i-nasledie-jquery\" \/>\n\t\t<meta property=\"og:image\" content=\"https:\/\/prohoster.info\/wp-content\/uploads\/2021\/11\/logo-350.jpg\" \/>\n\t\t<meta property=\"og:image:secure_url\" content=\"https:\/\/prohoster.info\/wp-content\/uploads\/2021\/11\/logo-350.jpg\" \/>\n\t\t<meta property=\"og:image:width\" content=\"350\" \/>\n\t\t<meta property=\"og:image:height\" content=\"350\" \/>\n\t\t<meta property=\"article:published_time\" content=\"2019-10-31T19:24:17+00:00\" \/>\n\t\t<meta property=\"article:modified_time\" content=\"2019-10-31T19:24:17+00:00\" \/>\n\t\t<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/prohoster\" \/>\n\t\t<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/prohoster\" \/>\n\t\t<!-- All in One SEO -->\n\n","aioseo_head_json":{"title":"\ud83e\udd47Historie a d\u011bdictv\u00ed jQuery | ProHoster","description":"jQuery \u2014","canonical_url":"https:\/\/prohoster.info\/cs\/blog\/news\/istoriya-i-nasledie-jquery","robots":"max-image-preview:large","keywords":"","webmasterTools":{"miscellaneous":""},"schema":null,"og:locale":"cs_CZ","og:site_name":"ProHoster | \u041a\u0443\u043f\u0438\u0442\u044c \u043d\u0430\u0434\u0435\u0436\u043d\u044b\u0439 \u0445\u043e\u0441\u0442\u0438\u043d\u0433 \u0434\u043b\u044f \u0441\u0430\u0439\u0442\u043e\u0432 \u0441 \u0437\u0430\u0449\u0438\u0442\u043e\u0439 \u043e\u0442 DDoS, VPS VDS \u0441\u0435\u0440\u0432\u0435\u0440\u044b","og:type":"article","og:title":"\ud83e\udd47\u0418\u0441\u0442\u043e\u0440\u0438\u044f \u0438 \u043d\u0430\u0441\u043b\u0435\u0434\u0438\u0435 jQuery | ProHoster","og:description":"jQuery \u2014","og:url":"https:\/\/prohoster.info\/cs\/blog\/news\/istoriya-i-nasledie-jquery","og:image":"https:\/\/prohoster.info\/wp-content\/uploads\/2021\/11\/logo-350.jpg","og:image:secure_url":"https:\/\/prohoster.info\/wp-content\/uploads\/2021\/11\/logo-350.jpg","og:image:width":350,"og:image:height":350,"article:published_time":"2019-10-31T19:24:17+00:00","article:modified_time":"2019-10-31T19:24:17+00:00","article:publisher":"https:\/\/www.facebook.com\/prohoster","article:author":"https:\/\/www.facebook.com\/prohoster"},"aioseo_meta_data":{"post_id":"38523","title":null,"description":null,"keywords":null,"keyphrases":null,"primary_term":null,"canonical_url":null,"og_title":null,"og_description":null,"og_object_type":"default","og_image_type":"default","og_image_url":null,"og_image_width":null,"og_image_height":null,"og_image_custom_url":null,"og_image_custom_fields":null,"og_video":null,"og_custom_url":null,"og_article_section":null,"og_article_tags":null,"twitter_use_og":false,"twitter_card":"default","twitter_image_type":"default","twitter_image_url":null,"twitter_image_custom_url":null,"twitter_image_custom_fields":null,"twitter_title":null,"twitter_description":null,"schema":{"blockGraphs":[],"customGraphs":[],"default":{"data":{"Article":[],"Course":[],"Dataset":[],"FAQPage":[],"Movie":[],"Person":[],"Product":[],"ProductReview":[],"Car":[],"Recipe":[],"Service":[],"SoftwareApplication":[],"WebPage":[]},"graphName":"","isEnabled":true},"graphs":[]},"schema_type":null,"schema_type_options":null,"pillar_content":false,"robots_default":true,"robots_noindex":false,"robots_noarchive":false,"robots_nosnippet":false,"robots_nofollow":false,"robots_noimageindex":false,"robots_noodp":false,"robots_notranslate":false,"robots_max_snippet":null,"robots_max_videopreview":null,"robots_max_imagepreview":"large","priority":null,"frequency":null,"local_seo":null,"seo_analyzer_scan_date":"2026-01-23 22:22:33","breadcrumb_settings":null,"limit_modified_date":false,"reviewed_by":null,"ai":null,"created":"2021-03-01 01:07:40","updated":"2026-01-23 22:22:33","focus_keyword":null,"additional_keywords":null,"truseo_locale":null},"gt_translate_keys":[{"key":"link","format":"url"}],"_links":{"self":[{"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/posts\/38523","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/comments?post=38523"}],"version-history":[{"count":0,"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/posts\/38523\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/media\/28907"}],"wp:attachment":[{"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/media?parent=38523"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/categories?post=38523"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/tags?post=38523"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}