Yahoo! User Interface Blog (YUIBlog)

YUI Theater - Jeff Craig: "Loader Demistificazione: Configuration Module avanzata" (31 min.)

In questo discorso da YUIConf 2011, Meebo ingegnere e YUI contributor Jeff Craig ( @ foxxtrot ) rivela tutto quello che hai sempre voluto sapere sul Loader YUI, ma avete mai osato chiedere. Si tratta di un must-see per chiunque fare prestazioni-critical lavoro con YUI 3.

Links

• Guarda in HD su YouTube
• Slides
• Pieno YUIConf 2011 Playlist su YouTube

Trova le conversazioni: bloglines | technorati

Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!

YUI: Orario di apertura gio dic 15

YUI 3.5.0 PR1

YUI 3.5.0 PR1 è ora disponibile ! Questo è il primo di tre versioni di anteprima per la 3.5.0.

Per questo Orario di apertura saremo evidenziando ciò che è in PR1 e discutere come si può partecipare per assicurarsi 3.5.0 è solida roccia. Stiamo anche chiedendo uno show-di-mani dagli sviluppatori impressionanti che hanno già cominciato ad usare 3.5.0 PR1 (che è il CDN ). Vieni Giovedi, non farsi prendere con la mano verso il basso :)

Inoltre, il sito della biblioteca YUI Staging è stato aggiornato con le guide ultimo utente e documentazione API, e in risposta al feedback da parte le ultime ore Aperto , ora stiamo usando il nostro wiki GitHub per monitorare le discussioni in corso di sviluppo .

Registrazione

La registrazione è disponibile sul YouTube YUILibrary canale .

Trova le conversazioni: bloglines | technorati

Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!

Modifiche quadro Dietro a YUI 3.5.0

Dal momento che la versione iniziale del quadro App in YUI 3.4.0, siamo stati stupiti da quanto velocemente è stato adottato. Nei progetti di grandi e piccoli , sia dagli utenti di lungo YUI e coloro che sono completamente nuovi per la biblioteca sono stati con entusiasmo utilizzando il Framework MVC App i componenti e fornire feedback e segnalazioni di bug. Grazie!

In YUI 3.5.0, il quadro App riceverà un sacco di bug fix e alcuni miglioramenti importanti. Eric Ferraiuolo coperto molti dei cambiamenti imminenti nel suo discorso YUIConf fantastica , ma vogliamo sottolineare in questa sede, come pure in modo saprete cosa succederà e cosa si dovrebbe preparare per se avete intenzione di aggiornare App Framework basato su codice 3.4.x a 3.5.0. Questi cambiamenti sono già in YUI 3.5.0 PR1 , che è stato rilasciato oggi, quindi ora è il momento giusto per iniziare a testarle.

Y.Controller è ora Y.Router

"Controller" era un nome stupido e confuso per un componente che riguarda in realtà si è più con il routing basato su URL, soprattutto in considerazione del ruolo più tradizionale controller-simile che gioca Y.View. Abbiamo deciso di ingoiare il rospo e rinominare la classe Y.Controller di Y.Router in 3.5.0. Y.Controller diventerà un alias per mantenere la compatibilità all'indietro, ma questo alias alla fine saranno rimossi, così si dovrebbe aggiornare il codice per riferirsi al nuovo nome.

Nuova rotta della firma del gestore

La firma del metodo per le funzioni di gestore in rotta Y.Router è leggermente cambiata per renderla più simile a Esprimere e rendere API router più naturale se utilizzato con il server (una caratteristica che stiamo attualmente lavorando per la 3.5.0).

In precedenza, una funzione di gestore di percorso ha ricevuto due argomenti: req (un oggetto di richiesta) e next (una funzione). In 3.5.0, i gestori del percorso riceverà tre argomenti: req , res (un oggetto di risposta), e quindi next .

Per motivi di compatibilità all'indietro, la nuova res argomento è anche una funzione che si comporta esattamente come next , in modo vecchio stile gestori percorso che si aspettano next come il secondo arg continuerà a lavorare bene in 3.5.0. Tuttavia, questo shim di compatibilità finirà per essere rimossi, quindi non aspettare troppo tempo per aggiornare il codice.

Alcune proprietà sono ora gli attributi

