Lucrand la fatzada: Imbunatatirea timpului de incarcare  

Thrown (Ţâpat) in

De mai multa vreme cititorii imi spun ca blogul meu se-ncarca mult prea lent. Am izolat doua scripturi care introduceau intarzierea maxima in timpul de incarcare (TI) si le-am scos. Discut in continuare cum am identificat problemele de incarcare si cum am analizat utilitatea / inutilitatea lor. Nu e perfect, dar e mai bine. TI al unui blog este una din chestiile care desi simple, afecteaza intr-o masura disproportionat de mare "experienta" cititorului si daca se va reintoarce, sau nu. TI al blogului meu nu este si mai ales nu era pe cat de mic putea sa fie, din mai multe motive. Am mai "atins" aceasta problema in articole precedente (1, 2). Iata ce scriam nu demult: UPDATE (May 14, 13:00 EDT): Numai bine ce ridicam Google in slavi, si descopar ca iar nu face fata traficului. Iata un screen capture de la PingTools in dreapta. Daca pe 9 Mai (cand se vad timpii de incarcare de 30 s ca si cei de 0.x s, cand pur si simplu scriptul a abandonat sa mai astepte) aparuse un mesaj pe status.blogger, acum nu a aparut nimic. In mod normal, timpul de incarcare este de 3-6 s.

1. Pregatire

O reactie isterico-ludita, de scoatere a tuturor widget-urilor si plugin-urilor ar fi complet contraproductiva, reducand prea radical functionalitatea. O chestie mai desteapta ar fi identificarea widgeturilor / scripturilor / pluginurilor cu probleme si vazut daca nu cumva numai una sau doua sunt responsabile pentru cea mai mare parte a intarzierilor. Un prim pas in optimizarea paginii este mutarea tuturor elementelor care pot avea probleme catre sfarsitul paginii (in cazul meu, sub Copyright Notice). Acolo se afla toate scripturile si logourile care nu sunt relevante pentru cititor. In cazul vreunei probleme cu una dintre ele, pagina se va fi incarcat pana la aparitia problemei, oferind cititorului un minim de functionalitate.

2. Testele

Pentru inventarierea problemelor potentiale exista mai multe unelte. Am ales "testul intregii pagini" (1), oferit de Pingdom Tools, intrucat au un test comprehensiv. Este fantastic de folositor, e gratis si rezultatele sunt salvate. Compania suedeza ofera si un program de monitorizare automata a site-ului tau, dar asta costa bani dupa primele 30 de zile gratis. Desigur, exista posibilitatea unor shmekerii scarbavnice si gretzoase de furt de serviciu pentru cei care au mai multe domenii la dispozitie, dar nu vom intra in aceste amanunte. Testul manual este insa gratis tot timpul si e o idee excelenta sa-l faci din cand in cand si-n special dupa ce faci schimbari majore de structura a site-ului sau de hosting.

3. Observatii

Repetarea testului pe parcursul unui interval mai lung de timp a scos la iveala urmatoarele scartzaieli:
ElementsecExplicatie
1.DNS problem1-28Datorata in general metodei de hosting folosita, incluzand probleme de DNS
2.Elem. intrinseci0-15Diverse elemente care sunt parte din blog, cum ar fi background, bullets, css, html.
3. Img articole0-30Folosesc deseori imagini in articole, incepand cu screen captures si terminand cu afise.
4. OutbrainRater 3-8Script care permite cititorului sa dea note fiecarui articol in parte de la 1 la 5 stele.
5. SnapShots js0-3Script care permite cititorului sa vada un preview al fiecarui link inainte de a-l deschide.

4. Discutie

