Il web 2.0

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

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

Web 3.0 Cosa è?

Web 3.0

Web 2.0

Foveate Animal
shape from: IntensitiesCM

50

100

150

200

250

300

350

400

100 200 300 400 500 600 700 800

Isteresi della Scelta

Fenomeno

Isteresi

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

Statistica Inferenziale

La statistica

Il modello di regressione

t-test

ANOVA

Il futuro del Web 3.0

In pillole

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

L’albero Tecnologico

Teorema di Bayes
Neural network

Pattern Recognition
Statistica inferenziale
SVM

Text Mining

Genetic Algorithm Natural Language

Web Advertising Web Semantico

I 4 Gironi del Web 2.0

Internet un Business Infernale

Internet un Business infernale

Design Pattern

Java & .NET

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

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; }
}

Ricordiamoci che

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

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++); }
};

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)

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

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

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
}

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!!!

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

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)

Aspect Oriented
Programming

Due cenni

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

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

La soluzione

Visitor <<interface>
Application + enrichSQL(DatabaseHelper)

PostgreSQLVisitor MSSQLVisitor
DatabaseHelper

+getXXX

Proxy vs Facade

Facade Proxy

Bridge vs Adapter

Bridge Adapter

 Astrazione della classe  E’ un Wrapper

 Il driver JDBC

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)

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

Model View Controller

Meno male!

In sintesi

Java J2EE 1 MVC

 View: JSP
 Model: Object
 Controller: Servlet

In sintesi

Java J2EE 5 MVC

 View: JSF/JSP
 Model: Object
 Controller:
Handler/WorkFlow

In sintesi

.NET MVC

 View: ASPX
 Model:
Object/DataSource
 Controller:
Controller ASCX

Un po’ più complesso Una vista migliore!

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

Web.xml
 
<context-param>
<param-name>org.richfaces.SKIN</param-name>
<param-value>blueSky</param-value>
</context-param>

<context-param>
<param-name>org.richfaces.CONTROL_SKINNING</param-name>
<param-value>enable</param-value>
</context-param>

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

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>

Analisi

Vantaggi Svantaggi

 Separazione della View dal  Un piccolo cambio è un
suo controllo grande cambio
 Maggiore efficienza  Utilizzo di risorse

Perché AJAX?

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

Frameworks

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

Caricamento

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

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

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”
));
});

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);
}
});

Unit Testing

Non solo test funzionali

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

Il Web 2.0

giacomo.veneri@etinnova.it
g.veneri@unisi.it

Giacomo Veneri

Il web 2.0

More Related Content

Similar to Il web 2.0 (20)

More from Giacomo Veneri (12)

Il web 2.0