Tema 3 la Interfe\u0163e Evoluate ne-a cerut s\u0103 scriem, folosind Javascript pentru scripting, un webbased thingie care sa faca highlight pe cuvinte \/ fraze dintr-o pagina web, \u00eenc\u0103rcat\u0103 dinamic (eventual folosind Ajax). Ceva foarte simplu, menit s\u0103 ne familiarizeze, presupun, cu Javascript.<\/p>\n
Eu fug de Javascript \u00eenc\u0103 de la \u00eenceputurile experiment\u0103rilor mele web-astice, pentru ca ce am v\u0103zut atunci ar\u0103ta foarte foarte aiurea pentru mine. E drept, cred, ce se spune despre Javascript, c\u0103 e un limbaj Ok de scripting, dar care e folosit \u00een cel mai hidos mod. Acum ceva vreme era folosit pentru nenorociri de-alea de anima\u0163ii de prost gust, ceasuri ascii care fug dup\u0103 mouse \u015fi alte nenorociri care nu au ce c\u0103uta \u00eentr-o intefa\u0163\u0103 bun\u0103.<\/p>\n
Acum vedem \u00eens\u0103 tot mai pu\u0163ine utiliz\u0103ri negative (cel pu\u0163in din punct de vedere vizual) a Javascript, \u015fi tot mai multe exemple pozitive. Nu \u015ftiu exact istoria, \u015fi sunt sigur c\u0103 o c\u0103l\u0103torie scurt\u0103 pe wikipedia<\/a> v\u0103 poat\u0103 l\u0103muri mai bine ca mine, dar eu cred c\u0103 Javascript a \u00eenceput s\u0103 devin\u0103 widely accepted ca un limbaj de scripting serios odat\u0103 cu trecerea la Web2.0, care, printre alte calit\u0103\u0163i, se define\u015fte prin interfe\u0163e web mult mai responsive. Dezvoltarea Javascript-ului ca limbaj a permis Web2.0 s\u0103 existe, \u015fi, la fel, nevoia de cre\u015ftere a calit\u0103\u0163ii interfe\u0163elor a dus la dezvoltarea limbajului. Cele mai populare tr\u0103zn\u0103i ce le folosim azi, Gmail, Y!Mail, Noul WordPress, dar \u015fi vechiul, aproape tot ce e Google-ish, toate folosesc la greu Javascript.<\/p>\n De ce avem a\u015fa super nevoie de Javascript? Well, \u00eenainte de web2.0 \u015fi de toat\u0103 nebunia cu superinterfe\u0163ele web, problema comunic\u0103rii c\u00e2t mai responsive cu clientul se putea rezolva \u00een dou\u0103 moduri. Prima strategie era cea local\u0103 (client-side scripting): aveai un script care \u00eenc\u0103rca totul \u00een pagina curent\u0103, \u00een javascript, \u015fi atunci puteai interac\u0163iona cu utilizatorul (s\u0103 validezi date, s\u0103 \u00eei dai ni\u015fte op\u0163iuni diferite \u00een func\u0163ie de alegerile pe car ele face …) \u00eentr-o manier\u0103 limitat\u0103 la informa\u0163iile care existau la \u00eenc\u0103rcarea paginii. \u015ei cum s\u0103 trimi\u0163i toate posibilit\u0103\u0163ile \u00eenseamn\u0103 cantitate mare de date \u015fi cantitate mare de date e un big no-no pentru interfe\u0163e web, interac\u0163iunea era limitat\u0103.<\/p>\n A doua strategie (server-side scripting) implica de cele mai multe ori re\u00eenc\u0103rcarea paginii \u015fi procesarea op\u0163iunilor cu server-ul. Necazul era c\u0103 \u015fi pe leg\u0103turile rapide (gen intraneturi) se observa re\u00eenc\u0103rcarea paginii, iar pe leg\u0103turile lente (sau no, normale) asta devenea o problem\u0103 serioas\u0103.<\/p>\n Toate problemele astea au primit o solu\u0163ie unic\u0103, elegant\u0103 \u015fi foarte foarte folosit\u0103 azi de toate aplica\u0163iile web ce le folosim frecvent: AJAX. Asynchronous Javascript And XML. De\u015fi tehnologiile care fac AJAX posibil exist\u0103 de prin 95, W3C a propus un draft pentru chestia asta doar \u00een 2006. Ideea e relativ simpl\u0103, AJAX se bazeaz\u0103 pe un obiect Javascript\u00a0 (da, JavaScript e \u015fi OO :P) care face o cerere HTTP c\u0103tre un server \u015fi \u00eenregistreaz\u0103 un handler (o func\u0163ie) care se apeleaz\u0103 \u00een momentul c\u00e2nd cererea \u00eentoarce ceva sau d\u0103 un timeout. R\u0103spunsul cererii se presupune a fi un XML, de\u015fi din ce am \u00eencercat eu se poate folosi \u015fi HTML ca r\u0103spuns, dar nu sunt sigur de alte tipuri de date.<\/p>\n Avantajul cel mare e c\u0103 toat\u0103 buc\u0103t\u0103ria se \u00eent\u00e2mpl\u0103 \u00een culise, utilizatorul are o experien\u0163\u0103 fluent\u0103, care seam\u0103n\u0103 cu experien\u0163ele cu interfe\u0163e ne-web. Exist\u0103 \u015fi limit\u0103ri. De\u015fi, teoretic, se pot cere fi\u015fiere oric\u00e2t de mari, av\u00e2nd \u00een vedere c\u0103 totul se \u00eent\u00e2mpl\u0103 peste un mediu care are performan\u0163e variabile indiferent de loca\u0163ie, se prefer\u0103 ca r\u0103spunsurile s\u0103 fie minime. O limitare de securitate care am observat-o (nu \u015ftiu exact c\u00e2nd a fost introdus\u0103) este c\u0103 cererile XMLttpRequest (obiectul de care v\u0103 ziceam) nu pot fi f\u0103cute dec\u00e2t c\u0103tre serverul de la care a fost \u00eenc\u0103rcat\u0103 pagina care execut\u0103 scriptul.<\/p>\n Desigur, problema asta se poate rezolva urgent cu un urlfopen <\/em>pe partea se server, \u015fi asta e mirific la AJAX, posibilitatea de a trece peste limit\u0103rile ini\u0163iale impuse de modelul Web prin pasarea lor c\u0103tre partea celalat\u0103 (client <-> server).<\/p>\n Anyway, pentru cine este interesat, tema mea 3 la IE este aici<\/a>. Si, ca sa o testati, puteti incerca sa folositi pagina asta<\/a> \u015fi asta<\/a> :)<\/p>\n Am devenit mult mai interesat dup\u0103 tema asta s\u0103 investighez mai \u00eendeaproape JavaScript \u015fi, mai ales AJAX pentru yPHP (pentru \u00eenceput, un modul de formuri dinamice \u015fi de verificare a formurilor pentru \u00eenceput :P). Vorbind de tehnologii, am \u00een\u0163eles c\u0103 jQuery (\u0103la de aici<\/a>, nu \u0103la care \u0163ine de baze de date \u015fi Java) e util. Are cineva vreo experien\u0163\u0103 cu tr\u0103znaia asta? I will give it a try, and post here on the results :)<\/p>\n","protected":false},"excerpt":{"rendered":" Tema 3 la Interfe\u0163e Evoluate ne-a cerut s\u0103 scriem, folosind Javascript pentru scripting, un webbased thingie care sa faca highlight pe cuvinte \/ fraze dintr-o pagina web, \u00eenc\u0103rcat\u0103 dinamic (eventual folosind Ajax). Ceva foarte simplu, menit s\u0103 ne familiarizeze, presupun, cu Javascript. Eu fug de Javascript \u00eenc\u0103 de la \u00eenceputurile experiment\u0103rilor mele web-astice, pentru ca … Continu\u0103 s\u0103 cite\u0219ti meeting JavaScript<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[557],"tags":[727,652,725],"class_list":["post-166","post","type-post","status-publish","format-standard","hentry","category-facultate","tag-cs-pub","tag-javascript","tag-yphp"],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/yeti.albascout.ro\/blog\/wp-json\/wp\/v2\/posts\/166","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/yeti.albascout.ro\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/yeti.albascout.ro\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/yeti.albascout.ro\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/yeti.albascout.ro\/blog\/wp-json\/wp\/v2\/comments?post=166"}],"version-history":[{"count":0,"href":"https:\/\/yeti.albascout.ro\/blog\/wp-json\/wp\/v2\/posts\/166\/revisions"}],"wp:attachment":[{"href":"https:\/\/yeti.albascout.ro\/blog\/wp-json\/wp\/v2\/media?parent=166"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/yeti.albascout.ro\/blog\/wp-json\/wp\/v2\/categories?post=166"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/yeti.albascout.ro\/blog\/wp-json\/wp\/v2\/tags?post=166"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}