Co je JSDelivr a jak ho používat

Pokud nevyužíváte žádný package manager, tak nejspíš přidáváte JS knihovny do projektu následujícím způsobem. Vyhledáte knihovnu, vyhledáte zdrojový kód knihovny a zkopírujete zdrojový kód do projektu.

Je to asi nejhorší způsob jak do projektu přidat kód knihoven. Nejlepším způsobem je využívání package manageru, v případě že nechcete volit tuto možnost můžete využít CDN.

Co je to CDN?

CDN neboli Content Delivery Network česky síť pro doručování obsahu. Jeho hlavním účelem je poskytovat kód z jednoho serveru více serverům v síti.

CDNky umožňují uživatelům stahovat soubory rychleji díky umístění datových center po celém světě. Když prohlížeč uvidí odkaz CDN, stáhne knihovnu z datového centra, která je nejblíže uživateli. Takto fungují CDN.

Co je JSDelivr?

JSDelivr je speciální druh CDN. Je vytvořen tak, aby umožnil uživatelům stahovat JavaScriptové knihovny, které jsou hostovány na npm a  na Githubu. Může také načíst knihovny WordPressu pokud jsou hostovány na Wordpress.org).

Pokud používáte JSDelivr nebo jinou CDN, není nutné kopírovat zdrojové soubory do projektu. Můžete použít odkaz podobný tomuto:

<script src="https://cdn.jsdelivr.net/npm/nazev-balicku"></script>

Nástroj JSDelivr umožňuje určit i verzi knihovny, kterou chcete využit v projektu. Chcete-li určit verzi, přidejte do src @ a verzi, kterou chcete použít.

Kdy je vhodné použít JSDelivr?

Tuto CDN využívám pouze v projektech, ve kterých nevyužiji žádný package manager. Nebo v případě, že chci nějakou knihovnu rychle vyzkoušet bez instalace.

Přidání knihovny do projektu

Chcete-li nainstalovat knihovnu, musíte přidat značku <script>, která odkazuje na knihovnu v JSDelivr. Knihovnu můžete načíst z npm nebo Github, žáleží co preferujete.

Zde je příklad přídání minifikované verze stick carouselu do projektu. Za znakem @ vidíte verzi 1.8.1.

<script src="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>