il web 2.0

65
Il web 2.0 Giacomo Veneri

Upload: giacomo-veneri

Post on 26-May-2015

448 views

Category:

Documents


1 download

TRANSCRIPT

Page 1: Il web 2.0

Il web 2.0 Giacomo Veneri

Page 2: Il web 2.0

Summary

IntroduzioneI concetti del Web 3I rischi del Web 2 (i 4 gironi)Programming by Pattern (parlare lo stesso

linguaggio)Aspect Object Programming

MVC applicato a Java e .NETSOA/Ajax frameworks

Page 3: Il web 2.0

Web

1 HTML, HTTP, XML

RDB,

PSTN

Web

2.0 AJAX, RIA

WS o Servizi Integrati

Social Network

Web

3.0 IA,

Il Web Semantico

GeoSpatial

(il 3D??)

Web 2.0 > Web 3.0 Verso il 3.0

Page 4: Il web 2.0

Web 3.0 Cosa è?

Web 3.0

Autenticazio

ne Integrata

Web 2.0

Social Net

AJAX e affini

?

Tag C

louding

Page 5: Il web 2.0

Saliency Map

Page 6: Il web 2.0

Foveate Animal

shape from: IntensitiesCM

100 200 300 400 500 600 700 800

50

100

150

200

250

300

350

400

Page 7: Il web 2.0

Esperimento 1

Page 8: Il web 2.0

V1 Area

Page 9: Il web 2.0

Isteresi della Scelta

Fenomeno

Page 10: Il web 2.0
Page 11: Il web 2.0
Page 12: Il web 2.0
Page 13: Il web 2.0
Page 14: Il web 2.0
Page 15: Il web 2.0

Isteresi

Passare da tristi ad allegri non è come passare da allegri a tristi

allegria

tristezza

Page 16: Il web 2.0

Statistica Inferenziale

La statistica

Page 17: Il web 2.0

Il modello di regressione

t-test

ANOVA

Page 18: Il web 2.0

Il futuro del Web 3.0

In pillole

Page 19: Il web 2.0

Il web Semantico e Intelligente

Natural LanguageOntologie OWLPattern Recognition

Inferenza Bayesian

Human Computer InteractionSmartPhone e STBInserimento Username e Pwd => SSON

Uno studio del 2008 dimostro’ che uno dei più grossi impedimenti dei siti basati su AJAX er la’bailitazione javascript nei browser

Page 20: Il web 2.0

L’albero Tecnologico

Teorema di Bayes

Statistica inferenziale

Pattern Recognition

Neural network

SVM

Text Mining

Natural LanguageGenetic Algorithm

Web SemanticoWeb Advertising

Page 21: Il web 2.0

I 4 Gironi del Web 2.0

Internet un Business Infernale

Page 22: Il web 2.0

Internet un Business infernale

Page 23: Il web 2.0

Design Pattern

Java & .NET

Page 24: Il web 2.0

Pattern

SingletonFlyweightThread pool patternObject PoolChain of ResponsabilityAdapterBridgeProxyFacadeObserverListenerMementoMVC

Page 25: Il web 2.0

Singleton («staticone»)

Descrizione

Consiste nel creare una istanza di classe unica per tutto il contesto dell’applicazione senza doverla passare tra i metodi

Ad esempio l’helper che accede ai database

C#

static Singleton instance=null;

Singleton() { }

public static Singleton Instance {

get { if (instance==null) { instance = new

Singleton(); } return instance; }

}

Page 26: Il web 2.0

Ricordiamoci che

Il Web è MultiThread!Un Thread è

concorrente con un altro Thread

Un Application Server gestisce l’applicazione con un Pattern detto Container

Page 27: Il web 2.0

Il ThreadLocal

// C#ThreadLocal<string> ThreadName = new ThreadLocal<string>(() => { return "Thread" + Thread.CurrentThread.ManagedThreadId; });

// Javaprivate static int nextSerialNum = 0;

private static ThreadLocal serialNum = new ThreadLocal() { protected synchronized Object initialValue() { return new Integer(nextSerialNum++); } };

Page 28: Il web 2.0

Flyweight

Flyweight è un Design pattern che permette di separare la parte variabile di una classe dalla parte che può essere riutilizzata, in modo tale da poter avere quest'ultima condivisa fra istanze differenti della parte variabile.

Modo Pulito: ad esempio per contenere delle informazioni comuni a diverse classi senza doverle istanziare tutte le volte. (Ex. La gestione di un Pool di configurazioni statiche per la classe)

Modo Sporco: per contenere informazioni ridondanti utili per l’efficienza. (Ex. Il figlio che si riferisce al padre e viceversa)

Page 29: Il web 2.0

Thread Pool patternObject Pool

Thread pool pattern: avere una lista di thread in cache che giriamo senza dovere necessariamente ricrearlo tutte le volte

Object pool pattern: avere una lista di oggetti in cache che modifichiamo senza dover sempre ricrearli migliorando l’efficienza

Page 30: Il web 2.0

L’efficienza non è come sembra!

