Yahoo! User Interface Blog (YUIBlog)

Crockford su JavaScript: una serie di conferenze pubblica a Yahoo!

Dal 2007, Douglas Crockford ha sviluppato (e la distribuzione) una serie di conferenze sul linguaggio di programmazione JavaScript. Molte di queste lezioni sono state registrate e rese disponibili come parte della YUI Theater serie di video. Douglas ha consegnato molti dei colloqui a conferenze in tutto il mondo.

Nei primi mesi del 2010, Douglas sarà la consegna la serie completa di colloqui JavaScript con contenuti aggiornati come parte di un evento dal titolo "Crockford su JavaScript" . L'evento si svolgerà in cinque serate nel mese di gennaio, febbraio e marzo presso la sede di Yahoo! in Sunnyvale, CA. La partecipazione è gratuita, ma posti a sedere è limitato - un programma completo, compreso il link ad RSVP è disponibile sul sito della manifestazione .

Grazie ingegnere YUI Allen Rabinovich per la cartellonistica .

Trova le conversazioni: bloglines | technorati

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

Stencil di progettazione iPhone nel Pattern Library

Trova le conversazioni: bloglines | technorati

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

Apertura di lavoro del team di Yahoo! Sport

Yahoo! Sports ha raggiunto 36 milioni di visitatori unici al mese e domina le sportive online e Fantasy Sports industriali in tutto il mondo. Il sito ricetta per il successo: contenuti di alta qualità presentati tramite interfacce ricche e standard-compliant.

L'Y! Esperienze sportive è così coinvolgente, gli utenti visualizzano oltre 2 miliardi di pagine al mese - più di Fox, SI, e dello sport CBS combinato! Per soddisfare tali esigenze elevate, Y! Sport rimane in prima linea delle tecnologie Internet, sfruttando piattaforme come YUI .

Se si considera un appassionato di YUI utente, il tipo che può guardare sotto il cofano di un componente e iniziare ad aggiungere le caratteristiche di qualità, sei già sulla buona strada per unirsi alla loro squadra.

Invia il tuo curriculum, inclusi gli URL del portafoglio di Mediatech-assunzioni / at / yahoo / dash / inc / dot / com (Principals solo;. Non reclutatori, per favore) o saperne di più circa la posizione .

Trova le conversazioni: bloglines | technorati

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

YUI Theater - John Resig: "Test, analisi delle prestazioni e jQuery 1.4"

John Resig ( @ jeresig ) di Mozilla , creatore del popolare jQuery JavaScript biblioteca, fermato da Yahoo! il Venerdì per un BayJax meetup e consegnato in tre parti Tech Talk, "Testing, analisi delle prestazioni e jQuery 1.4" .

Nella prima parte del discorso, John recensione la gamma di strumenti disponibili per gli ingegneri frontend per unit testing e per analizzare le prestazioni del codice. In quest'ultimo caso, si sostiene la necessità di andare oltre la pura velocità basati su parametri di riferimento per le analisi strutturali della performance. Osservando la struttura, il team di jQuery è stato in grado di identificare e correggere i colli di bottiglia, con conseguente miglioramento delle prestazioni importanti nella prossima versione 1.4.

Nella seconda parte del discorso (a partire dalle 49:20 nel video), John esamina alcuni di questi cambiamenti jQuery 1.4. Nella sezione terzo corto (inizio alle 01:03:15), guarda alcune tendenze interessanti è notato che l'applicazione pratica delle nuove HTML 5 elementi - in particolare nei vecchi browser.

Se il video qui sotto incorporare non viene visualizzato correttamente nel vostro lettore RSS di scelta, essere sicuri di scegliere attraverso per visualizzare la versione ad alta risoluzione del video su YUI Theater .

• Scarica il video (m4v)
• Scarica le diapositive
• Ad alta risoluzione, versione trascritta di questo discorso è disponibile sul sito YUI Theater

Altri recenti YUI Theater Video:

• Luke Smith: Eventi Evolved - YUI ingegnere Luke Smith fornisce una introduzione profonda al sistema 3 evento YUI compreso il suo sostegno per gli eventi DOM, delega eventi, eventi sintetici ed eventi personalizzati.
• Todd Kloots: YUI 3 Zucchero - YUI engineer Todd Kloots presenta un'introduzione indispensabile per YUI potente suite di strumenti 3.
• Douglas Crockford: Lo Stato e futuro di JavaScript - Yahoo! JavaScript Architect Douglas Crockford discute la recente ECMA5 processo di sviluppo e gli sforzi per migliorare la lingua nel futuro.
• Brendan Eich: ECMA Harmony e il futuro di JavaScript - Brendan Eich, il creatore del linguaggio di programmazione più diffuso al mondo, parla della lotta per la proposta ES4 e come si è tradotto in uno specifico insieme di proposte di ES5.

