1. Il web 2.0 Giacomo Veneri

2. Summary
 Introduzione
 I concetti del Web 3
 I rischi del Web 2 (i 4 gironi)
 Programming by Pattern (parlare lo stesso
linguaggio)
 Aspect Object Programming
 MVC applicato a Java e .NET
 SOA/Ajax frameworks

3. Web 2.0 > Web 3.0 Verso il 3.0
Web 1
Web 2.0
Web 3.0
HTML, AJAX, RIA IA,
HTTP, WS o Il Web
XML Servizi Semantico
RDB, Integrati GeoSpatial
PSTN Social (il 3D??)
Network

4. Web 3.0 Cosa è?
Web 3.0
Web 2.0

5. Saliency Map

6. Foveate Animal
shape from: IntensitiesCM
50
100
150
200
250
300
350
400
100 200 300 400 500 600 700 800

7. Esperimento 1

8. V1 Area

9. Isteresi della Scelta
Fenomeno

15. Isteresi
 Passare da tristi ad
allegria
allegri non è come
passare da allegri a
tristi
tristezza

16. Statistica Inferenziale
La statistica

17. Il modello di regressione
t-test
ANOVA

18. Il futuro del Web 3.0
In pillole

19. Il web Semantico e Intelligente
 Natural Language
 Ontologie OWL
 Pattern Recognition
 Inferenza Bayesian
 Human Computer Interaction
 SmartPhone e STB
 Inserimento 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

20. L’albero Tecnologico
Teorema di Bayes
Neural network
Pattern Recognition
Statistica inferenziale
SVM
Text Mining
Genetic Algorithm Natural Language
Web Advertising Web Semantico

21. I 4 Gironi del Web 2.0
Internet un Business Infernale

22. Internet un Business infernale

23. Design Pattern
Java & .NET

24. Pattern
 Singleton
 Flyweight
 Thread pool pattern
 Object Pool
 Chain of Responsability
 Adapter
 Bridge
 Proxy
 Facade
 Observer
 Listener
 Memento
 MVC

25. Singleton («staticone»)
Descrizione C#
static Singleton
 Consiste nel creare una instance=null;
istanza di classe unica per
tutto il contesto Singleton() { }
dell’applicazione senza public static Singleton
doverla passare tra i Instance {
metodi
get {
 Ad esempio l’helper che if (instance==null) {
accede ai database instance = new
Singleton(); }
return instance; }
}

26. Ricordiamoci che
 Il Web è MultiThread!
 Un Thread è
concorrente con un
altro Thread
 Un Application Server
gestisce l’applicazione
con un Pattern detto
Container

27. Il ThreadLocal
// C#
ThreadLocal<string> ThreadName = new
ThreadLocal<string>(() => {
return "Thread" +
Thread.CurrentThread.ManagedThreadId; }
);
// Java
private static int nextSerialNum = 0;
private static ThreadLocal serialNum = new ThreadLocal() {
protected synchronized Object initialValue() {
return new Integer(nextSerialNum++); }
};

28. 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)

29. Thread Pool pattern
Object 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

30. 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

31. Lazy initialization
 La Lazy initialization
static Singleton
instance=null;
("inizializzazione
pigra") è la tattica di
Singleton() { }
instanziare un oggetto
public static Singleton solo nel momento in
Instance {
cui deve essere usato
get { per la prima volta.
if (instance==null) {
instance = new  Utilizzato da Hibernate,
Singleton(); }
return instance; } JPA
}

32. Il GC
 Di solito è basato su 3  Mai forzarlo!
contenitori di memoria  System.gc()
(tri-colour marking) di
volta in volta che un  L'impatto sulle
oggetto diventa prestazioni causate dal
«anziano» viene GC è apparentemente
spostato in un aria di casuale e difficile da
memoria che viene prevedere.
ripulità più raramente
Un Object Pool farà invecchiare i
vostri oggetti!!!

33. Listener vs Observer
 E’ un ascoltatore in  L'Observer
grado di registrare ("osservatore") definisce
eventi. una dipendenza uno a
 Il Listener è passivo 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

34. Il Visitor
 Il Visitor ("visitatore")  Immaginiamo di avere
permette di separare un (Database) Helper
un algoritmo dalla che recupera una
struttura di oggetti lunga lista di oggetti e
composti a cui è li vuole paginare
applicato, in modo da sfruttano i costrutti
poter aggiungere nuovi SQL specifici per la
comportamenti senza versione del DB.
dover modificare la  Utiliziamo un Visitor od
struttura stessa. un Observer?
(wikipedia)

35. Aspect Oriented
Programming
Due cenni

36. AOP L’aspetto

37. 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.
 Logging
 Security

38. 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... }

