Ero sivun ”Javascript” versioiden välillä

Kohteesta DigiWiki
Siirry navigaatioon Siirry hakuun
(Ak: Uusi sivu: Visuaalisia kirjastoja: '''datatables''' ([http://datatables.net datatables.net]) on suosittu taulukirjasto. '''fancytree''' ([http://github.com/mar10/fancytree github.com - fancy...)
 
 
(7 välissä olevaa versiota samalta käyttäjältä ei näytetä)
Rivi 1: Rivi 1:
  
Visuaalisia kirjastoja: '''datatables''' ([http://datatables.net datatables.net]) on suosittu taulukirjasto. '''fancytree''' ([http://github.com/mar10/fancytree github.com - fancytree]) ja '''jstree''' ([http://jstree.com jstree.com]) esittävät hierarkian. '''d3js''' ([http://d3js.org d3js.org]) soveltuu laajojen tietomassojen visualisointiin. [http://grafana.org/ grafana.org] aikasarjojen grafiikkakirjasto.
+
 
 +
== Arkkitehtuureita ==
 +
 
 +
'''jQuery''' ([http://jquery.com jquery.com]) on selainriippumaton, modulaarinen (''core, ui/mobile ja 3. osapuolen pluginit'') abstraktiokirjasto joka helpottaa javascript-toteutuksen toteuttamista (dom-model, ajax, käyttöliittymän elementit - widgetit jne). Kummatkin - sekä jquery-ui, että jquery-mobile käyttävät perus jquery-kirjastoa ja tukevat ulkoasun teemoja jotka ovat sivustokohtaisesti räätälöitävissä.
 +
 
 +
Mobiiliversion on tarkoitus toimia myös työpöytäselaimilla, mutta sen toteutustapa poikkeaa merkittävästi jqueury-ui mallista teknisesti. Mobiilissa eri sivut rakennetaan samaan tiedostoon eri lohkoihin ja ladataan kerralla päätelaitteeseen ja sivunvaihdot tapahtuvat mobiilikirjaston suorittamana. Olemassaolevan sivuston muuttaminen mobiilikirjastolla toteutetuksi todennäköisesti vaatisi työlästä uudelleenorganisointia toteutustasolla edellä mainitussa lohkorakenteissa kuin sen toimintatavan eroavaisuuksissa ja siten sen toteuttamista suositellaan aloittamaan tyhjästä käyttämättä vanhaa, esimerkiksi jquery-ui sivustoa. Eroista vaadittava osaaminen vaatii myös toteuttajalta omaksumista tai kokonaan siihen perehtyneitä henkilöitä.
 +
 
 +
Mobiilikirjastolla tehdyt käyttöliittymät tuntuvat työpöydällä kärsivän mobiililaitteille tyypillisestä elemettien koko ruudun/selaimen leveydestä mikä ei toimi työpöydällä - siitäkin huolimatta, että tätä on pyritty huomioimaan kirjastossa. Ulkoasun poikkeavuudet ja edellä mainitut toteutustavan eroavaisuuksista johtuen näyttäisikin, että markkinoilla olevat saitit käyttävät mobiilikirjastoa ainoastaan mobiililaitteiden tukemiseen ja sivut ovat omassa m.example.com urlissa (''m dot site''). Lupaus yhtenäisestä teknisestä alustasta ei ole ainakaan vielä lyönyt itseään läpi. Tämä taas johtaa kahden eri järjestelmän ylläpitoon ja niiden kustannuksiin.
 +
 
 +
Mobiiliwebin vaihtoehto on toteuttaa palvelu työpöydälle optimoituna webinä ja mobiililaitteille tehdyllä mobiilisovelluksella.
 +
 
 +
* [http://demos.jquerymobile.com/ demos.jquerymobile.com] esimerkkejä mobiilin käyttöliittymäelementeistä
 +
* [http://demos.jquerymobile.com/1.4.5/rwd/ demos.jquerymobile.com - RWD] responsive web design, päätelaitteisiin mukautuva toteutus
 +
 
 +
'''Dojo mobile''' [https://dojotoolkit.org/ dojotoolkit.org]
 +
 
 +
'''JQ.Mobi''' [http://jqmobi.com/ jqmobi.com]
 +
 
 +
'''Sencha Touch''' [https://sencha.com/products/touch/ sencha.com - touch]
 +
 
 +
'''AngularJS''' [https://angularjs.org/ angularjs.org].
 +
 
 +
'''React''' [http://reactjs.com reactjs.com].
 +
 
 +
'''MEAN''' ([http://mean.io mean.io])
 +
 
 +
 
 +
== Visuaalisia kirjastoja ==
 +
'''datatables''' ([http://datatables.net datatables.net]) on suosittu taulukirjasto. '''fancytree''' ([http://github.com/mar10/fancytree github.com - fancytree]) ja '''jstree''' ([http://jstree.com jstree.com]) esittävät hierarkian. '''d3js''' ([http://d3js.org d3js.org]) soveltuu laajojen tietomassojen visualisointiin. [http://grafana.org/ grafana.org] aikasarjojen grafiikkakirjasto.
  
  
  
 
http://www.chartjs.org/ kuusi erillaista kuvaajatyyppiä, HTML5, avoin lisenssi,  
 
http://www.chartjs.org/ kuusi erillaista kuvaajatyyppiä, HTML5, avoin lisenssi,  
 +
 +
https://www.highcharts.com näyttäviä kuvaaji ja karttoja, kaupallinen kirjasto.
 +
 +
'''Grafana''' ([https://grafana.com grafana.com]) kysely, visualisointi ja hälytyksiä tukeva javascript kirjasto. Sisäänrakennettu Graphite-kyselyparseri.
 +
 +
'''ThreeJS''' ([https://threejs.org/ threejs.org], [https://en.wikipedia.org/wiki/Three.js en.wikipedia.org]) kirjasto animoituun 3D-visualisointiin.
  
 
https://public.tableau.com/s/
 
https://public.tableau.com/s/
Rivi 10: Rivi 44:
 
http://arborjs.org/ verkkojen visualisointikirjasto
 
http://arborjs.org/ verkkojen visualisointikirjasto
  
Lisää: http://selection.datavisualization.ch/
+
https://plot.ly/
  
Vue.js  
+
== PKI.js ==
 +
 
 +
https://pkijs.org/
 +
 
 +
== Vue.js ==
  
 
* https://vuejs.org/
 
* https://vuejs.org/
 +
 +
== Web Cryptography ==
 +
* http://caniuse.com/#feat=cryptography
 +
* [[WebCryptoAPI]]
 +
 +
== Aiheesta muualla ==
 +
* http://selection.datavisualization.ch/
  
 
[[Luokka:Tekniikka]]
 
[[Luokka:Tekniikka]]

Nykyinen versio 13. elokuuta 2018 kello 08.47


Arkkitehtuureita

jQuery (jquery.com) on selainriippumaton, modulaarinen (core, ui/mobile ja 3. osapuolen pluginit) abstraktiokirjasto joka helpottaa javascript-toteutuksen toteuttamista (dom-model, ajax, käyttöliittymän elementit - widgetit jne). Kummatkin - sekä jquery-ui, että jquery-mobile käyttävät perus jquery-kirjastoa ja tukevat ulkoasun teemoja jotka ovat sivustokohtaisesti räätälöitävissä.

Mobiiliversion on tarkoitus toimia myös työpöytäselaimilla, mutta sen toteutustapa poikkeaa merkittävästi jqueury-ui mallista teknisesti. Mobiilissa eri sivut rakennetaan samaan tiedostoon eri lohkoihin ja ladataan kerralla päätelaitteeseen ja sivunvaihdot tapahtuvat mobiilikirjaston suorittamana. Olemassaolevan sivuston muuttaminen mobiilikirjastolla toteutetuksi todennäköisesti vaatisi työlästä uudelleenorganisointia toteutustasolla edellä mainitussa lohkorakenteissa kuin sen toimintatavan eroavaisuuksissa ja siten sen toteuttamista suositellaan aloittamaan tyhjästä käyttämättä vanhaa, esimerkiksi jquery-ui sivustoa. Eroista vaadittava osaaminen vaatii myös toteuttajalta omaksumista tai kokonaan siihen perehtyneitä henkilöitä.

Mobiilikirjastolla tehdyt käyttöliittymät tuntuvat työpöydällä kärsivän mobiililaitteille tyypillisestä elemettien koko ruudun/selaimen leveydestä mikä ei toimi työpöydällä - siitäkin huolimatta, että tätä on pyritty huomioimaan kirjastossa. Ulkoasun poikkeavuudet ja edellä mainitut toteutustavan eroavaisuuksista johtuen näyttäisikin, että markkinoilla olevat saitit käyttävät mobiilikirjastoa ainoastaan mobiililaitteiden tukemiseen ja sivut ovat omassa m.example.com urlissa (m dot site). Lupaus yhtenäisestä teknisestä alustasta ei ole ainakaan vielä lyönyt itseään läpi. Tämä taas johtaa kahden eri järjestelmän ylläpitoon ja niiden kustannuksiin.

Mobiiliwebin vaihtoehto on toteuttaa palvelu työpöydälle optimoituna webinä ja mobiililaitteille tehdyllä mobiilisovelluksella.

Dojo mobile dojotoolkit.org

JQ.Mobi jqmobi.com

Sencha Touch sencha.com - touch

AngularJS angularjs.org.

React reactjs.com.

MEAN (mean.io)


Visuaalisia kirjastoja

datatables (datatables.net) on suosittu taulukirjasto. fancytree (github.com - fancytree) ja jstree (jstree.com) esittävät hierarkian. d3js (d3js.org) soveltuu laajojen tietomassojen visualisointiin. grafana.org aikasarjojen grafiikkakirjasto.


http://www.chartjs.org/ kuusi erillaista kuvaajatyyppiä, HTML5, avoin lisenssi,

https://www.highcharts.com näyttäviä kuvaaji ja karttoja, kaupallinen kirjasto.

Grafana (grafana.com) kysely, visualisointi ja hälytyksiä tukeva javascript kirjasto. Sisäänrakennettu Graphite-kyselyparseri.

ThreeJS (threejs.org, en.wikipedia.org) kirjasto animoituun 3D-visualisointiin.

https://public.tableau.com/s/

http://arborjs.org/ verkkojen visualisointikirjasto

https://plot.ly/

PKI.js

https://pkijs.org/

Vue.js

Web Cryptography

Aiheesta muualla