Iscrizione a YUI Theater:

• YUI Theater RSS feed
• YUI Theater su iTunes

Trova le conversazioni: bloglines | technorati

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

YUI 2.7.0 su InsideLine.com

Qui a Edmunds ( Edmunds.com ) abbiamo appena lanciato una riprogettazione della linea Inside (InsideLine.com) , il nostro sito web automotive appassionati, e stiamo usando il YUI JavaScript library ampiamente.

Alcune delle utilities YUI & widget utilizzati on Line Interno:

• Yahoo / Dom / Event
• Animazione Utility
• Connection Manager
• ImageLoader
• JSON
• Selettore
• Carosello
• Visualizzazione a scheda

Noi (il team Frontend) ha iniziato con YUI 2.7.0 JavaScript di base e costruito la nostra libreria JavaScript interfaccia utente su di esso per incapsulare site-specific di componenti e funzionalità. La nostra biblioteca si avvale dei servizi YUI core, tra cui Dom , eventi , Connection Manager , e animazione .

Stiamo utilizzando Dom ed eventi ampiamente per gestire l'interazione DOM, i listener di eventi e gestione degli eventi personalizzati. Il Connection Manager YUI sta gestendo tutte le nostre implementazioni Ajax, compresi i nostri widget di ricerca personalizzati. Stiamo utilizzando anche molti dei widget YUI on Line interno, compresi Visualizzazione a scheda e Carousel , con interfacce personalizzate. Il ImageLoader YUI ci ha aiutato a migliorare le prestazioni della pagina e soddisfare i nostri severi requisiti di prestazioni.

Abbiamo scelto YUI a causa della sua ottima documentazione, test approfonditi, e la portata e la profondità della sua offerta. La biblioteca è facile da imparare, capire e attuare. La modularità del sistema si adatta bene con i nostri principi di progettazione, e l'API ed eventi personalizzati rendono estremamente estensibile e facile da integrare.

Alcune notizie

Multimedia Spotlight (visualizzazione a scheda, carosello) da InsideLine.com :

Gallerie di immagini e video (core, JSON e Carousel):

Ajax Search Widget (Dom, Evento, Connection Manager):

Avete un Imlementation YUI ti piacerebbe condividere YUIBlog? Scopri le nostre linee guida di contribuzione - ci piacerebbe sentire da voi.

Trova le conversazioni: bloglines | technorati

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

Cosa c'è di nuovo in Test YUI 3.0.0

Una nuova versione di YUI test accompagnato il rilascio di YUI 3.0.0 . Test di YUI 3.0.0 per più di una semplice porta del 2.x compatibile con la versione di YUI Test, tuttavia, l'introduzione di diverse nuove funzionalità. Questi sono nate a seguito delle richieste di sviluppo e le conversazioni che ho avuto con quelli già utilizzando lo strumento.

Promozione della simulazione dell'evento

Simulazione di evento è stato inizialmente introdotto nella versione 2.x di YUI test mediante l' YAHOO.util.UserAction oggetto. Come si è scoperto, gli sviluppatori è piaciuto molto questa funzionalità e usi trovati per esso al di fuori dell'ambiente di test. Di conseguenza, lo strumento di simulazione a eventi sono stati promossi a essere una prima classe membro della utility 3.0.0 Event YUI , accessibile in un unico metodo, Y.Event.simulate() . È possibile includere il componente di simulazione di eventi passando "event-simulate" nella YUI().use() metodo:

  YUI (). Utilizzare ("event-simulazione", function (Y) {
     Y.Event.simulate ("# nodo", "click", 
                      {ClientX: 25, clientY: 30});
 }); 

Oggetti Mock

YUI test per YUI 3.0.0 introduce una nuova funzionalità: la creazione di oggetti simulati. Oggetti fittizi sono utili per isolare gli unit test da dipendenze. Nei sistemi software complessi, vi sono spesso qualsiasi numero di pezzi che si basano su un altro. Il problema diventa quindi isolando quale parte del sistema non quando qualcosa va storto.