Abbiamo sperimentato un non-tutto-YUI-come stile utilizzando le proprietà per le opzioni configurabili nei componenti Framework l'applicazione in 3.4.0, ma questa si rivelò essere un po 'di confusione e più di un po' limitante, poiché le proprietà non beneficiano da eventi cambiamento, setter, e validatori come attributi fare. Quindi, in 3.5.0, stiamo convertendo molte di queste proprietà agli attributi.

Purtroppo, questo cambiamento non è compatibile, codice in modo esistente che utilizza Y.Controller (ora Y.Router) o Y.View potrebbe essere necessario aggiornare. In particolare, Y.Router 's html5 , root e routes proprietà sono ora gli attributi, e Y.View 's container , model , e il modelList proprietà sono ormai attributi pure.

In aggiunta a questo, Y.View 's container attributo tratta ora valori della stringa come selettori CSS utilizzato per trovare nodi sulla pagina. In 3.4.x, ha assunto un valore di stringa rappresentata HTML grezzo che deve essere convertito in un nodo. Per ottenere il vecchio comportamento, è sufficiente modificare i valori esistenti stringa HTML da '<div>foo</div>' a Y.Node.create('<div>foo</div>') .

3.5.0 Documentazione per PR1

Work-in-progress documentazione relativa a questi cambiamenti e le altre variazioni YUI 3.5.0 PR1 possono essere trovate sul nostro sito di staging . Qui ci sono alcuni link a documenti pertinenti messa in scena che includono informazioni sul quadro deprecati Dietro a 3.5.0 e dettagli su come aggiornare il tuo codice:

• Router
• Vista

Si noti che il contenuto in stage.yuilibrary.com riflette lavori in corso in corso e possono essere incomplete o addirittura rotto occasionalmente come roba nuova prova. Troverete sempre la documentazione per l'ultima versione stabile al nostro sito di produzione, yuilibrary.com .

Che altro c'è di nuovo?

In questo post del blog ho riassunto i deprecati importanti che vengono al quadro in App 3.5.0, ma ci sono anche un sacco di miglioramenti delle funzionalità e sotto il cofano correzioni di bug. Per un elenco completo delle modifiche quadro Dietro a 3.5.0 PR1, consultare il file HISTORY .

Inoltre, cercare un post sul blog di Eric presto su Y.App, un fantastico nuovo ad alto livello componente del quadro App che avvolge il routing basato su URL e gestione vista in un unico e facile da usare API che ti prendo da zero a un'applicazione di lavoro in pochissimo tempo.

Ci auguriamo che ami la versione di anteprima, e ci piacerebbe sentire da voi! Potete inviarci feedback in forum , in una segnalazione di bug , su Twitter , sul canale IRC # YUI su Freenode, o semplicemente carillon qui con un commento.

Trova le conversazioni: bloglines | technorati

Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!

YUI 3.5.0 PR1 è ora disponibile

YUI 3.5.0 Preview Release 1 è stato distribuito per il test e feedback dalla comunità degli sviluppatori. Lo si può trovare sul CDN a Yahoo! yui.yahooapis.com/3.5.0pr1/build/yui/yui-min.js , o scaricare un file zip se si prevede di ospitare da soli.

Il cumulativo dei cambiamenti introdotti in PR1 è disponibile sul nostro Wiki GitHub. Inoltre, è possibile rivedere l'elenco dei biglietti che sono stati risolti in questa release .

Work-in-progress guide per l'utente e documentazione API per 3.5.0 possono essere trovate sul nostro sito di staging, ma attenzione che questi documenti possono essere incomplete o addirittura rotti, poiché è qui che proviamo qualcosa di nuovo. Documentazione ufficiale per l'ultima versione stabile è sempre possibile trovare sul nostro sito di produzione, yuilibrary.com .

Altri cambiamenti saranno introdotti nelle prossime versioni di anteprima di YUI 3.5.0, alcuni dei quali sono attualmente in rami degli stessi sviluppatori 'e sono disponibili per la revisione iniziale attraverso le richieste di trazione seguenti:

• New DataTable architettura e l'implementazione
• Nuovo modulo Button

Per presentare bug nei confronti di questa versione, si prega di visitare il nostro sistema di tracciamento dei bug . Se desideri dare un contributo sui moduli questi e futuri, le discussioni in corso su vari argomenti relativi alla versione 3.5.0 stanno accadendo sul nostro wiki GitHub.

Se tutto va secondo i piani, speriamo di rilasciare YUI 3.5.0 PR2 il 30 gennaio 2012. Buone vacanze!

