javascript e firebug per lo sviluppo web 3.0

9
Javascript e Firebug per lo sviluppo Web 3.0 Javascript e Firebug per lo sviluppo Web 3.0 Relatore Relatore Guido Brugnara Guido Brugnara LinuxDay 2013 – Rovereto, 26 ottobre LinuxDay 2013 – Rovereto, 26 ottobre Mozilla Firefox Firefox OS Protocol::Websocket Realtime Web Event Driven State Machine Messaging Internet of Things Dojo Toolkit Javascript Firebug http://www.laurencegellert.com/2011/11/realtime-web-is-this-web-3-0/

Upload: guido-brugnara

Post on 24-Jun-2015

148 views

Category:

Technology


2 download

DESCRIPTION

Presentazione al LinuxDAY 2013 presso l'Urban Center di Rovereto. Tecnologie e strumenti Open Source Web 3.0 per lo sviluppo Real Time distribuito, Internet of Things, automazione del territorio.

TRANSCRIPT

Page 1: Javascript e Firebug per lo sviluppo Web 3.0

Javascript e Firebug per lo sviluppo Web 3.0Javascript e Firebug per lo sviluppo Web 3.0 RelatoreRelatoreGuido BrugnaraGuido Brugnara

Lin

uxD

ay 2

013 

– R

over

eto,

 26 

otto

bre

Lin

uxD

ay 2

013 

– R

over

eto,

 26 

otto

bre

Mozilla Firefox

Firefox OS

Protocol::Websocket

Realtime Web

Event Driven

State Machine

Messaging

Internet of Things

Dojo Toolkit

Javascript

Firebug

http://www.laurencegellert.com/2011/11/realtime-web-is-this-web-3-0/

Page 2: Javascript e Firebug per lo sviluppo Web 3.0

Guido BrugnaraGuido BrugnaraJavascript e Firebug per lo sviluppo Web 3.0Javascript e Firebug per lo sviluppo Web 3.0L

inux

Day

 201

3 – 

Rov

eret

o, 2

6 ot

tobr

eL

inux

Day

 201

3 – 

Rov

eret

o, 2

6 ot

tobr

e

<script type=”text/javascript”> alert(“Ciao, mondo”);</script>

Con Firebug abbiamo a disposizione un completo ambiente di sviluppo conil quale è possibile: - tracciare gli errori - eseguire il codice javascript passo-passo - seguire il valore delle variabili - eseguire del codice “al volo” - ispezionare gli oggetti

Dimostrazione ...

ECMA-262 (standard ISO/IEC 16262:2011)JavaScript (Mozilla)JScript (Microsoft)ActionScript (Adobe)

Compatibilità con ECMA Script 5 http://kangax.github.io/es5-compat-table/

Page 3: Javascript e Firebug per lo sviluppo Web 3.0

Con Firebug è possibile analizzare

e modificare dinamicamente le

primitive grafiche SVG

Guido BrugnaraGuido BrugnaraJavascript e Firebug per lo sviluppo Web 3.0Javascript e Firebug per lo sviluppo Web 3.0L

inux

Day

 201

3 – 

Rov

eret

o, 2

6 ot

tobr

eL

inux

Day

 201

3 – 

Rov

eret

o, 2

6 ot

tobr

e

SVG (Scalable Vector Grafic)

http://html5demos.com/

Nota: WebGL è una libreria grafica per ildisegno 3D ma gli elementi graficinon sono accessibili dal DOM!

Dimostrazione ...

Page 4: Javascript e Firebug per lo sviluppo Web 3.0

­ sviluppo WYSIWYG­ assemblaggio drag & drop ­ “gira” nei browser­ desktop & mobile­ multipiattaforma­ genera codice modificabile­ HTML5 & CSS3­ OpenAjax Widget­ basata su Dojo Toolkit

Guido BrugnaraGuido BrugnaraJavascript e Firebug per lo sviluppo Web 3.0Javascript e Firebug per lo sviluppo Web 3.0L

inux

Day

 201

3 – 

Rov

eret

o, 2

6 ot

tobr

eL

inux

Day

 201

3 – 

Rov

eret

o, 2

6 ot

tobr

e

http://maqetta.org/

Editor HTML5 Open Source

