Üheleherakendus

Allikas: Vikipeedia
Jump to navigation Jump to search

Üheleherakendus on veebirakendus või veebisait, mis suhtlusel kasutajaga kirjutab käesoleva veebilehe dünaamiliselt üle, selle asemel et serverist tervet uut lehte alla laadida. See tähendab, et rakendus jookseb täielikult klientarvuti veebilehitsejas, luues sujuvama kasutajakogemuse ilma katkestusteta eri lehtede vahel. Niimoodi jääb mulje, et rakendus töötab nagu töölauaprogramm, kuna kogu informatsioon laetakse alla esimese korraga või dünaamiliselt vastuseks kasutaja tegevustele ning lisatakse vajaduste kohaselt lehele. Selline veebileht ei lae ennast kasutussessiooni jooksul kordagi uuesti ega suuna kontrolli edasi uuele lehele, kuigi eri tööriistadega, näiteks HTML5 History API, võib tekkida mulje, et laetakse uusi lehti juurde või navigeeritakse teistele lehtedele. Üheleherakendust kasutades toimub tihtipeale taustal dünaamiline suhtlus veebiserveriga. Seda tüüpi rakenduse loomiseks kasutatakse tavaliselt HTMLi, JavaScripti ja CSSi.[1]

Ajalugu[muuda | muuda lähteteksti]

Termini "üheleherakendus" (single-page application) päritolu pole kindel, kuigi ideed ennast on arutatud vähemalt aastast 2003.[2] Aprillis 2002 kirjutas Stuart Morris vabaltseisva veebilehe (self-contained website) aadressil slashdotslash.com, mis täitis samu eesmärke ja põhimõtteid nagu üheleherakendus. Hiljem samal aastal kirjeldasid Lucas Birdeau, Kevin Hakman, Michael Peachey ja Evan Yeh üheleherakenduse implementatsiooni Ameerika Ühendriikide patendis 8,136,109.[3]

Üheleherakenduse idee tugineb asjaolule, et veebibrauserites saab kasutada JavaScripti nii kasutajaliidese kuvamiseks, rakenduse loogika jooksutamiseks kui ka suhtluseks veebiserveriga.[4] Olemas on ka valmisjärgus avatud lähtekoodiga teegid, mis pakuvad üheleherakenduste arendajatele valmis koodipõhju, vähendades sedasi käsitsi kirjutatava JavaScripti mahtu.[5]

Tehnikad[muuda | muuda lähteteksti]

Selleks, et tagada brauseri käitumine, kus veebilehte ei vahetata ka serveriga suhtlemisel, on mitu võimalust.

Javascripti raamistikud[muuda | muuda lähteteksti]

Enamik veebilehitsejatele mõeldud JavaScripti raamistikke järgivad juba vaikimisi üheleherakenduste põhimõtteid.

  • AngularJS on täielikult kliendipoolne raamistik, mille mallifunktsionaalsus seisneb kahesuunalises kasutajaliidese andmete sidumises, mis omakorda võimaldab staatilise veebilehe sisu dünaamiliselt uuendada ilma serveri sekkumiseta.[6]
  • Knockout.js on kliendipoolne raamistik, mille mallid põhinevad MVVM-i (model-view-viewmodel) disainimustril. Selleks kasutatakse samuti andmete sidumist, kusjuures mustri VM-i (viewmodel) komponent on just mõeldud selleks, et keerulisemad programmaatilised objektid dünaamiliselt vaadeteks konverteerida.[7]
  • Aurelia on JavaScripti kliendiraamistik, mis sobib nii mobiili-, töölaua- kui ka veebirakenduste arenduseks. Aurelia sarnaneb kasutuselt AngularJSile, kuid on sellega võrreldes uuem, modulaarsem ning rangemalt standardiseeritud.[8]
  • Vue.js (ka Vue) on kasutajaliideste ehitamiseks mõeldud avatud lähtekoodiga progressiivne raamistik.[9]
  • React (lubatud ka kirjapildid React.js ja ReactJS) on samuti kasutajaliidestele mõeldud raamistik, mille korrashoiu eest vastutavad Facebook, Instagram ning iseseisvatest arendajatest ja korporatsioonidest koosnev kogukond.[10] React eeldab omaette programmeerimiskeele kasutust, mis on sisuliselt JavaScripti ja HTMLi segu.[11]

Ajax[muuda | muuda lähteteksti]

Ajax on käesoleval ajal tuntuim tehnika üheleherakenduste arenduses.[4] Peamiselt kasutatakse Ajaxi implementatsioonides JavaScripti XMLHttpRequesti objektiklassi, osadel juhtudel koos HTML-elementidega Iframe ja Script. Ajaxi levikut on eriti edendanud populaarsed teegid nagu jQuery, mis ühtlustavad Ajaxi käitumist eri veebibrauserites.[12]

WebSockets[muuda | muuda lähteteksti]

WebSockets on osa HTML5 spetsifikatsioonist, mis kirjeldab kahesuunalist reaalajas olekuga kliendi-serveri suhtluse tehnoloogiat. WebSocketsi tehnoloogia ületab Ajaxit jõudluselt ja lihtsuselt.[13]

Viited[muuda | muuda lähteteksti]

  1. Lawson, Katie. "What is a Single Page Application and why do people like them so much?". www.bloomreach.com. Vaadatud 29.11.2018. 
  2. "Inner-Browsing: Extending Web Browsing the Navigation Paradigm". developer.mozilla.org. Vaadatud 5.11.2018. 
  3. "US patent 8,136,109". www.google.com/patents. Vaadatud 5.11.2018. 
  4. 4,0 4,1 Flanagan, David, "JavaScript - The Definitive Guide", 5th ed., O'Reilly, Sebastopol, CA, 2006, p.497
  5. A., Sviatoslav. "The Best JS Frameworks for Front End". rubygarage.org. Vaadatud 29.11.2018. 
  6. "Angular Intorduction". docs.angularjs.org. Vaadatud 29.11.2018. 
  7. "KnockoutJS Intorduction". knockoutjs.com. Vaadatud 29.11.2018. 
  8. "Aurelia homepage". aurelia.io. Vaadatud 29.11.2018. 
  9. "Vue.js Introduction". vuejs.org. Vaadatud 29.11.2018. 
  10. Vitaly K.. "React vs Angular: Two Sides of JavaScript". Cleveroad.
  11. "React Documentation: Getting Started". reactjs.org. Vaadatud 29.11.2018. 
  12. Sotelo, Caleb. "Evolution of the Single Page Application — Part 2 of 2". paislee.io. Vaadatud 29.11.2018. 
  13. Puranik, Darshan G., Feiock, Dennis C., Hill, James H. "Real-Time Monitoring using AJAX and WebSockets". www.computer.org. Vaadatud 5.11.2018.