Yahoo! User Interface Blog (YUIBlog)

Note dell'autore: Scrivere YUI 2.8: Imparare la Biblioteca, il New YUI 2 Prenota da Packt

Nel dicembre 2009, redattori di Packt Publishing mi ha chiesto se mi piacerebbe scrivere la seconda edizione del loro libro sulla libreria YUI . L'autore originale, Dan Wellman, era impegnato in altre attività, al momento, e avevano bisogno di un autore che è stato ampiamente familiarità con YUI 2 . La prima cosa che ho pensato è stata: non sei un po 'in ritardo? Gran parte della YUI 3 era già fuori in GA e più veniva ad ogni rilascio. Ma il team Packt ha voluto procedere, e ho accettato di raccogliere la sfida.

Il ¹⁶ luglio, il nuovo volume è uscito, YUI 2.8: Imparare la Biblioteca , non come una seconda edizione, ma come un nuovo titolo. Alla fine, non era una cattiva decisione. Mentre il libro era passare attraverso il processo di editing, YUI 3 acquisito la capacità di carico YUI 2 componenti da use() dichiarazione . Ciò estende l'utilità del vasto catalogo YUI 2 tenendo la pressione agli sviluppatori di produrre YUI 3 versioni di tutti i 2 componenti YUI.

• Capitolo campione: Packt ha rilasciato un capitolo di esempio dal nuovo volume, che copre YUI 2,8 editor di testo RTF, sul loro sito web, dando un sapore di ciò che il libro contiene .

L'obiettivo di questo nuovo volume è stato quello di coprire tutti i non-beta YUI 2 componenti. Questa visione ampia mi ha costretto a prendere uno sguardo più approfondito i componenti avevo appena usato nelle loro forme più elementari come pure altri che non aveva usato affatto. Tuttavia, contrariamente alla prima edizione, un progetto iniziato non molto tempo dopo che la biblioteca era stata resa pubblica, ho avuto alcuni anni di esperienza cumulativa con YUI - la mia esperienza in coppia con quella dei molti utenti che condividono le loro esperienze e consigli sui forum e il blog. Sono stato anche risparmiato da molti errori da un eccellente team di revisori, due dei quali, Caridy Patiño e Iliyan Peichev, sono ben noti collaboratori YUI.

Per mantenere il libro ad una lunghezza gestibile, ho eliminato alcune immagini, gli esempi a lungo, e materiale di riferimento che potrebbero essere trovati presso il sito web YUI . Mentre la prima edizione aveva al massimo due componenti per capitolo, il nuovo ha fino a quattro e ha un paio di nuovi capitoli. Anche così, alcuni componenti non ha fatto il taglio.

L'evoluzione della YUI 2

Ho imparato molto sulla libreria YUI mentre scrivevo questo libro, e le modifiche che ho fatto al testo di Dan sono stati istruttivi sulla evoluzione della biblioteca dalla sua uscita nel 2006.

Lo stile di programmazione per codice di esempio è cambiato in questi anni. Invece di creare uno spazio dei nomi (o utilizzando YAHOO.example , che è sempre disponibile come segnaposto), ora tendono a stare tutto all'interno di una funzione anonima creata quando il DOM diventa disponibile. (Questo stile è più vicino a ciò che vediamo in YUI 3.) Noi ora utilizzare i namespace quando abbiamo assolutamente bisogno di creare le variabili accessibili a livello globale (inclusi gli oggetti), come quando si crea un componente personalizzato biblioteca. Sandboxing ci salva qualche battitura, dal momento che possiamo definire funzionale con ambito alias per gli oggetti che usiamo più spesso da YUI (Dom, Evento, Lang sono scorciatoie comune) o variabili della nostra. Questo approccio permette anche di YUI Compressor fare un lavoro di gran lunga migliore.

Avere una vista panoramica di tutta la biblioteca mi ha permesso di notare come si è sviluppata nel tempo. L'architettura dei componenti cambiato ed è chiaro come tutto è convergente in quello che oggi è YUI 3.

Primi componenti, come TreeView, aveva poche dipendenze. Come certi schemi iniziato a diventare evidente, alcune infrastrutture componente di base ha iniziato a svilupparsi. La famiglia ha avuto un contenitore Config oggetto che ha permesso di metodi getter e setter, e quindi hanno tutti i componenti che ereditano da essa. Si usa anche l'oggetto di eventi personalizzato, che è uno dei due modi di lavorare con eventi personalizzati che abbiamo a disposizione in YUI 2.