Trova le conversazioni: bloglines | technorati

Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!

YUI Theater - Allen Rabinovich: "YUI Calendar - Uno studio caso di costruzione di moduli con stile" (47 min.)

In questo discorso da YUIConf 2011, YUI ingegnere Allen Rabinovich ( @ allenr ) condivide il processo ha usato per architetto e costruire il nuovo widget di Calendar in YUI 3, e spiega come è possibile utilizzare un processo simile per costruire i propri widget. Egli mostra anche fuori il nuovo componente e rivela un trucco intelligente delle prestazioni utilizzato per accelerare il rendering di più calendari.

Links

• Guarda in HD su YouTube
• Pieno YUIConf 2011 Playlist su YouTube

Trova le conversazioni: bloglines | technorati

Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!

YUI Theater - Pat Cavit: "Ottimizzazione del sito web Automazione" (32 min.)

Pat Cavit ( @ tivac ), un ingegnere frontend ad ArenaNet ed un collaboratore attivo YUI e membro della comunità, è unito a noi a YUIConf 2011 per dare a questo discorso su come automatizzare build-time ottimizzazioni del sito come la concatenazione di file, minimizzazione, rinomina, e altro ancora utilizzando il Ant build tool.

Links

• Guarda in HD su YouTube
• Pieno YUIConf 2011 Playlist su YouTube

Trova le conversazioni: bloglines | technorati

Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!

Nella Galleria 3 YUI: Widget Editor Bulk

Il plug-in QuickEdit per YUI 3 DataTable rende facile modificare una pagina intera di record come operazione atomica. Tuttavia, a volte è necessario fare ancora di più. Ad esempio, potrebbe essere necessario modificare contemporaneamente più record di quello che può comodamente essere contenuti in una singola pagina. Oppure, potrebbe essere necessario supportare l'aggiunta, la duplicazione e la rimozione di record come parte della operazione atomica. Oppure, si potrebbe voler raggruppare visivamente i campi mettendoli in una cella singola tabella. L' Editor Bulk supporta widget di tutte queste possibilità.

( Fare clic sulla schermata per giocare con questo esempio .)

Panoramica

Il widget Editor Bulk costituito da tre componenti:

Data source

Questo avvolge una YUI DataSource e gestisce le modifiche: inserzioni, rimozioni e valori modificati.

Base widget

Ciò fornisce la struttura di base per la modifica la gestione di record e campi all'interno di ogni record. Le classi derivate è quello di visualizzare ogni record in una riga separata, che potrebbe essere un div, un tbody, o qualche altro contenitore.

HTML table implementation

Questo si estende il widget di base per rendere ogni record in una tbody in una tabella HTML. La configurazione colonna determina quale campo è visualizzato in ciascuna colonna della tabella. Un formattatore cella personalizzata può essere utilizzato per rendere più campi in una cella singola tabella.

Configurazione

Nell'esempio che ha generato la schermata di cui sopra, la configurazione è stato mantenuto il più semplice possibile:

fields definisce i valori modificabili in ogni record. Il tipo predefinito è di ingresso. Gli altri tipi validi sono select e textarea. (Select richiede un elenco di valori.) Convalida di base è fornita da Form Manager modulo galleria. Questo copre i campi obbligatori, le restrizioni di lunghezza, e gli intervalli numerici . Più complessa la convalida può essere effettuata specificando regex o la propria funzione ( fn ). Ecco un estratto dal vivo esempio:

 campi var =
 {
	 title:
	 {
		 Tipo: 'textarea'
	 },
	 anno:
	 {
		 convalida:
		 {
			 css: 'yiv-intero: [1500,2100]'
		 }
	 },
	 colore:
	 {
		 Tipo: 'select',
		 valori:
		 [
			 {Value: 'rosso', text: 'Red'},
			 {Value: 'verde', text: 'Green'},
			 {Value: 'blu', text: 'Blue'}
		 ]
	 }
 };

Y.BulkEditDataSource richiede un'istanza di Y.DataSource e dei seguenti parametri:

uniqueIdKey

Il nome di una chiave che identifica in modo univoco ogni record.

generateRequest