kCal consumate da una persona per alzare un peso di 1Kg di 1Metro è l’80% di quello di una macchina a gasolio

Il garbage collector gioca brutti scherzi

Page 31: Il web 2.0

Lazy initialization

La Lazy initialization ("inizializzazione pigra") è la tattica di instanziare un oggetto solo nel momento in cui deve essere usato per la prima volta.

Utilizzato da Hibernate, JPA

static Singleton instance=null;

Singleton() { }

public static Singleton Instance {

get { if (instance==null) { instance = new

Singleton(); } return instance; }

}

Page 32: Il web 2.0

Il GC

Di solito è basato su 3 contenitori di memoria (tri-colour marking) di volta in volta che un oggetto diventa «anziano» viene spostato in un aria di memoria che viene ripulità più raramente

Mai forzarlo!System.gc()

L'impatto sulle prestazioni causate dal GC è apparentemente casuale e difficile da prevedere.

Un Object Pool farà invecchiare i vostri oggetti!!!

Page 33: Il web 2.0

Listener vs Observer

E’ un ascoltatore in grado di registrare eventi.

Il Listener è passivo

L'Observer ("osservatore") definisce una dipendenza uno a molti fra oggetti diversi, in maniera tale che se un oggetto cambia il suo stato, tutti gli oggetti dipendenti vengono notificati del cambiamento avvenuto e possono aggiornarsi.

L’Observer è Attivo

Page 34: Il web 2.0

Il Visitor

Il Visitor ("visitatore") permette di separare un algoritmo dalla struttura di oggetti composti a cui è applicato, in modo da poter aggiungere nuovi comportamenti senza dover modificare la struttura stessa. (wikipedia)

Immaginiamo di avere un (Database) Helper che recupera una lunga lista di oggetti e li vuole paginare sfruttano i costrutti SQL specifici per la versione del DB.

Utiliziamo un Visitor od un Observer?

Page 35: Il web 2.0

Aspect Oriented Programming

Due cenni

Page 36: Il web 2.0

AOP L’aspetto

Page 37: Il web 2.0

AOP

La programmazione orientata agli aspetti è un paradigma di programmazione basato sulla creazione di entità software - denominate aspetti - che sovrintendono alle interazioni fra oggetti finalizzate ad eseguire un compito comune. Il vantaggio rispetto alla tradizionale Programmazione orientata agli oggetti consiste nel non dover implementare separatamente in ciascun oggetto il codice necessario ad eseguire questo compito comune.

LoggingSecurity

Page 38: Il web 2.0

AspectJ

Se ne definisce l’aspetto e poi si definisce il punto di entrata.

pointcut set() : execution(* set*(*) ) && this(Point) && within(com.company.*);

aspect Logger {

void Bank.transfer(Account fromAcc, Account toAcc, int amount, User user, Logger logger) {

logger.info("transferring money...");}

}