Ad esempio, supponiamo di avere un metodo chiamato logToServer() , che è quello di creare uno XMLHttpRequest oggetto e inviare un messaggio al server. Se il test include l'oggetto effettivo XHR nel tentativo di verificare la funzionalità, si hanno due principali dipendenze: l'oggetto XHR stesso e il server. Se uno di questi due dipendenze falliscono, allora il test ha esito negativo anche se non è il tuo codice che è la colpa. Utilizzando un oggetto fittizio XHR, è possibile testare il codice in isolamento e garantire che funziona. Ad esempio:

  / / Crea un nuovo oggetto finta
 var = mockXhr Y.Mock (); 

 / / Mi aspetto che il metodo open () di essere chiamata con gli argomenti indicati 
 Y.Mock.expect (mockXhr, { 
     metodo: "aperto", 
     args: ["? / log.php msg hi =" "get", vero]                             
 }); 
 
 / / Mi aspetto che il metodo send () di essere chiamata con gli argomenti indicati 
 Y.Mock.expect (mockXhr, { 
     metodo: "invia", 
     args: [null]                             
 }); 
 
 / / Ora chiama la funzione 
 logToServer ("hi", mockXhr); 
 
 / / Verificare le aspettative sono state soddisfatte 
 Y.Mock.verify (mockXhr); 

Questo esempio crea un oggetto fittizio XHR che viene utilizzato al posto di un oggetto XHR regolare. Una volta che tutte le operazioni sono state completate, il codice di verifica che i metodi previsti che sono stati chiamati. Il test di simulazione YUI oggetto API è volutamente minimale di essere il più chiaro e utile possibile. Per ulteriori informazioni su oggetti mock nei test YUI, vedere la documentazione .

Nomi di test amichevoli

YUI test inizialmente utilizzato il xUnit stile di metodi di prova in cui il nome di ogni metodo di prova deve iniziare con test . Test di YUI 3.0.0 per compie un ulteriore passo avanti, che consente di specificare i nomi di test amichevoli in xUnit supplementari, i nomi in formato. Nomi semplici frasi sono più di ogni altra cosa, e l'unica limitazione è che il nome contenga almeno uno spazio e la parola "dovrebbe". Ad esempio:

  var = new testCase Y.Test.Case ({ 
     
     name: "Nome TestCase", 
    
     / / XUnit-style nome test
     testSomeFunction: function () {
    
     },
    
     / / Nome del test amichevole
     "Qualcosa dovrebbe accadere qui": function () { 
         ... 
     } 
 }); 

Nomi test animali consentono di descrivere la funzionalità in prova in modo più leggibile. Scrivere una frase come "metodo deve restituire 4 quando viene passato 2 e 2", e dopo aver che compaiono nei risultati della prova, rende più facile interpretare i risultati dei test e che altro deve essere affrontato.

Qual è il prossimo?

YUI test continua ad evolversi e crescere come il feedback ricevuto dagli sviluppatori. Ci sono alcune funzionalità attualmente in lavorazione:

• Altri formati del risultato del test, come JUnit XML e TAP.
• Code coverage raccolta e reporting.
• L'automazione di test con Selenium.

Se avete idee o commenti, ci piacerebbe sentire da voi al YUILibrary.com , dove è possibile presentare richieste di nuove funzionalità o iniziare una discussione nel forum . Con il vostro aiuto, Test YUI può continuare ad evolversi per soddisfare le esigenze del sempre mutevole comunità di sviluppo web.

Trova le conversazioni: bloglines | technorati

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

Attuazione Focus: Insight modello

A proposito di modello Insight

Insight modello offre soluzioni potenti per indicizzare, cercare e analizzare i dati semi-strutturati. Con il termine "semi-strutturato" si intende qualsiasi tipo di dati di sistema - code, tronchi, script e altro ancora.

Attualmente abbiamo due grandi suite software: ". Insight Log" "Codice Insight" e

Codice Insight fornisce diverse funzionalità esclusive per analizzare il codice sorgente. Al centro vi è un fulmine veloce ricerca di snippet sfocata che scala a miliardi di righe di codice. Con la ricerca di snippet, è possibile incollare in un frammento di codice e trovare tutti i frammenti simili in tutta la vostra intera base di codice, anche tollerando le modifiche ai nomi delle variabili o linea di inserimenti / cancellazioni. Costruito in cima a questa funzionalità di ricerca fuzzy è Patch Miner, un'applicazione per individuare il codice buggy che deve essere risolto. È possibile inserire una correzione di bug e Miner Patch troverete tutte le altre località in cui tale bug fix deve essere applicato. Infine, abbiamo Miner Pattern, una copia-incolla e rilevatore di duplicazione. Miner modello può aiutare a refactoring del codice di base per trovare automaticamente codice duplicato, anche se sono cambiati i nomi delle variabili. Si può anche rilevare perdite IP attraverso diverse basi di codice: ad esempio, se si utilizza sia open source e codice proprietario e si desidera evitare che il codice di fluire tra di loro.

