Câteva cuvinte despre CDN-uri

Dorin se tot minunează de web-ul modern, cel de 5MB/pagină. Eu i-am lăsat un comentariu în care am menționat, în treacăt, că problema nu este la furnizorii de internet ci la cei ce fac site-uri.

Așa că, înainte de un test de usability m-am gândit să fac și unul de performanță, poate-poate mă ascultă cineva. Majoritatea au fost mult prea ocupați să își laude vânzările record sau să se plângă că le-au luat serverele foc de black friday și iaca au trecut doi ani de atunci. Situația stă aproape la fel de frumos: Evomag are 4MB, Elefant are peste 16MB (!!!!!!!!!!!!!!!!!!), Domo a urcat la 3.6MB, Emag a rămas la 3MB. Abia aștept Black Friday anul ăsta, să-i văd cum iar se plâng și să lase impresia că știi, lor le pasă de utilizatori. HA HA HA.

Îți vine să crezi sau nu, Evomag încă încarcă două versiuni de jQuery UI. Dar chiar și cu o singură versiune, sunt curios la ce le folosește toată biblioteca… Și ca și cum n-ar fi suficient, nici nu sunt încărcate de pe un CDN public.

Și am ajuns la chestia care contează în acest post: CDN-urile.

Un CDN bun ar trebui să îndeplinească două condiții extrem de importante: să fie public și să fie aproape.

Ce înseamnă să fie public? Înseamnă că toate bibliotecile ar trebui să fie incluse de pe un cdn de genul ăsta. Deoarece succesul unui astfel de CDN constă – în primul rând – de frecvența cu care este utilizat de oameni și se reduce la un singur lucru: caching. Altfel spus, dacă jQuery este încărcat din același CDN atât pe Emag și pe Evomag, vizitatorul va descărca jQuery o singură dată (căci se păstrează în cache). Orice bibliotecă publică folosești o încarci de pe un astfel de CDN public.

A doua chestiune este distanța de la CDN la utilizator. În România, această distanță este neglijabilă, dar dacă ai un CDN în State ai o problemă de fizică. Pentru că vezi tu, datele au o limită de viteză: viteza luminii. Și chiar dacă datele se transferă ușor, există cealaltă problemă, de negociere a transferului. Adică browserul tău trimite un request către CDN și până îți răspunde CDN-ul că fișierul există și că se pregătește să-l trimită trec câteva milisecunde bune. Cam câte?

Să presupunem că avem un CDN în Sydney, Australia. Știind că din Constanța până în Sydney sunt 15.000km și că viteza luminii este de 300.000km/s, avem minimum 100ms pierdute doar pe vorbăraia dintre browser și server, fără a se transfera mare lucru. Iar timpul ăsta este în condiții ideale, în realitate s-ar putea să fie ceva mai mult (routere, switch-uri etc)

Ce nu înțeleg eu este de ce nu există încă vreo firmă de hosting din România care oferă un CDN public (parcă Akamai și MaxCDN au servere pe aproape, dar nu știu dacă e vreunul în România)


Probabil ești tentat să crezi că dimensiunea paginii desktop este mai puțin importantă, că deh, doar avem una dintre cele mai bune conexiuni la internet din lume! În plus, varianta mobilă este mică, deci totul este ok.

Dar ia gândește-te că dispozitivele ce au conexiune mobilă sunt destul de comune, iar aici nu intră doar telefoanele! Tabletele cu conexiune 3g sunt rezonabil de ieftine și, cu toate astea, abonamentele și cartelele de telefonie au incluse un număr de MB sau chiar GB ce pot fi consumați la o simplă sesiune de shopping.

Există routere în care se poate înfige o cartelă 3G/4G și se pot folosi ca atare. Traficul ăla este lent și scump și nimănui nu-i pasă de asta!

Ce se mai pierde din vedere este și faptul că o conexiune mobilă joacă după alte reguli decât una fixă. Are semnal? Cât de aproape este de o antenă? Cât de „încărcată” este antena? Șamd. Latența 3G este de ~200ms. La fel ca și în cazul distanței până la CDN, ăsta înseamnă timp în care nu se transferă date iar browserul doar așteaptă confirmarea de la server că totul e în regulă.

