jQuery: van onmisbaar naar erfgoed

Er zijn onderdelen van een website die er vooral zitten omdat ze er ooit moesten zitten. Niemand heeft ze bewust gekozen, en niemand durft ze weg te halen. jQuery is daar het beste voorbeeld van. Op miljoenen sites wordt het geladen, terwijl het steeds minder doet.

Dat is geen kritiek op de bibliotheek zelf. Die heeft het web jarenlang vooruitgeholpen. Het is een constatering over hoe websites verouderen.

Ik kom het tegen bij bijna elke site die ik overneem of doormeet. Er staan drie plugins die het nodig hebben. En een thema dat het voor de zekerheid ook inlaadt.

Bij een opruimronde kijk ik daarom altijd of het er nog echt toe doet. Soms kan het eruit en scheelt dat merkbaar. Vaker zit het vastgeklonken aan een afhankelijkheid die je niet zomaar loslaat.

jQuery uitgelegd in het webdesign woordenboek van Project Direct
Ooit onmisbaar, nu vooral erfgoed dat meelift.

Wat is jQuery?

jQuery is een bibliotheek geschreven in JavaScript. Het is dus geen aparte taal, maar een verzameling kant-en-klare functies.

Die functies maakten het werken met je pagina eenvoudiger. Een element opzoeken, iets verbergen, een animatie uitvoeren of gegevens ophalen zonder herladen.

Waarom het zo groot werd

Vanwege de browserverschillen. Rond 2008 deed elke browser dingen net anders. Wat in de ene werkte, faalde in de andere.

jQuery verborg die verschillen achter een enkele opdracht. Je schreef het een keer en het werkte overal. Dat was destijds een enorme bevrijding.

Waarom het nu minder nodig is

Omdat browsers naar elkaar toe zijn gegroeid. Wat je vroeger met jQuery deed, kan de browser tegenwoordig zelf met een paar regels.

Bovendien werken moderne browsers grotendeels hetzelfde. Het probleem dat jQuery oploste, bestaat nauwelijks meer. Meer over die verschillen lees je bij cross-browser.

Wat het je kost

De bibliotheek zelf is ongeveer dertig kilobyte. Dat klinkt weinig, maar het moet wel opgehaald, gelezen en uitgevoerd worden voordat er iets gebeurt.

Erger is het scripts stapelen. Ik zie sites die twee versies naast elkaar laden, omdat twee plugins elk hun eigen versie meebrengen.

Wat ik controleer bij een opruimronde

  1. Wordt het meer dan een keer ingeladen?
  2. Welke plugins hebben het echt nodig?
  3. Laadt het thema het voor de zekerheid mee?
  4. Staat er nog code die alleen daarom bestaat?

Die eerste levert vaak direct laadtijd besparen op. Meer daarover lees je bij pagespeed.

Kun je het weghalen?

In WordPress is dat lastiger dan het lijkt. Het systeem laadt het standaard mee, en veel plugins bouwen erop.

Zet je het uit terwijl er iets van afhangt? Dan breekt je menu of je formulier, zonder foutmelding. Dat is een klassieke manier om een site stil te leggen.

Test zoiets dus altijd eerst op een kopie. Werkt alles nog na een klikronde door je hele site? Dan pas live.

Is het verouderd?

Niet in de zin van deprecated. Het wordt nog onderhouden en het werkt gewoon.

Wel is het voor nieuwe projecten zelden de juiste keuze. Ik gebruik het niet meer als ik iets van de grond af bouw. Voor bestaande sites laat ik het staan als het erin zit, tenzij het meetbaar iets kost. verouderde code opruimen is nuttig, maar niet ten koste van een werkende site.

Wat je in plaats daarvan gebruikt

Elementen opzoeken, tonen en verbergen, gegevens ophalen: daar zijn inmiddels standaardfuncties voor. Die werken in elke moderne browser zonder extra bestand.

Dat scheelt je dertig kilobyte en een afhankelijkheid die je jaren meesleept.

Hoe je ziet of het bij jou speelt

Open de ontwikkelaarstools van je browser en kijk bij het netwerkverkeer. Zoek daar op de naam en tel hoe vaak het voorkomt.

Zie je het twee keer staan, dan is dat gratis winst. Vraag je bouwer welke plugin de tweede versie meebrengt.

Meer vragen over jQuery

Dit zijn de vragen die ik hierover het vaakst krijg. Ik werk ze los uit.

  • Wat is jQuery?
  • Waarom werd jQuery zo populair?
  • Heb je jQuery nog nodig?
  • Vertraagt jQuery je website?
  • Kun je jQuery uit WordPress halen?
  • Wat gebruik je in plaats van jQuery?