Log Insight è la nostra prossima generazione di log di ricerca e analisi del prodotto. Entra Insight in grado di indicizzare TB di dati del sistema e fornire prestazioni inferiori al secondo per le query di ricerca complesse. Inoltre, esso consente la creazione di firme persistenti che possono essere utilizzati per acquisire nuovi dati o archiviati per le partite istantanei. Log Insight può anche estrarre automaticamente i modelli comuni (ad esempio per i guasti) che possono poi essere codificati come le firme di nuovo al motore Insight Pattern.

L'importanza della UI

Ci rendiamo conto che in possesso di grande tecnologia di base non è sufficiente per creare un prodotto di successo. Una buona interfaccia è assolutamente essenziale se vogliamo che gli utenti siano in grado di vedere il valore della nostra tecnologia e trarre il massimo vantaggio di esso. In questo modo i requisiti per guidare le nostre interfacce utente gran parte dello sviluppo della nostra tecnologia backend.

Come esempio, un prodotto come il Patch Miner dipende fortemente l'interfaccia utente per darle forma. Al suo livello più alto, Patch Miner è un concetto piuttosto astratto: "trovare tutti i luoghi dove un bug fix deve essere applicato nella mia base di codice." Trasformare questo in una UI di cemento fornisce molte difficoltà design unico. Per esempio, che cosa esattamente è un "bug fix" e qual è il modo migliore per un utente di inserirlo? E una volta che Patch Miner ha trovato un bug da qualche altra parte, qual è il modo migliore per presentare il risultato per l'utente? Risolvere questi problemi di esperienza utente ha fornito la road map per lo sviluppo della domanda di Miner nucleo Patch.

Utilizzando YUI al modello Insight

Le interfacce utente per il codice Insight e Log Insight sono completamente web-based, e stiamo utilizzando YUI pesantemente per migliorare l'esperienza dell'utente. Quando ci sono stati inizialmente cercando di decidere quale framework JS da usare, c'erano due cose che ci ha venduti sul YUI: la vasta documentazione e la grande varietà di componenti già pronti e widget. Abbiamo finito per fare uso di quasi tutti: animazione , autocomplete , pulsante , calendario , Connection Manager , container , dei cookie , datasource , la storia , JSON , cursore , visualizzazione a scheda , treeview , loader , logger , di prova , e di base CSS / resettare / fonts / griglie .

Il mantenimento di alte prestazioni in un'applicazione Rich

La nostra strategia principale di mantenere la nostra ricca applicazioni performante è stato quello di sviluppare la nostra API di servizi web che usiamo per caricare i dati on-demand, per quanto possibile. Il supporto integrato per il caricamento on-demand in widgets YUI treeview come ha fatto questo molto più facile per noi. Abbiamo anche preso la decisione di smettere di sostenere IE 6. Questo ci ha permesso di usare Javascript molto più sofisticati che i browser moderni, in grado di gestire, ma IE 6 non può.

Most Interesting YUI attuazione Caratteristiche

Abbiamo sviluppato un bel po 'dei nostri widget personalizzati, tra cui un multi-select list con capacità di filtraggio e un auto-ridimensionamento casella di testo che cresce e si restringe in base all'input dell'utente. Cose come auto-ridimensionamento potrebbe sembrare minore, ma credo che molti utenti concordano sul fatto che le piccole cose come questa sono spesso la differenza tra il dolore e la gioia quando si utilizza un'interfaccia.

Inoltre, esclusivamente dal punto di vista dello sviluppo, il nostro uso del caricatore YUI rende molto facile scrivere velocemente nuove pagine. Si può facilmente cadere in tutto ciò che vogliamo in una determinata pagina, sia widget standard YUI o nostra. In sostanza, nella parte superiore di ogni pagina abbiamo solo bisogno di chiamare la nostra funzione "loadModules" e dare la lista dei componenti che vogliamo usare, oltre a una funzione di callback:

  YAHOO.PI.loadModules (['ad albero', 'PI.SelectableList'], function () {... 

Stiamo ancora usando YUI 2 , ma questo funziona in modo simile al nuovo YUI().use la funzione in YUI 3 .

Cosa c'è di nuovo?

Siamo attualmente al lavoro sul codice Insight 1.6, la prossima major release, che sarà disponibile con alcuni miglioramenti impressionanti a Patch Miner. Stiamo anche sviluppando attivamente la prossima versione di Log Insight, che includerà un nuovo brand, l'interfaccia utente altamente sofisticata. Tra le nuove caratteristiche sono un editor web-based firma con evidenziazione della sintassi dal vivo, completamento automatico e il controllo degli errori.

Se siete interessati a saperne di più su di noi, potete leggere sui nostri prodotti e verificare alcuni video sul nostro sito: http://www.patterninsight.com . Inoltre, non esitate a contattarci via email a info@patterninsight.com.

Trova le conversazioni: bloglines | technorati

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