Con il rilascio di visualizzazione a scheda è arrivata la 2 Utility Elemento YUI , che ha fornito una migliore getter e setter (via AttributeProvider) così come meglio eventi personalizzati (via EventProvider). Diciassette YUI altri 2 componenti ereditano da Element. Osservando l'evoluzione della biblioteca, è facile vedere come le idee che stanno dietro elemento, come wrapper elemento DOM, è venuto a informare Nodo YUI di 3. Ruolo di elemento come base per altri componenti era scoppiato nella base di YUI 3 e Widget, se i nuovi componenti sono tutti di gran lunga più potente e completo, ciascuno nella propria area. Per esempio, il nodo è all e one metodi di restituire istanze del nodo, mentre Element getXxxx metodi restituiscono pianura riferimenti elemento DOM, non completamente astrazione DOM.

I due modelli, Config e CustomEvents da un lato e AttributeProvider EventProvider e, dall'altro, non sono del tutto incompatibili. Nel menu e pulsanti di Spalato coesistono entrambi i modelli, come Button eredita dalla Element e ospita un menu normale che eredita da Container.

Indubbiamente, YUI 3 beneficiato di tutta questa esperienza, ma YUI 2 anche beneficiato YUI3. Cool stuff venuto da YUI 3 a arricchire YUI 2, come event-delegate e element-delegate e di altri nuovi eventi siamo in grado di ascoltare ( focusin e focusout , mouseenter e mouseleave ). Anche questo fu possibile a causa del modo in cui i componenti di carico , che ha cambiato durante la vita di YUI 2 - soprattutto con l'introduzione della YUI 2 Loader - e divenne formalizzato il supporto intrinseco per client-side di carico in YUI 3.

Caricamento colpiti come i componenti ha progettato e come i file dei componenti finali sono costruiti. In YUI 2, per ridurre al minimo il numero di richieste del server eccezionale, i componenti dovevano avere come gran parte di ciò di cui avevano bisogno imballati in comune. Così, alcuni componenti ha stretta relazione con gli oggetti in loro solo per avere a portata di mano quando e se necessario, altre avevano un mucchio di oggetti, con tutta una serie di caratteristiche inseriti in un file perché il caricamento della parti separate era troppo costoso. Poi vennero aggregati come yahoo-dom-events.js o reset-fonts-grids.css dal momento che sono quasi sempre usati insieme o utilities.js che raccoglie tutti i componenti spesso usato nel YAHOO.util ramo. Ma il vero cambiamento è venuto con le richieste di combo-gestita, che ci ha permesso di tirare qualunque numero di file script e css ciascuno in una sola richiesta http. Che lo rende meno necessario ottimizzare il confezionamento degli oggetti nella libreria in file di componenti e di quelli in aggregati sulla base di un ipotetico 'utente medio'.

In YUI 3 non abbiamo più bisogno di caricare il 'contenitore familiare' tutto in una volta. Siamo in grado di caricare il separato widget- xxxx file in cima alla base widget base alle caratteristiche che ci servono. Questo approccio è lo standard in YUI 3, ma è venuto come uno dei passi nell'evoluzione della YUI 2. Quindi, più recente YUI 2 componenti come event-delegate e element-delegate sono imballati separatamente da da loro componenti di base ed è così dell'evento mouseenter e mouseleave . Potremmo vedere ulteriori divide in componenti di libreria nelle versioni future, che consente di scegliere più specificamente la funzione di set che si desidera e lasciare il codice non necessario fuori dalla pagina.

Questa è una storia di progresso, un processo che necessariamente è andato anche se alcuni tentativi falliti. Perché non TreeView eredita da Element o perché non ha contenitore, e quindi menu, passati a Element o, almeno, a AttributeProvider e EventProvider? Tecnicamente, la risposta è 'compatibilità', ma in termini più generali, è 'rispetto'. Ci sono migliaia di siti web (e decine di migliaia di sviluppatori), utilizzando l'l'interfaccia pubblica ha pubblicato dei 2 componenti YUI. Fare questi cambiamenti si rompono molte applicazioni o li avrebbero tagliato il percorso di aggiornamento, dovrebbe vogliono beneficiare di una correzione di codice o di una nuova funzionalità. Essendo così rispettosi del codice di base installata è una funzione di libreria in sé. Essere rispettosi di noi, che creano quel codice, è una caratteristica delle persone del team YUI, e ne sono molto grato è così.

Trova conversazioni: Bloglines | technorati

Condividere ed estendere: Bookmark with del.icio.us | Digg it! | reddit!