Mein Nicht-mehr-nur-jQuery-Armeemesser
Vor fast zwei Jahren habe ich mein jQuery-Armeemesser hier dokumentiert, eine Sammlung von jQuery-Plugins, die ich immer mal wieder in Projekten einsetze, weil sie nicht nur bewährt und durchdacht sind, sondern sich gut in meinen Workflow integrieren und auch sonst meine Anforderungen erfüllen.
Zeit für ein Update – auch, aber nicht nur, weil ich ein paar Plugins gewechselt habe und deren Nachfolger (was reiner Zufall ist) mittlerweile gar kein jQuery mehr benötigen. Zudem habe ich sie diesmal nach Einsatzgebiet und -häufigkeit aufgeteilt.
Die Polyfills
- svg4everybody von Jonathan Neal – bessere SVG-Sprites mit externer Quelldatei und
<use> - respimage und/oder lazysizes von Alexander Farkas – responsive Bilder mit
srcset,sizes, bei Bedarf Lazyloading und allem Zipp und Zapp, und zwar easy-peasy
Es gibt übrigens auch ein lazysizes-Plugin für den Polyfill und man kann es mit dem sehr bekannten picturefill kombinieren.
Die häufig genutzten Plugins
- Responsive Nav von Viljami Salminen – sehr schlanke Smallscreen-Navigation
- Magnific Popup von Dmitry Semenov – beste Lightbox der Welt, Punkt (braucht jQuery)
- Slick von Ken Wheeler – eine eierlegende Wollmilch-Slideshow, noch dazu responsive und überhaupt (braucht jQuery)
Technisch gesehen ist Slick die einzige „echte“ jQuery-Abhängigkeit, Magnific Popup läuft alternativ auch mit Zepto. (Ich habe aber nichts gegen jQuery, im Gegenteil.)
Die selten genutzten Plugins
- Frend von Thomas Digby und Adam Duncan – eine noch wachsende Sammlung von Frontend-Komponenten mit Accessibility-Fokus
- FitVids von Dave Rupert – responsive eingebettete Videos (primär YouTube und Vimeo)
- PrismJS von Lea Verou – Syntax-Highlighting für Code braucht man leider eher selten, aber wenn, dann doch bitte so
Die Frend-Komponenten sind wirklich sehr empfehlenswert; die Off-Canvas-Navigation verwende ich hier im Blog, Tabs und Accordion habe ich bereits getestet. Sehr flexibel anpassbar und durchdacht gemacht. Ich bin gespannt auf die angekündigte Dropdown-Navigation.