Articoli con Tag ‘Javascript’
È successo alla TV di trasformarsi in Net TV, come già era successo alla Radio di diventare Net Radio, per non parlare della musica! Ora, come anticipato in altri Post, è ufficiale anche per il Software di trasformarsi a breve in Net Software!
Adobe, che come sappiamo ha da poco acquisito Macromedia, ufficializza le Web Application – del Web 2.0 – in vere e proprie RIA (Rich Internet Applications) con l’annuncio di voler portare sul Web il noto software di fotoritocco Photoshop. È recente l’accordo tra Adobe e Photobucket per rendere disponibile online una tecnologia per l’editing e il remix video. Grazie alla nuova tecnologia sviluppata per Flash 9, con ActionScript 3.0, Adobe punta in alto, anticipando che entro sei mesi sarà disponibile online una versione di Photoshop basata, appunto, su tecnologia Flash.
Effettivamente le nuove potenzialità di ActionScript 3.0 (che coinvolgono progetti come Flex e Apollo – vedi anche Web2.0: Adobe ci prova con Apollo e Ajax: Rich Internet Application) lo rendono il candidato perfetto per l’implementazione di vere RIA sul Web. Ajax, dal canto suo, si vede spodestato dal suo trono in questo nuovo scenario. Nonostante gli innumerevole Framework Ajax, alcuni di ottimo livello, prodotti nel corso di questi ultimi anni, Flash garantisce un’ambiente più evoluto e semplice da manipolare. Inoltre parliamo di uno dei Plugin più diffuso al mondo: Flash ha infatti alle spalle qualche anno in più rispetto ad Ajax e derivati.
Inoltre risulta ovvio che Adobe scelga Flash, essendo oramai lui il produttore. Tuttavia ci sono da considerate questioni tecniche che possono – ad oggi – essere risolte in modo armonico unicamente ricorrendo a tecnologie come quella Flash. Dando uno sguardo al nuovo ActionScript 3.0 ci si rendo subito conto delle enormi possibilità di sviluppo che offre questa nuova piattaforma. Lo standard ECMA del linguaggio e i nuovi oggetti messi a disposizione dal Framework, permettono di arrivare ad un livello di dettaglio impensabile con le precedenti versioni di Flash: una su tutte, ad esempio, la possibilità di accedere ai dati Bitmap di un’immagine caricata da disco!
L’attacco da parte di Adobe sembra svolgerersi quindi su due fronti distinti che hanno in comune la tecnologia Flash (che ricordiamo ha da sempre la capacità di interagire attivamente con il browser e quindi con Javascript lato Client e Scripting lato Server).
Il primo attacco avviene dall’esterno, sul versante browser, dove la tecnologia Apollo si propone di fatto come alternativa ai Kernel usuali delle diverse piattoforme oggi disponibili (Windows, Mac OS, Linux, ecc…); usare Adobe Apollo, quindi, al posto del browser per ottenere prestazioni e applicazioni (vere e proprie RIA) impensabili, aggirando così le incompatibilità tra Internet Explorer, FireFox e compagnia. Inoltre Apollo garantisce una piattaforma unica di sviluppo, al pari di Javascript-Ajax, ma senza i problemi di compatibilità. Quest’ultimo punto è uno scacco notevole a tecnologie come Ajax che ancora oggi soffrono enormemente delle questioni legate alla compatibilità tra browser; non dimentichiamo, inoltre, tutta la questione legata alla resa (rendering) grafica dei CSS!
L’altro attacco avviene direttamente dall’interno, colpendo i Framework Ajax con la carta Flash. L’elemento vincente in questa strategia risiede nell’uso di Flash, della tecnologia Flash, che trova applicazione sia in Flex, sia in Apollo, sia in versione standalone come già siamo abituati a vedere (semplici file SWF per intenderci)! Non c’è dubbio che tale scenario è estremamente invitante per gli sviluppatori, Web e non. Ciò che realizzo in Flash diventa immediatamente riusabile in vari modi, senza costringermi a modificare una sola riga di codice e, inoltre, senza preoccuparmi della compatibilità!
Tutto questo, a mio avviso, è un’importante passo avanti, una svolta di proporzioni notevoli che coinvolge anche il mondo dei giochi e del Marketing. Ne parleremo ancora prossimamente, statene certi!
Continua...
Per tutti i nostalgici come me un simpatico JavaScript emulation engine per Amiga, un’emulazione straordinaria se si pensa che è realizzata interamente tramite uno script Javascript.
Peccato funzioni solo con FireFox, tuttavia provate ad usare anche Internet Explorer 7 e guardate cosa succede… 
L’emulazione è sostanzialmente completa (ingrandite l’immagine qui accanto) e comprende anche una Shell.
Continua...
Apollo è il nome in codice (per ora) di un ambizioso progetto Adobe destinato al mondo RIA (Rich Internet Applications) e Web2.0, Ajax compreso. A qualcuno ricorda Macromedia Contribute, a qualcun’altro Macromedia Central. C’è, altresì, chi vede in Apollo la mera unione - o possibilità – di far convivere elementi Flash e PDF (cosa tra l’altro già fattibile con Flash Paper)!
Continua...
Nel Post Creare un RSS Reader in PHP e Javascript abbiamo indirettamente incontrato una tecnica estremamente interessante che permetteva di creare – in pratica – un file Javascript da PHP.
Continua...
Snap fa parte di quegli straordinari servizi Web2.0 style che sempre più spesso vengono offerti in rete in modo totalmente gratuito. Il suo fuzionamento è semplicissimo, basta inserire il “solito” script Javascript sul vostro Web, Blog o qualsiasi altra cosa… e come d’inconato tutti i vostri link ora possiedono un simpatico preview in tempo reale.
Per provarlo l’ho inserito qui su undolog.com, provate a passare il mouse qui sopra. Fantastico!
Continua...
Visto che siamo su un Blog (Weblog) e lo scambio di file RSS è diventato uno standard, ecco alcuni semplici estratti di codice utili per manipolare Feed-RSS.
Sappiamo tutti che i file RSS sono – alla fine – dei semplici file testuali che rispettano lo standard XML. Ne deriva che manipolarli non è poi così complesso.
La prima classe che presentiamo, in PHP, permette di “leggere” un file RSS da qualsiasi indirizzo, permettendo di elaborare il risultato e di riproporlo da qualsiasi parte.
Continua...
Web2.0 significa anche software distribuito tramite API (Interfaccia di Programmazione di un’Applicazione). La possibilità di sfruttare funzioni e funzionalità remote altrove risulta estremamente utile in realtà come Internet. Oltre a Yahoo, con il suo ToolKit 2.0 style, anche Google – nell’ambito della geo-referenzazione – propone i suoi strumenti free, in questo caso per la manipolazione e gestione delle mappe.
Google Maps API permette di inserire Google Maps nelle proprie pagine Web tramite Javascript.
Continua...
Domanda: possiamo considerare le applicazioni Ajax come vere e prorie RIA (Rich Internet Application – una RIA è un’applicazione web con tutte le caratteristiche e funzionalità di una tradizionale applicazione desktop per PC)?
Secondo Ryan Stewart, no – o almeno non ora.
The role of the desktop in Rich Internet Applications by ZDNet‘s Ryan Stewart — Rich Internet Applications have helped change the face of the web. It’s more interactive, designers have been able to leave their mark and innovation in web development has soared. Rich Internet Applications helped open up the web to better experiences and now they are doing the same for desktop applications. Where do RIAs fit into the world of desktop development?
In effetti la concorrenza con altri “approcci” – per così dire – è davvero elevata. La recente esplosione del fenomeno Net TV, ad esempio, dimostra che l’unione fa la forza. In “Ajax” non è possibile visualizzare un Video, tanto per dirne una. Come non è possibile realizzare tante altre cosine. Non credo che Ajax sarà il futuro assoluto. Io vedo in Ajax più che altro un’estensione del browser e un nuovo modo per affrontare alcune dinamiche relative all’UI prima neanche prese in considerazione.
Tuttavia, se qualcuno non se ne fosse accorto, esistono ancora degli ostacoli da superare. Ad esempio:
- Migliorare la compatibilità tra i vari browser in commercio, argomento largamento discusso su questo stesso Blog
- Permettere una maggiore interazione tra le pagine Web e il sistema operativo “ospitante”, ad esempio un Drag & Drop dal desktop alla pagina Web
- Standardizzazione degli scripting: JScript, Javascript (1.3, 1.7, …), VBScript
- Accessibilità, usabilità e sicurezza, vista che stiamo sulla rete!!
Librerie, Prototype/Script.aculo.us e YUI components: il vero intoppo?
Quando uno sviluppatore crea una libreria o un frame-work per risolvere (una volta per tutte) una serie di necessità, inizia a creare un mostro. Spesso non ce ne accorgiamo ma il legame sviluppatore end-user è davvero contorto. Si inizia, ad esempio, con la creazione di una libreria Javascript in grado di creare delle semplici finestre. Basta poco e qualcun’altro crea una libreria simile che permette di creare finestre modali, ridimensionabili e con la gestione dell’ordinamento e sovrapposizione. Dopo un po’ ne arriva un’altro che implementa anche la personalizzazione grafica… e così via.
In pratica quando si ottiene qualcosa, nell’istante immediatamente successivo questo qualcosa sembra non bastare più, sembra diventare lo standard e quindi si cercano nuovi accessori per migliorarne ancora di più le performance o l’aspetto. Tutte richieste dell’end-user! E lo sviluppatore corre, quasi come un cagnolino intimidito; l’end-user ha sempre ragione!
Questa continua corsa, in un universo come quello di Internet, rischia a lunga gettata di portare più confusione che altro.
Web 3.0?
Negli ultimi tempi esperienze (beta) nell’ambito del Web2.0 sono proliferate sulla rete a ritmi impressionanti. Ognuno ha portato all’attenzione la sua applicazione Ajax-style, ognuno con le sue soluzioni embedded, appoggiandosi a librerie note, scrivendo frame-work proprietari, ecc…
Ogni esperienza aveva le sue peculiarità: qualcuna era graficamente accattivante, alcune estremamente veloci, altre estrememente personalizzabili e altre estremamente usabili.
Ma nessuno, fino ad ora, è riuscito ad unire tutto questo in un unico ambiente.
Ragionandoci attentamente risulta evidente che il motivo è nello scarso supporto fornito dal browser stesso e dall’immensa complessità del problema.
Anche se qualcuno ha assimilato il browser ad un sistema operativo, quest’ultimo detiene ancora un’enorme vantaggio. Primo fra tutti è il cosidetto Kernel. Qual’è il Kernel di Explorer o di FireFox? Entrambi, come Opera o Safari, supportano a mala pena quel linguaggio di scripting chiamato Javascript (o JScript a secondo dei casi). Mozilla, nel suo FireFox sta per rilasciare la versione di Javascript 1.7, davvero interessante. Ma Microsoft Explorer che farà? Toccherà installare un ActiveX che lo emuli, attendere il 2012 per l’uscita di IE8 o utilizzare una miriade di if per capire su che piattaforma si sta lavorando?
Non posso che essere d’accordo con Ryan Stewart. Per il momento Ajax è un tecnica di notevole aiuto in ben determinati casi, ma paragonare questa tecnica (e sottolineo tecnica non tecnologia) ad una RIA mi sembra – almeno per ora – davvero eccesivo.
Macromedia/Adobe
Interessanti, invece, sono le tecnologie (e sottolineo tecnologie e non tecniche) Flex/Flash ed Apollo, che dopo l’acquisizione di Macromedia da parte di Adobe stanno per vivere una seconda giovinezza.
Consiglio vivamente a tutti gli interessati di visionare gli Adobe Labs, dove si evince una simpatica nuova politica che ispira sicuramente più fiducia nel futuro di Script.aculo.us – senza offesa e senza nulla togliere allo sviluppatore.
Tuttavia Internet ha una caratteristica unica, quella di sorprendere, quindi non mi stupirei affatto di aver detto – a breve – una miriade di sciocchezze!
Continua...
Se si ha bisogno di istanziare più oggetti di una classe, un metodo è quello di definire la classe tramite lo pseudo-costruttore function().
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
| // class definition
function CmyClass(param1,param2) {
this.myProperty = param1;
this.myAdding = param1+param2;
//
this.myMethod = function(param1) {
alert( "add: "+this.myAdding+" - Param: "+param1);
}
}
//
var obj1 = new CmyClass(10,20);
var obj2 = new CmyClass(20,40);
//
obj1.myMethod("Hi from obj1");
//
obj2.myMethod("Hi from obj2"); |
Definita la classe – con tanto di parametri iniziali – posso creare n istanze del mio oggetto, personalizzandole durante la creazione con la keyword new.
Posso anche inserire una chiamata ad un metodo durante la fase di inizializzazione dell’oggetto, stando solo attento ad inserirlo per ultimo – vedi riga 14:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
| // class definition
function CmyClass(param1,param2) {
this.myProperty = param1;
this.myAdding = param1+param2;
//
this.myMethod = function(param1) {
alert( "Result: "+this.myResult );
}
//
this._init = function() {
this.myResult = this.myProperty*100;
}
this._init();
}
//
var obj1 = new CmyClass(10,20);
var obj2 = new CmyClass(20,40);
//
obj1.myMethod("Hi from obj1");
//
obj2.myMethod("Hi from obj2"); |
Un modo sbagliato sarebbe – vedi riga 6:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
| // class definition
function CmyClass(param1,param2) {
this.myProperty = param1;
this.myAdding = param1+param2;
this._init();
//
this.myMethod = function(param1) {
alert( "Result: "+this.myResult );
}
//
this._init = function() {
this.myResult = this.myProperty*100;
}
}
//
var obj1 = new CmyClass(10,20);
var obj2 = new CmyClass(20,40);
//
obj1.myMethod("Hi from obj1");
//
obj2.myMethod("Hi from obj2"); |
Un’altro modo per creare un oggetto al volo (on-fly) è quello di dichiarare una variabile/funzione, mono uso:
1
2
3
4
5
6
7
8
9
| var myObject = {
myProperty: 10,
myMethod: function() {
alert("Hi from "+this.myProperty);
}
};
myObject.myMethod(); |
Questa tecnica è comoda quando si vuole creare una sola istranza di un oggetto, e trattarlo come tale. Questa viene spesso usata nei recenti framework Ajax, come prototype e derivati. A partire da questa, infatti, non è possibile istanziare un nuovo oggetto, in quanto la classe è andata persa.
Si può poi ricorrere all’uso di prototype per estendere una classe, anche vuota. Ad esempio:
1
2
3
4
5
6
7
8
9
10
11
12
13
| function CmyClass() {}
CmyClass.prototype = {
myProperty: 10,
myMethod: function() {
alert( "Hi from " + this.myProperty);
}
}
var obj = new CmyClass();
obj.myMethod(); |
Oppure:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
| function CmyClass() {
this.myOldProperty = 1000;
}
CmyClass.prototype = {
myProperty: 10,
myMethod: function() {
alert( "Hi from " + this.myProperty);
alert( "Hi from " + this.myOldProperty);
}
}
var obj = new CmyClass();
obj.myMethod(); |
Continua...
Ormai da Microsoft ci aspettiamo davvero di tutto, soprattutto quando si parla di browser. Offendere l’intelligenza della comunità, tuttavia, risulta un po’ sgradevole da accettare.
Sul Blog di IE7 è uscito oggi un articolo (IE+JScript Performance Recommendations Part 3: JavaScript Code Inefficiencies), se così possiamo definirlo di Peter Gurevich, Performance PM for IE, con la parte III dei suoi “consigli” per gli sviluppatori.
Primo appunto: perchè Microsoft si ostina ad implementare una sua versione di Javascript – che chiama appunto JScript – complicando la vita a tutti?
Secondo appunto: proprio perchè il motore di JScript è proprietà della Microsoft, invece di perdere tempo a dire a “noi” come aggirare i difetti, perchè non li sistemano una volta per tutte?
Lasciando stare il primo consiglio di questa III parte, che potete leggere direttamente sul Blog o su Ajaxian, il secondo è davvero eclatante, e sinceramente non lo diregisco proprio.
Don’t use Property Accessor Functions
Quando si dice il progresso! In pieno 2007, un Project Manager della Microsoft viene a dire a noi sviluppatori di Non usare le funzioni di get e set in JScript!
La follia, evidentemente, è uno strano male, che colpisce in modo repentino e fuorviante. JScript – sullo stile di Javascript – è implementato seguendo un modello ad oggetti! È un linguaggio ad oggetti, sulla scia del C++. Il fatto che le variabili siano accessibili dall’esterno (come sottolineato nell’articolo – cosa ovvia tra l’altro) non è assolutamente un vanto, anzi. La tecnica dell’incapsulamento è propria della filosofia della programmazione OO. Incapsulare le proprietà, passando dai virtual-method get e set è una forza del linguaggio Object Oriented, non un limite. Consigliare di non farne uso è a dir poco criminale, e gli eventuali problemi di performance sono a carico dell’interprete e dei suoi autori, non certo dell’end-developer.
Quindi, alla fine, JScript va usato come un semplice C, guai a trattarlo come C++, pena “impallare” il browser o chissà cos’altro.
Inoltre, come segnalato sul Blog, il tutto è un falso problema in quanto JScript NON implementa le vere funzioni di get e set, solo Javascript lo fa!
Ma il problema, evidentemente, rimane. In Javascript (scusate ma JScript non riesco proprio a digerirlo) ci sono varie tecniche per creare un oggetto. Ad esempio lo si può creare in modo immediato in questo modo:
1
2
3
4
5
| var myObject = {
miaProprieta: 0,
mioMethodo: function() { alert("Hello"); }
}; |
In questo modo non ho dichiarato una classe. L’oggetto viene per così dire dichiarato e creato contemporaneamente. È un modo rapido quando l’oggetto che ci serve è unico.
Oppure, il che è equivalente ai fini pratici:
1
2
3
4
5
6
7
8
| function CmyObject() {
this.miaProprieta = 0;
this.mioMetodo = function () { alert("Hello") }
}
//
var iMyObject = new CmyObject(); |
In questo caso prima si definisce la classe – tramite una function- (CmyObject) e poi si crea esplicitamente l’oggetto con new.
A parte le questioni stilistiche relative al singolo sviluppatore, il problema di come accedere alle proprietà di una classe rimane. Consiglio vivamente a tutti gli interessati, comumque, di leggere le risposte al Blog di Microsoft, davvero interessanti.
Sul Blog erano presenti tre modi di accesso: con le funzioni get e set, diretto e passando da prototype. Alla fine la cosa simpatica è stata che sul Blog c’è un codice per eseguire un Testdrive, una prova dei tre metodi indicati sopra. Il codice è presente sul Blog ma lo riporto qui per completezza:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
| <script>
// Slow Car definition
function SlowCar()
{
this.m_tireSize = 17;
this.m_maxSpeed = 250; // One can always dream!
this.GetTireSize = SlowCar_get_tireSize;
this.SetTireSize = SlowCar_put_tireSize;
}
function SlowCar_get_tireSize()
{
return this.m_tireSize;
}
function SlowCar_put_tireSize(value)
{
this.m_tireSize = value;
}
</script>
<script>
// Faster Car, no more property accessors
function FasterCar()
{
this.m_tireSize = 17;
this.m_maxSpeed = 250; // One can always dream!
}
</script>
<script>
// Prototype Car, use the language features!
function PrototypeCar()
{
this.m_tireSize = 17;
this.m_maxSpeed = 250; // One can always dream!
}
PrototypeCar.prototype.GetTireSize = function() { return this.m_tireSize; };
PrototypeCar.prototype.SetTireSize = function(value) { this.m_tireSize = value; };
</script>
<script>
function TestDrive()
{
var slowCar = new SlowCar(); // Safe and reliable, probably not fast
var fasterCar = new FasterCar(); // Lacks air-bags, probably faster
var protoCar = new PrototypeCar(); // Can technology win the day?
var start = (new Date()).getTime();
for(var i = 0; i < 100000; i++) { slowCar.SetTireSize(slowCar.GetTireSize() + 1); }
var end = (new Date()).getTime();
output.innerHTML += "Slow Car " + (end - start) + "<br>";
start = (new Date()).getTime();
for(var i = 0; i < 100000; i++) { fasterCar.m_tireSize += 1; }
end = (new Date()).getTime();
output.innerHTML += "Faster Car " + (end - start) + "<br>";
start = (new Date()).getTime();
for(var i = 0; i < 100000; i++) { protoCar.SetTireSize(protoCar.GetTireSize() + 1); }
end = (new Date()).getTime();
output.innerHTML += "Prototype Car " + (end - start) + "<br>";
}
</script>
<button onclick="TestDrive();">Test Drive Cars!</button>
<div id="output"></div> |
Ora, questo è l’output (relativo alla mia macchina) con IE7:
Slow Car 515
Faster Car 63
Prototype Car 547
Con FireFox (v.2.0.0.1):
Slow Car 156
Faster Car 47
Prototype Car 172
Con Opera (v.9.10):
Slow Car 172
Faster Car 47
Prototype Car 172
Insomma 
IE7 ne esce davvero male… non so se notate l’enorme differenza. Quindi direi che JScript potrebbe essere abolito, eliminato, cancellato, vaporizzato. Speriamo che Microsoft si decida anche lei ad adottare Javscript e non i surrogati.
Continua...
Ultimi Commenti
Giovambattista Fazioli: @Nik: Sono contento! In bocca al lupo dunque!!
Nik: Lunedì ho l’esame di informatica su java, grazie mi sei stato utilissimo, il libro che ho era poco chiaro...
Marco: Ti ringrazio moltissimo, mi hai illuminato
ho risolto impostando [cc_objc] //OptionViewController.m -...
Giovambattista Fazioli: @Marco: Ti consiglio un approccio credo più corretto. Se hai eseguito il subclass del tab...
luigi: molto chiaro e semplice devo ammettere che anche scrivendo da un pà difficilmente uso delegati creati da...