Dimostrazione ...

Page 5: Javascript e Firebug per lo sviluppo Web 3.0

Firefox OS

Open Web! 

Guido BrugnaraGuido BrugnaraJavascript e Firebug per lo sviluppo Web 3.0Javascript e Firebug per lo sviluppo Web 3.0L

inux

Day

 201

3 – 

Rov

eret

o, 2

6 ot

tobr

eL

inux

Day

 201

3 – 

Rov

eret

o, 2

6 ot

tobr

e

ambiente di sviluppoper Desktop, Mobile,

Kiosk, Embedded,Server

Engine:Rhino (Java)

SpiderMonkey (C/C++)V8 (C++)

http://en.wikipedia.org/wiki/Comparison_of_server-side_JavaScript_solutions

Real TimeWeb

Web­Stomp  Websocket 

WebRTC

Page 6: Javascript e Firebug per lo sviluppo Web 3.0

Guido BrugnaraGuido BrugnaraJavascript e Firebug per lo sviluppo Web 3.0Javascript e Firebug per lo sviluppo Web 3.0L

inux

Day

 201

3 – 

Rov

eret

o, 2

6 ot

tobr

eL

inux

Day

 201

3 – 

Rov

eret

o, 2

6 ot

tobr

e

POE (Perl Object Environment)

Protocol::WebSocket

POE::Component::Server::TCP

Nell'articolo http://www.websocket.org/quantum.htmlvengono illustrati i risultati di performance confrontandoComet con Websocket.Si ottiene un incremento delle prestazioni di 500-1000/1e una riduzione di un fattore 3/1 nella latenza.

La tecnologia websocket comporta un’evoluzione notevoledelle applicazioni web real-time.

Specifica HTML5che definisce

un’interfaccia standardper la comunicazione

bidirezionaletra un client web

 e un server.

Fast Real Time

http://www.gironimo.org/webentwicklung/websockets-sockets-im-web.html CC-BY-SA

Dimostrazione ...

Websocket 

Page 7: Javascript e Firebug per lo sviluppo Web 3.0

Event Driven ­ Messages

Le interfacce grafiche sono “Event Driven” (programmazione a eventi)

I nodi della rete comunicano tra loro scambiandosi messaggiutilizzando dei server (Broker) oppure direttamente (Peer­to­peer)

I nodi “reagiscono” ai messaggi ricevuti generando a loro volta altri messaggi 

Si tratta di un paradigma di programmazionead Eventi Real­Time, distribuito in Rete

I nodi sono persone, server … ma anche“oggetti” … ovvero l'Internet delle cose.

 

Guido BrugnaraGuido BrugnaraJavascript e Firebug per lo sviluppo Web 3.0Javascript e Firebug per lo sviluppo Web 3.0L

inux

Day

 201

3 – 

Rov

eret

o, 2

6 ot

tobr

eL

inux

Day

 201

3 – 

Rov

eret

o, 2

6 ot

tobr

e

Page 8: Javascript e Firebug per lo sviluppo Web 3.0

Guido BrugnaraGuido BrugnaraJavascript e Firebug per lo sviluppo Web 3.0Javascript e Firebug per lo sviluppo Web 3.0L

inux

Day

 201

3 – 

Rov

eret

o, 2

6 ot

tobr

eL

inux

Day

 201

3 – 

Rov

eret

o, 2

6 ot

tobr

e

Stazione di sollevamento di Vela (TN)Esempio di interfaccia Real­Time

Linux

POE Perl

Dojo Toolkit

PostgreSql

Comet

Modbus

Firefox

http://www.slideshare.net/gdobr/perl-scada-dojo-hmi

Dimostrazione ...

Page 9: Javascript e Firebug per lo sviluppo Web 3.0

Grazie!

:­)

Leader.IT [email protected]. Ing. Guido Brugnara

Guido BrugnaraGuido BrugnaraJavascript e Firebug per lo sviluppo Web 3.0Javascript e Firebug per lo sviluppo Web 3.0L

inux

Day

 201

3 – 

Rov

eret

o, 2

6 ot

tobr

eL

inux

Day

 201

3 – 

Rov

eret

o, 2

6 ot

tobr

e

Rif:http://www.leader.it/Portal/LinuxDay2013