39. La soluzione
Visitor <<interface>
Application + enrichSQL(DatabaseHelper)
PostgreSQLVisitor MSSQLVisitor
DatabaseHelper
+getXXX

40. Proxy vs Facade
Facade Proxy

41. Bridge vs Adapter
Bridge Adapter
 Astrazione della classe  E’ un Wrapper
 Il driver JDBC

42. 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)

43. 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).

44. Model View Controller
Meno male!

45. MVC Cosa è?

46. In sintesi
Java J2EE 1 MVC
 View: JSP
 Model: Object
 Controller: Servlet

47. In sintesi
Java J2EE 5 MVC
 View: JSF/JSP
 Model: Object
 Controller:
Handler/WorkFlow

48. In sintesi
.NET MVC
 View: ASPX
 Model:
Object/DataSource
 Controller:
Controller ASCX

49. Un po’ più complesso Una vista migliore!

50. Richfaces / Ajax4JSF
 Agiscono solo sulla view
 Si deve solo configurare una servlet in web.xml
 Non funzionano bene su Tomcat ma solo su
Glassfish
 http://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").

51. 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>

52. Asp.NET AJAX
 Script Manager: è il controllo responsabile <asp:UpdatePanel ID="MyUpdate"
della gestione delle risorse script usate dai runat="server">
componenti client, per l’aggiornamento <ContentTemplate>
parziale delle pagine, per la localizzazione
e altre funzionalità eventualmente introdotte <asp:TextBox ID="txtRicerca" runat="server"
da nostre customizzazioni. Da questo />
dipendono altri controlli per i quali la sua
presenza è indispensabile. In particolare <asp:Label ID="lblRisultato" runat="server"
l’Update Panel, l’Update Progress e il Timer Font-Bold="True" />
non ne possono prescindere.
 Update Panel: permette di aggiornare una
parte di una pagina web invece dell’intera <asp:LinkButton ID="LinkButton1"
pagina. runat="server" OnClick="LinkButton1_Click">
Invia
 Update Progress: fornisce un’indicazione </asp:LinkButton>
sullo stato di aggiornamento di una parte di
pagina gestita tramite un controllo Update <asp:UpdateProgress ID="UpdateProgress1"
Panel. runat="server">
 Timer: garantisce l’avvio di un’operazione <ProgressTemplate>
di post-back a intervalli di tempo predefiniti. Attendere, richiesta in corso ...
Unitamente al controllo Update Panel può </ProgressTemplate>
limitare l’operazione di aggiornamento alla </asp:UpdateProgress>
sola parte contenuta nell’update panel.
</ContentTemplate>
</asp:UpdatePanel>

53. Analisi
Vantaggi Svantaggi
 Separazione della View dal  Un piccolo cambio è un
suo controllo grande cambio
 Maggiore efficienza  Utilizzo di risorse

54. Perché AJAX?
 L’HTTP è asincrono!!!
 Attacca e stacca la connessione.

55. Other AJAX framework

56. Frameworks
 jQuery,
 jQuery UI,
 prototype,
 script.aculo.us,
 MooTools
 Dojo
 Google Libraries API (carica jQuery)

57. Caricamento
 Google Libraries API - Developer's Guide
 <script
src="https://ajax.googleapis.com/ajax/libs/jquery/1.
4.2/jquery.min.js"></script>

58. JQuery
Javascript Code Sippet
 In Javascript la base è  $("a");
 tutti i link nel documento
accedere ad un elemento
 $("#id");
del DOM  seleziona un singolo
elemento con id «id»
 $("input[type=‘hidden']");
 $("#id").each(function () {
var id = this.id; });
 ciclare

59. Manipolare il contenuto
Javascript Code snippet
 $("p").text();
 La funzione bind permette
 testo del paragrafo
di gestire gli eventi  $("p").html();
 Tramite unbind si possono  "testo del
<strong>paragrafo</strong>«
rimuovere le associazioni
 $("a").bind("click",function
(event) {
alert($(this).attr("href”
));
});

60. AJAX
AJAX Code Snippet
 La chiamata $.ajax({
url : "servente.html",
ajax è molto
success : function
compatta (data,state) {
$("#risultato").html(data);
$("#stato").text(stato);
},
error : function
(req,state,error) {
alert("catch event"+stato);
}
});

61. Unit Testing
Non solo test funzionali

62. 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
 Java
 Junit
 Eclipse
 .NET
 Nunit
 Visual Studio 2010

63. Visual Studio 2010

64. Unit Test

65. Il Web 2.0
giacomo.veneri@etinnova.it
g.veneri@unisi.it
Giacomo Veneri