aspect DisplayUpdate {

void Point.acceptVisitor(Visitor v) { v.visit(this); }

// other crosscutting code... }

Page 39: Il web 2.0

La soluzione

ApplicationVisitor <<interface>+ enrichSQL(DatabaseHelper)

PostgreSQLVisitor MSSQLVisitor DatabaseHelper

+getXXX

Page 40: Il web 2.0

Proxy vs Facade

Facade Proxy

Page 41: Il web 2.0

Bridge vs Adapter

Bridge

Astrazione della classe

Il driver JDBC

Adapter

E’ un Wrapper

Page 42: Il web 2.0

Chain of Responsability

Il pattern permette di separare gli oggetti che invocano richieste dagli oggetti che le gestiscono dando ad ognuno la possibilità di gestire queste richieste. Viene utilizzato il termine catena perché di fatto il la richiesta viene inviata e "segue la catena" di oggetti, passando da uno all'altro, finché non trova quello che la gestisce. (WikiPedia)

Page 43: Il web 2.0

MVC («il» pattern architetturale del WEB)

Model-View-Controller (abbreviato spesso in MVC), che consiste nel separare i componenti software che implementano il modello delle funzionalità di business (model), dai componenti che implementano la logica di presentazione (view) e da quelli di controllo che tali funzionalità utilizzano (controller).

Page 44: Il web 2.0

Model View Controller

Meno male!

Page 45: Il web 2.0

MVC Cosa è?

Page 46: Il web 2.0

In sintesi

Java J2EE 1

View: JSPModel: ObjectController: Servlet

MVC

Page 47: Il web 2.0

In sintesi

Java J2EE 5

View: JSF/JSPModel: ObjectController:

Handler/WorkFlow

MVC

Page 48: Il web 2.0

In sintesi

.NET

View: ASPXModel:

Object/DataSourceController:

Controller ASCX

MVC

Page 49: Il web 2.0

Un po’ più complesso Una vista migliore!

Page 50: Il web 2.0

Richfaces / Ajax4JSF

Agiscono solo sulla viewSi deve solo configurare una servlet in web.xml Non funzionano bene su Tomcat ma solo su

Glassfishhttp://docs.jboss.org/richfaces

sostituite il veccio command button jsf con

<a4j:commandButton value="do" reRender="table" action="#{myHandler.myAction}" id="button"/>

non fate altro non è necessario, assicuratevi solo che il componente da riaggiornare abbia l'id corretto (in questo caso "table").

Page 51: Il web 2.0

Web.xml

<!-- Plugging the "Blue Sky" skin into the project --><context-param>   <param-name>org.richfaces.SKIN</param-name>   <param-value>blueSky</param-value></context-param>

<!-- Making the RichFaces skin spread to standard HTML controls --><context-param>      <param-name>org.richfaces.CONTROL_SKINNING</param-name>      <param-value>enable</param-value></context-param> <!-- Defining and mapping the RichFaces filter --><filter>    <display-name>RichFaces Filter</display-name>    <filter-name>richfaces</filter-name>    <filter-class>org.ajax4jsf.Filter</filter-class> </filter>   <filter-mapping>    <filter-name>richfaces</filter-name>    <servlet-name>Faces Servlet</servlet-name>   <dispatcher>REQUEST</dispatcher>   <dispatcher>FORWARD</dispatcher>   <dispatcher>INCLUDE</dispatcher></filter-mapping>

Page 52: Il web 2.0

Asp.NET AJAX

Script Manager: è il controllo responsabile della gestione delle risorse script usate dai componenti client, per l’aggiornamento parziale delle pagine, per la localizzazione e altre funzionalità eventualmente introdotte da nostre customizzazioni. Da questo dipendono altri controlli per i quali la sua presenza è indispensabile. In particolare l’Update Panel, l’Update Progress e il Timer non ne possono prescindere.

Update Panel: permette di aggiornare una parte di una pagina web invece dell’intera pagina.

Update Progress: fornisce un’indicazione sullo stato di aggiornamento di una parte di pagina gestita tramite un controllo Update Panel.

Timer: garantisce l’avvio di un’operazione di post-back a intervalli di tempo predefiniti. Unitamente al controllo Update Panel può limitare l’operazione di aggiornamento alla sola parte contenuta nell’update panel.

<asp:UpdatePanel ID="MyUpdate" runat="server"><ContentTemplate>

  <asp:TextBox ID="txtRicerca" runat="server" />

  <asp:Label ID="lblRisultato" runat="server" Font-Bold="True" />

  <asp:LinkButton ID="LinkButton1" runat="server" OnClick="LinkButton1_Click">    Invia  </asp:LinkButton>

  <asp:UpdateProgress ID="UpdateProgress1" runat="server">    <ProgressTemplate>      Attendere, richiesta in corso ...    </ProgressTemplate>  </asp:UpdateProgress>

</ContentTemplate></asp:UpdatePanel>

Page 53: Il web 2.0

Analisi

Vantaggi

Separazione della View dal suo controllo

Maggiore efficienza

Svantaggi

Un piccolo cambio è un grande cambio

Utilizzo di risorse

Page 54: Il web 2.0

Perché AJAX?

L’HTTP è asincrono!!!Attacca e stacca la connessione.

Page 55: Il web 2.0

Other AJAX framework

Page 56: Il web 2.0

Frameworks

jQuery, jQuery UI, prototype, script.aculo.us, MooTools DojoGoogle Libraries API (carica jQuery)

Page 57: Il web 2.0

Caricamento

Google Libraries API - Developer's Guide <script

src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

Page 58: Il web 2.0

JQuery

Javascript

In Javascript la base è accedere ad un elemento del DOM

Code Sippet

$("a"); tutti i link nel documento

$("#id"); seleziona un singolo elemento con id «id»

$("input[type=‘hidden']");

$("#id").each(function () { var id = this.id; }); ciclare

Page 59: Il web 2.0

Manipolare il contenuto

Javascript

La funzione bind permette di gestire gli eventi

Tramite unbind si possono rimuovere le associazioni

Code snippet

$("p").text(); testo del paragrafo

$("p").html(); "testo del <strong>paragrafo</strong>«

$("a").bind("click",function (event) {

alert($(this).attr("href”));

});

Page 60: Il web 2.0

AJAX

AJAX

La chiamata ajax è molto compatta

Code Snippet

$.ajax({    url : "servente.html",    success : function (data,state) {     $("#risultato").html(data);    $("#stato").text(stato);    },    error : function (req,state,error) {    alert("catch event"+stato);    }});

Page 61: Il web 2.0

Unit Testing

Non solo test funzionali

Page 62: Il web 2.0

Unit Testing

Nella Programmazione informatica, lo unit testing è una procedura usata per verificare singole parti di un codice sorgente.

Eseguire il test (offline) della persistenza, della business logic, della sicurezza….dell’interfaccia

JavaJunitEclipse

.NETNunit

Visual Studio 2010

Page 63: Il web 2.0

Visual Studio 2010

Page 64: Il web 2.0

Unit Test

Page 65: Il web 2.0

Il Web 2.0

[email protected]@unisi.it

Giacomo Veneri