1. Problemele de webhost / DNS depasesc scopul acestui articol si nu le voi discuta aici. Daca observi in rezultatele testului ca primul rubrica dureaza mai mult de 1-2 secunde, ai si tu aceste probleme (3). Le poti rezolva schimband webhostul. Este, desigur, preferabil sa verifici noul webhost cu acest test inainte de a te muta la el, ca sa fii sigur ca nu vei avea si acolo aceste probleme. Dupa cum se vede in imaginea alaturata, daca dureaza peste 10.2 secunde pana sa inceapa elementele din pagina sa se-ncarce, TI fiind 13.4 secunde, problema nu poate fi cu elementele urmatoare, ci numai cu webhostul. 2. Elementele intrinseci sunt chestii care apartin de blog, cum ar fi imaginile de background, codul html sau css, imagini si chiar sunete sau flash folosite in pagina care sunt parte din design. Evident, acestea pot fi schimbate / reduse /eliminate numai printr-un redesign. NB: incarcarea lenta a unui element nu este nota proasta pentru elementul respectiv decat in masura in care se intampla repetat. Daca se intampla sporadic este cel mai probabil o problema de hosting. De pilda, in imaginea alaturata (2), o imagine de pe blogger.com de 0.1 KB cauzeaza o intarziere de peste 10 secunde. Aceasta este o problema de hosting ce nu poate fi rezolvata prin redesign. 3. Eu folosesc destul de des imagini si clipuri youtube in articole. Imi este imposibil sa renunt complet la ele. Totusi, unele dintre acestea, in special cele mai largi, creeaza in mod vadit probleme. Pe viitor, vor trebui reduse la minim. 4. Outbrain este un script de functionalitate indoielnica intrucat Blogger urmeaza s-o introduca nativ pentru toate blogurile. Mai mult, unii utilizatori pot renunta sa lase comentarii odata ce au dat o nota unui articol. Din perspectiva mea, comentariile sunt mult preferabile unei simple note. Utilitatea acestui script este indoielnica si cu atat mai greu de justificat cu cat contribuie de obicei 2-3 secunde la incarcarea paginii, uneori mai mult. 5. SnapShots este un script care mie personal imi place, dar este nesuferit multor cititori. Putini dintre cei care nu-l suporta stiu ca poate fi configurat sa nu apara pentru ei, sau sa apara exact cum le place si nici nu vor sa afle asta. Intrucat putini utilizatori stiu despre el si ce poate face si exista unii care nu-l suporta, scriptul va zbura, intrucat este putin probabil ca cei care-i vor duce lipsa vor inceta sa viziteze pagina, dar este aproape garantat ca ceilalti nu vor mai veni deloc. In "Despre Blog" este o discutie mai pe larg despre SnapShots. Pe langa rezultatele testului trebuie luate in consideratie si opiniile utilizatorilor individuali, chiar si (si poate in special atunci cand) acestea nu sunt foarte bine argumentate logic. De multe ori, teste care par fantastice nu iau in calcul anumite variabile, si nimic nu este mai folositor decat o masurare directa a variabilei principale - satisfactia utilizatorului. Si-ntamplarea faca ca testul in sine nu interpreteaza scripturile JS, ci numai simuleaza incarcarea lor. Apare astfel posibilitatea ca anumite scripturi, desi servite de serverul lor rapid si implicit incarcate rapid, sa se execute foarte lent, creand acea lehamite si enervare care taie sansele ca un cititor sa se reintoarca. Atat OutbrainRater cat si SnapShots au sanse mari sa creeze aceasta problema. Ambele depind de Flash, care are in sine problemele sale de utilizare excesiva CPU. In plus, ele "citesc" si apoi modifica intreaga pagina, lasand uneori browserul "incremenit" pentru cateva secunde in plus fata de TI. Alte scripturi care depind de Flash, cum ar fi embedded video clips pot crea probleme similare, greu de vazut cu acest test.

5. Rezultate

Problema cea mai acuta este de hosting, si Google nu este asa de nemaipomenit pe cat ar putea sa fie. Eliminarea celor doua scripturi a adus totusi o imbunatatire substantiala in satisfactia vizitatorilor (1). Atat utilizatorii forumului, cat si prietenii carora le-am pus aceasta intrebare au remarcat o incarcare mai rapida a paginii. De fapt, cam toata lumea mi se plangea ca pagina este prea incarcata de widgets, de multa vreme, si asta include cam pe toti cei din BlogRoll. Mai mult, si timpii raportati de pingtools au scazut substantial. Orele de varf continua sa prezinte probleme, dar deja mai mult de 90% din aceste probleme nu pot fi rezolvate scotand scripturi, ci numai schimband solutia de hosting.

6. Concluzie

Desi unii prefera sa nu vada nici macar widgeturile de "MyBlogLog" sau "BlogCatalog", eliminarea celor doua scripturi care modifica pagina a produs o imbunatatire substantiala a experientei cititorului. TI ramane in continuare mai mare decat as vrea eu dar e mult mai mic decat inainte. Ar mai ramane pentru viitor studierea posibilitatii mutarii celor 2 liste de vizitatori pe o pagina separata, in "Cartea de Oaspeti", un redesign al blogului care sa reutilizeze la maxim imaginile in asa fel incat numai una, maxim doua sa fie necesare pentru background si nu in ultimul rand, cautarea unei solutii de webhosting mai rapide. O alta idee, de explorat in limita timpului disponibil, ar fi testarea individuala a fiecarui script pastrat, pentru a le identifica si elimina pe urmatoarele mai paroase. Multzumiri tuturor celor care au oferit critici si sugestii, si in special lui Cristi, Puttycat, Otto, BullyGil, Oana, Raluca, unmicdrac, duster, cezar, Jen si Roxana. Apreciez intotdeauna criticile si daca ai vreo critica de oferit, nu ezita sa lasi comentariu, chiar si anonim sau sa-mi trimiti email.

20090810 UPDATE: Vrei mai multe articole tehnice pentru Blogger / Blogspot? Este modificarea de aici curenta, sau am facut una noua, cu acelasi efect, dar mai buna? Toate modificarile aduse de mine acestui sablon (template) pot fi gasite in Zamolxis ChangeLog. Seria lucrand la fatada va gazdui de-acu’ incolo articole despre PR, media persuasion si eventual imaginea Romaniei.

Surse

1. Micsorarea timpului de-ncarcare - Forumul bloggerilor 2. http://tools.pingdom.com/fpt/default.asp?url=http%3a%2f%2fasa.zamo.ca%2f&id=200244 3. http://tools.pingdom.com/fpt/default.asp?url=http%3a%2f%2fasa.zamo.ca%2f&id=199820

Thank you for reading (mulţam fain pentru cetire)! Publicat Friday, May 16, 2008 . Similar articles under the following categories (poţi găsi articole similare sub următoarele categorii): (Subscribe) . Dacă ţi-a plăcut articolul, PinIt-uieste-l, ReddIt-eaza-l, stumble-uieste-l altora, trimite-l pe WhatsApp yMess şi consideră abonarea la fluxul RSS sau prin email. Ma poti de asemenea gasi pe Google. Trackback poateputea fi trimis prin URL-ul de sub Comentarii.
Aici vei găsi ştiri inedite, articole hazoase, perspective originale in politică, societate, economie şi relaţii interumane. QUESTIONS (Intrebări)? We got Answers (Răspunsuri există)!  
blog comments powered by Disqus