Vanwege de browserverschillen. Rond 2008 deed elke browser dingen net anders. Wat in de ene browser prima werkte, faalde in de andere zonder duidelijke reden. Ontwikkelaars schreven daardoor per browser aparte code, en die moest je allemaal onderhouden. jQuery verborg die verschillen achter een enkele opdracht. Je schreef het een keer en het werkte overal. Dat was destijds een enorme bevrijding. Daar kwam bij dat de opdrachten kort en leesbaar waren. Je kon in een regel iets doen waar je anders een halve pagina voor nodig had. Het probleem dat het oploste, bestaat inmiddels nauwelijks meer. Moderne browsers werken grotendeels hetzelfde. Meer daarover lees je bij cross-browser. Dat verklaart ook waarom het er nog overal in zit. Het is jarenlang de standaard geweest en standaarden verdwijnen langzaam uit bestaande sites. Bij nieuwe projecten kies ik er daarom niet meer voor, maar bestaande sites laat ik met rust. Dat verklaart waarom je het op zoveel bestaande sites nog tegenkomt.
jQuery is een bibliotheek geschreven in JavaScript. Het is dus geen aparte taal, maar een verzameling kant-en-klare functies die je kunt gebruiken. Die functies maakten het werken met je pagina eenvoudiger. Een element opzoeken, iets verbergen, een animatie uitvoeren of gegevens ophalen zonder de pagina te herladen. Waar je vroeger tien regels code voor nodig had, volstond met jQuery vaak een enkele opdracht. Dat scheelde ontwikkelaars enorm veel tijd. Het werd rond 2008 de standaard en is dat jarenlang gebleven. Op miljoenen websites wordt het nog steeds geladen. Dat betekent niet dat het er nog moet zitten. Vaak zit het er vooral omdat het er ooit moest zitten, en omdat niemand het durft weg te halen. Meer over de taal eronder lees je bij JavaScript. Je hoeft dit niet te kennen om een goede website te hebben. Het helpt vooral bij het gesprek over snelheid, want dit is een van de eerste dingen die een bouwer nakijkt.
De bibliotheek zelf is ongeveer dertig kilobyte. Dat klinkt weinig, maar het moet wel opgehaald, gelezen en uitgevoerd worden voordat er iets gebeurt. Erger is het stapelen. Ik zie sites die twee of zelfs drie versies naast elkaar laden, omdat verschillende plugins elk hun eigen versie meebrengen. Dat is pure verspilling en het is met een controle op te lossen. Bij een opruimronde kijk ik daarom naar vier dingen. Wordt het meer dan een keer ingeladen? Welke plugins hebben het echt nodig? Laadt het thema het voor de zekerheid mee? En staat er nog code die alleen daarom bestaat? Die eerste levert vaak direct winst op zonder dat er iets aan je site verandert. Meer daarover lees je bij pagespeed. Vraag je bouwer om die controle een keer uit te voeren. Het kost hem een kwartier en het levert soms direct laadtijd op zonder dat er iets verandert aan je site.
Dat is lastiger dan het lijkt, en het is een klassieke manier om een site stil te leggen. WordPress laadt het standaard mee, en veel plugins bouwen erop. Zet je het uit terwijl er iets van afhangt, dan breekt je menu of je formulier. Het vervelende is dat er geen duidelijke foutmelding komt. Er gebeurt gewoon niets meer als je op iets klikt. Test zoiets dus altijd eerst op een kopie van je site. Klik daarna je hele site door: je menu, je formulieren, je sliders en je filters. Werkt alles nog? Dan pas naar de live omgeving. Zonder die testronde is het gokken, en dat is het risico niet waard. Meer over die aanpak lees je bij DTAP. Doe dit dus nooit even snel op een vrijdagmiddag. Zonder testronde op een kopie is het gokken, en dat risico is het niet waard. Klik na de test je hele site door: je menu, je formulieren, je sliders en je filters.
Voor een nieuw project gebruik ik het niet meer. Alles wat je ermee deed, kan de browser tegenwoordig zelf. Elementen opzoeken, tonen en verbergen, gegevens ophalen: daar zijn inmiddels standaardfuncties voor die in elke moderne browser werken. Dat scheelt je een bestand van dertig kilobyte en een afhankelijkheid die je jaren meesleept. Voor bestaande sites ligt het anders. Zit het erin en werkt alles, dan laat ik het staan tenzij het meetbaar iets kost. Verouderde code opruimen is nuttig, maar niet ten koste van een werkende site. Het is trouwens niet afgekeurd: het wordt nog gewoon onderhouden. Meer over dat onderscheid lees je bij deprecated. Laat het bij een bestaande site met rust als alles werkt. Opruimen is nuttig, maar een werkende site is meer waard dan een schone. Meet eerst wat het je werkelijk kost voordat je aan zoiets begint. Een werkende site is meer waard dan een technisch schone site.
Laadt jouw website meer scripts dan nodig is? Stuur me de link via het formulier hieronder. Ik kijk of er dubbele bibliotheken worden ingeladen en welke plugins ze echt nodig hebben. Bij oudere sites valt daar vaak iets weg te halen. Vermeld je plaats, dan weet ik meteen waar je zit.

Waar kan ik je mee helpen?