Una funzione per generare i parametri di richiesta di Y.DataSource . (Questa è vuoto nell'esempio, perché Y.DataSource.Local restituisce sempre tutti i dati.)

extractTotalRecords

Funzione per estrarre il numero totale di records dal Y.DataSource risposta.

Dato che l'esempio utilizza Y.DataSource.Local , totalRecordsReturnExpr è anche necessario. Questa espressione OGNL specifica dove nella risposta per memorizzare il numero totale di records. (Si noti che extractTotalRecords legge questo valore).

 var ds = new Y.BulkEditDataSource (
 {
	 ds: raw_ds, i
	 uniqueIdKey: 'id',
	 GenerateRequest: function () {},
	 , 'meta.totalRecords.: totalRecordsReturnExpr
	 extractTotalRecords: funzione (risposta)
	 {
		 ritorno response.meta.totalRecords;
	 }
 });

Y.HTMLTableBulkEditor richiede l'origine dei dati, la configurazione del campo, e la configurazione colonna. Nella configurazione di colonna, la chiave è il nome del campo, a meno che non si specifica una formattazione personalizzata. L'etichetta viene utilizzato come titolo colonna. Ecco un estratto dal vivo esempio:

 colonne var =
 [
	 {
		 key: 'casella',
		 label: '<input type="checkbox" id="select-all" />',
		 formatter: function (o)
		 {
			 var markup = '<input type="checkbox" class="record-select" id="{id}" />';
			 o.cell.set ('innerHTML', Y.Lang.sub (markup,
			 {
				 id: this.getRecordId (o.record)
			 }));
		 }
	 },
	 {Key: 'title', label: 'Titolo'},
	 {Key: 'Anno', label: 'Anno'},
	 {Key: 'color', label: 'Colore'}
 ];

(Si noti che l'esempio vivo definisce una estensione minore Y.HTMLTableBulkEditor per gestire la casella di colonna.)

È inoltre possibile passare un'istanza di Y.Paginator a Y.BulkEditDataSource . Questo è dimostrato in un separato, più complicato esempio dal vivo .

Locali e remote Origini dati

Al momento di decidere se utilizzare un locale o un telecomando origine dati, è necessario valutare attentamente il trade-off. L'ovvio trade-off è che un locale datasource è più veloce quando l'impaginazione, ma il caricamento della pagina iniziale ci vorrà più tempo, e richiede più memoria sul client.

Il widget Editor Bulk impone ulteriori compromessi, però.

In primo luogo, la proprietà DataSource YUI deve restituire dati immutabili. Questo è automatica per le origini dati locali, ma può essere difficile da implementare per origini dati remote. Avrete bisogno di bloccare le righe della tabella di database per la durata dell'operazione di modifica collettiva se più di un utente è autorizzato a modificarli.

In secondo luogo, la scelta tra locale e remoto origine dati influisce si è permesso di salvare i dati. Quando si utilizza una fonte locale dei dati, si può fare risparmio di best effort, cioè, salvare tutti i documenti validi per il server, rimuoverli dalla datasource locale, e consentire all'utente di concentrarsi sui record che hanno valori non validi. Quando si utilizza una sorgente remota dei dati, l'obbligo di immutabilità solo permette di fare tutto o niente risparmio, vale a dire, i dati possono essere salvati solo dopo che tutti i dati sono validi.

Uso nel mondo reale Caso

La motivazione originale per il widget di Editor Bulk era quello di permettere la post-elaborazione di un foglio caricato. L'introduzione di una fase di post-processing elimina la necessità per i valori di fogli di calcolo per essere perfetto. Gli errori possono essere segnalati e fissa nel widget Editor Bulk invece di rifiutare il caricamento intero. Inoltre, l'elaborazione sul server possono fare meglio-guess assegnazione di ulteriori valori necessari per ogni record, e l'utente può controllare e correggere questi valori extra prima del salvataggio. Questo semplifica la creazione iniziale del foglio di calcolo.

In questo scenario, una fonte dati remota è la scelta migliore. I dati caricati vengono memorizzati in uno spazio zero, ed è quindi garantito immutabile, dal momento che nessun altro utente può vedere. Risparmio "Tutto o niente" è appropriato: Una volta che tutti gli errori sono stati corretti, l'operazione di salvataggio è atomico, proprio come una normale operazione di upload.

Circa l'autore: John Lindal ( @ jafl5272 su Twitter) è uno degli ingegneri di piombo costruire le fondamenta su cui Yahoo! APT è stato costruito. In precedenza, ha lavorato sul Yahoo! Publisher Network.

Trova le conversazioni: bloglines | technorati

Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!