Cand lucrez la site-uri ma trezesc uneori cu probleme ce trebuie rezolvate, probleme care nu credeam ca exista cand mi-am facut planul de bataie. De la bug-uri care vin de la compatibilitatea intre tema folosita si plugin-uri, la bug-uri care aparent nu au nici un sens si trebuie sa le rezolv prin metode pe care eu le numesc „brute-force”, adica sa scriu cod care sa modifice o functionalitate existenta ce imi da un rezultat nedorit.
In general animatiile nu sunt o problema pentru mine. Ma joc cu ele pana gasesc o animatie care imi place si continui sa lucrez la altceva. Dar gasesc si aici gasesc uneori probleme ce sunt aparent mici, dar care imi mananca mult timp.
In cazul website-ului Lyset, dupa ce am creat un SVG pentru header care se anima l-am introdus in site, am dat refresh si am fost foarte fericit sa-l vad ca merge cum vroiam. Dar cand am dat inca un refresh m-am trezit ca nu mai functiona, animatia nu mai pornea deloc. De ce? Nu reuseam sa imi dau seama, dar dupa mai multe teste si research pe net am descoperit ca exista o problema cu fisierele SVG ce contin animatii CSS in interiorul lor. Desi in mod normal, la orice incarcare a site-ului tot codul CSS trebuie rulat, animatiile nu reporneau decat daca fisierul era sters din cache. Nici acum nu stiu de ce se intampla asta, dar fiind incapatanat am inceput sa caut solutii din ce in ce mai complicate.
Intai am inceput prin incercarea scoaterii fisierelor SVG din cache, facandu-le sa expire imediat. Dar evident nu a functionat. Apoi am inceput sa vad daca animatia reporneste daca trec de la afisarea SVG-ului ca o poza la includerea lui intr-un background prin CSS. Cum nici acest lucru nu a mers, am incercat scrierea de cod Javascript care incarca fisierul SVG dupa ce incepe incarcarea site-ului. Dupa mai mult research pe internet am descoperit ca ar fi posibil sa fie posibila animatia dupa refresh daca adaug la link-ul fisierul SVG data folosind JS. Din pacate aici m-am lovit de un perete in ce priveste aceasta animatie.
Nimic nu a functionat si pierdusem deja foarte mult timp. Deja ma gandeam la lucruri foarte complicate pentru ce trebuia sa fie simplu. Si apoi mi-am adus aminte de un alt website in care am adaugat animatii SVG, dar in cazul ala codul era inclus direct in pagina de catre tema (desi codul era uploadat de catre mine printr-un fisier SVG), nu prin link. Desi nu imi place sa includ cod direct in paginile facute de mine deoarece nu ma astept clientii nostri sa stie sa il modifice, am decis sa incerc acest lucru. Pana la urma aceasta solutie simpla si rapida a functionat.
Dealungul timpului mi-am format in cap o baza de date lunga de bug-uri si ciudatenii de acest gen care ma ajuta cand lucrez la site-uri. Poate fi demoralizator sa lucrezi la o singura problema pentru multe ore (sau chiar zile), dar in general solutii se gasesc. Unele solutii sunt simple si elegante, alteori necesita sa creez ceva similar cu monstrul lui Frankenstein. Dar de fiecare data, la final, ma simt ca atunci cand rezolv un puzzle greu sau castig un meci de sah dificil.
