Proč nestahovat JS a CSS z cizích CDN?

Martin Michálek Martin Michálek

Na webech to ještě často vídám:

<script 
  src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js">
</script>

Vývojáři a vývojářky to dělají z několika důvodů:

  1. „Je to jednoduché.“
    Prostě se ten řádek zkopíruje z jiného projektu nebo z webu Googlu. Žádné nastavování sestovacícho procesu, prostě pohoda.
  2. „Z Googlu se to stáhne rychleji než z naší domény.“
    Je optimalizovaná CDN, takže to bude rychlé jako blesk.
  3. „Je velká šance, že to uživatel bude mít v cache z jiného webu.“
    Pokud už byl na webu, který tuto verzi používá, pravděpodobně soubor vůbec nebude muset stáhnout.

Chtěl bych tady proklamovat, že ke dnešku je pravdivný už jen bod 1. Ano, je to jednoduché, ale tím výčet výhod končí.

HTTP/2 změnilo situaci poprvé

Druhá verze protokolu HTTP zrychlila servírování stránek mimo jiné tím, že v momentě navázání spojení na vaši doménu dokáže přicházet velké množství souborů najednou.

HTTP/2 versus HTTP/1.1

Obrázek: Zatímco na HTTP/1.1 tvoří prvky stránky „frontu na banány“, na HTTP/2 je může prohlížeč stahovat prakticky najednou.

Úzkým hrdlem se pak stává ono navazování spojení, nutnost spojit se na novou doménu.

TODO

Obrázek: Navazování spojení na ajax.googleapis.com - tyrkysová je čas na DNS, oranžová navazování spojení, fialová SSL.

Už po nasazení HTTP/2 situaci přestalo být rozumné stahovat kritické zdroje, jako jsou CSS a vlastní JS, z CDN od Googlu, Microsoftu a dalších velkých firem.

Zařazeno v tématech:

CSS