Ce se întâmplă dacă JS-ul nu se încarcă? Păi Emag nu mai are meniu funcțional, pe Elefant este imposibil să faci o comandă de un produs iar Evomag nu afișează site-ul deloc (pagină albă). Te provoc la o sesiune de browsing când ești în tren Constanța-București unde sunt distanțe generoase în care singura conexiune disponibilă este GPRS.

Nu vă pedepsiți clienții!

Sunt convins că nu se va schimba vreodată (sau prea curând) ceva din asta. Evomag a avut un redesign relativ recent; Emag are schimbări constante, la fel și Elefant, dar evită să umble la performanță.

13 Comentarii to “Câteva cuvinte despre CDN-uri”

  1. cloudflare tocmai ce lansase sau lanseaza un nod in bucuresti.

  2. Nici eu nu cred că problema e la furnizorii de internet ci la cei care fac pagini. Eu eram ceva gen: “De ce mama ei de treabă pagina de la blogul meu e așa mare?”. Am aflat între timp, povestea acolo e cum o zici și tu.

  3. Apropos, mi-am creat o temă WordPress pentru blog – în limita cunoștințelor mele – poate arunci un ochi peste ea, în limita timpului tău dispnibil, să-mi spui părerea ta: http://bogdananghelina.ro

  4. Legat de treaba cu distantele, am gasit o chestie destul de interesanta http://www.submarinecablemap.com/ :)

  5. Ionuț Staicu

    Exact. Ceea ce înseamnă că distanța din exemplul meu este și mai mare, există și mai multe noduri etc. Latență și mai mare.

    Ce am uitat să menționez în articol este că și serverul principal ar trebui să fie cât mai aproape.

  6. Nici cu discourse nu mi-e rușine, numai js-ul are 2.7MB. Cu totul 3.3MB. E enorm pentru un forum. Nu mai spun ca de fiecare dată când accesez discourse (i.e. df), procesorul meu o cam ia razna cât timp se încarcă pagina. Ca o comparație, SO are 800K cu totul :)

  7. Ionuț Staicu

    @mj: Aș aprecia dacă data viitoare ai folosi un nume și adresă de mail reală. Altfel ajungi în spam.

    Acum să răspundem „acuzațiilor” :)

    Discourse e un pic diferit de un magazin, cel puțin în cazul Devforum:

    – intenția de a vinde ceva? Nu există. Nici măcar nu este afișată publicitate (pentru utilizatorii autentificați; musafirii văd un banner)
    – funcționează decent fără JS activat (caz în care are sub 100kb și lipsesc anumite funcționalități);
    – forumul este mai mult un webapp (ember JS), ceea ce înseamnă că oricât s-ar încărca inițial, nu se încarcă mult peste după aceea. Nu sunt foarte sigur că trecerea spre pagini distincte (statice, nici nu știu cum să le spun) ar reduce mult din KB cu păstrarea funcționalității;
    – fiind un pet project, nu dau prea mare importanță acestui fapt, pentru că a reduce dimensiunea ar însemna să fac un fork la UI și să mă apuc de optimizat. Plus că nu se justifică investiția de timp: doar 4% din vizitatori intră de pe 3g/4g; timpul de încărcare mediu pentru orice entry point este de 7.5s iar paginile ulterioare se deschid în aproximativ o secundă.
    – SO funcționează altfel din toate punctele de vedere, de la scop (Q/A vs discuții) până la hosting (în 2013 aveau 30+ servere, Devforum este pe un VPS de $10/lună cu 1GB de RAM). Sunt asemănări între discourse și SO dar sunt două ciorbe diferite :)
    – mie îmi iese sub 1Mb (ar ieși mai mult dacă n-ar fi gzip activat).

  8. Pareri de developeri, care denigreaza colegi de breasla si fac reclama negativa site-urilor.

    Argumentare:
    Site-urile respective au versiuni de mobile :), deci ce zici tu e o aberatie enorma.
    Tu faci referire la incarcarea versiunii desktop pe un device mobil, ceea ce nu se intampla decat daca sunt probleme tehnice (legate de scriptul de detectie device)

    Info:
    CDN este folosit pentru chestii mai avansate ( streaming video, download fisiere, etc.)
    Pentru un amarat de js, css sau jquerry se folosesc tool-uri de system administration:
    – Reverse proxy (varnish)
    – Memcache
    – Setup-uri hardware de tip HA (High Availability) sau Load Balancing
    – Multiple webservere, pentru separarea continutului static de cel dinamic
    – etc
    – etc
    – etc

    In momentul in care pe site ai 50k de utilizatori unici, singurul lucru care iti mai trebuie este sa ocupi conexiunile TCP pentru a lua un fisier de 3MB.
    Numarul de conexiuni TCP si banda de internet sunt singurele limite fixe in ceea ce tine de world wide web :)

    P.S. Critica constructiva, rog a fi tratata ca atare.

    Cheers,
    un sysadmin

  9. @sysadmin: mulțumesc pentru comentariu și pentru critică!

    Nu am denigrat nici un coleg de breaslă. În nici un caz nu asta a fost intenția mea.

    Tu faci referire la incarcarea versiunii desktop pe un device mobil, ceea ce nu se intampla decat daca sunt probleme tehnice (legate de scriptul de detectie device)

    Tocmai aici este o confuzie: un dispozitiv mobil nu înseamnă strict telefon sau tabletă. Ce se întâmplă când fac tethering de pe telefon și intru de pe laptop? Simplu: UA va fi al unui browser desktop deci vom descărca 10mb de rahaturi. Și hai să zicem că nu comentez că-mi papă traficul inutil, dar de ce să aștept 1-2-3 minute pentru a putea descărca o pagină? Apoi încă 1-2 minute pentru a descărca o altă pagină (imaginile variază de la o pagină la alta). Și tot așa?

    Chiar nu se împarte lumea în telefon === conexiune lentă (mobilă) și desktop === conexiune rapidă. Sunt și combinații între ele.

    Un CDN public (nu știu cum să evidențiez mai mult) este bun pentru optimizarea primei accesări. Dacă folosești același CDN ca alte site-uri vizitate de utilizator, îl scutești de descărcarea a câtorva sute de KB.

    Dar dincolo de dimensiunile mari și de durata transferului, mai este o problemă, de performanță a randării. 40k linii de CSS (cum are Emag) și 1-2MB de JS fac PC-urile mai slabe să meargă greu.

    […] banda de internet sunt singurele limite

    Păi nu asta am zis și eu? :)

  10. Din fericire nu mai ne conectam la vitezele extraordinare de 14.4 kpbs ca in copilarie. Ar fi trist pentru paginile astea. Este si o mica eroare in afirmatii acolo, dar fiind programator e de inteles. Datele nu sunt transferate niciunde cu viteza luminii. Nici macar fibra optica nu este mediul ideal – “In normal optical fibers (silica glass), light travels a full 31% slower”. Si odata ce ai convertoare pa, se duce si aproximatia aia de ‘viteza luminii’

  11. @Paul: mulțumesc pentru completare. Nu cunosc atât de multe detalii tehnice despre fibra optică, dar am făcut un calcul simplificat la maximum cu valori ideale. Faptul că viteza este mai mică nu face decât să facă situația și mai gravă.

Show trackbacks
  1. […] delvery network sau, prescurtat, CDN), solutie explicata de Ionut Staicu, pe intelesul tuturor, pe blogul sau. Pe scurt insa, “un CDN e bun la mai multe lucruri: reduce incarcarea serverului si poate […]

Ți-a plăcut articolul? Lasă un comentariu!

You can insert code snippets using BBcode:
[js].[/js] [html].[/html] [php].[/php] [css].[/css]
You can also use some HTML tags:
<blockquote>.</blockquote> <code>.</code> <a href="">.</a> <strong>.</strong> <em>.</em>