Yahoo! UI Library

Yahoo! UI Library (YUI)
Información general
Tipo de programa	Biblioteca de Javascript
Desarrollador	Yahoo!
Licencia	BSD License
Información técnica
Programado en	JavaScript
Versiones
Última versión estable	3.8.0 (11 de diciembre de 2012)
Enlaces
	Sitio web oficial Repositorio de código
	[editar datos en Wikidata]

Yahoo User Interface(YUI) es una biblioteca escrita en JavaScript para la construcción de aplicaciones interactivas (RIA). Se utilizaba para el desarrollo de aplicaciones web con apariencia de aplicaciones de escritorio, con componentes vistosos y personalizables y con una fuerte presencia de llamadas AJAX. Fue liberada por Yahoo con licencia BSD en el año 2005. En agosto de 2014 Yahoo anunció el cese de su desarrollo, motivado por los cambios en la industria, las mejoras en la adopción de estándares por parte de los navegadores, la progresiva pérdida de interés en una biblioteca grande como YUI, y la proliferación de soluciones server-side.^[1]

Características

La biblioteca está completamente documentada en su página web y se compone de seis componentes: Núcleo YUI, utilidades, controles UI, componentes CSS, herramientas de desarrollo y de construcción.

Núcleo

El núcleo de YUI es un ligero conjunto de herramientas (31KB la versión compacta) para manejar eventos y manipular el árbol DOM.

YAHOO Global Object Archivado el 27 de octubre de 2008 en Wayback Machine.: Los Objetos Globales Yahoo contienen utilidades y otras infraestructuras base para la biblioteca.
Dom Collection Archivado el 27 de octubre de 2008 en Wayback Machine.: Ayuda para la manipulación del árbol DOM, incluyendo posicionamiento de elementos y gestión de estilos CSS.
Event Utility Archivado el 27 de octubre de 2008 en Wayback Machine.: Permite acceder de forma segura y sencilla a los eventos de un navegador web y, mediante el objeto Custom Event, publicar y suscribirse a eventos customizados.

Utilidades

Animation (enlace roto disponible en Internet Archive; véase el historial, la primera versión y la última).: Ayuda a crear efectos animados.
Browser History Manager Archivado el 28 de octubre de 2008 en Wayback Machine.: Ayuda complementaria para el botón Atrás y la gestión de Marcadores/Favoritos de los navegadores web.
Connection Manager Archivado el 27 de octubre de 2008 en Wayback Machine.: Ayuda para manejar el objeto XMLHttpRequest.
Cookie Archivado el 27 de octubre de 2008 en Wayback Machine.: Permite gestionar las cookies.
DataSource: Proporciona una interfaz común para que otros componentes puedan interactuar con diferentes tipos de datos.
Drag and Drop Archivado el 27 de octubre de 2008 en Wayback Machine.: Facilita la creación de eventos y elementos que pueden ser arrastrados.
Element Archivado el 28 de octubre de 2008 en Wayback Machine.: Proporciona una capa para los elementos que facilita el añadido de escuchadores, manipulación del árbol DOM y atributos 'get' y 'set'.
Get Archivado el 27 de octubre de 2008 en Wayback Machine.: La utilidad Get soporta la carga asíncrona de datos y archivos de estilos CSS externos.
ImageLoader Archivado el 27 de octubre de 2008 en Wayback Machine.: Permite aplazar la carga de imágenes que no son visibles durante la carga de la página, proporcionando un aumento del rendimiento.
JSON: Proporciona métodos para el tratamiento de datos JSON. Estos métodos están basados en el trabajo de Douglas Crockford.
Resize Archivado el 28 de octubre de 2008 en Wayback Machine.: Permite redimensionar los elementos HTML.
Selector Archivado el 27 de octubre de 2008 en Wayback Machine.: Permite referenciar elementos HTML mediante la sintaxis CSS3.
YUI Loader Archivado el 27 de octubre de 2008 en Wayback Machine.: Es un cargador del lado cliente que permite la carga de forma dinámica de cualquier componente y dependencia de la biblioteca al vuelo.

Controles

AutoComplete: Proporciona la función de auto completado (lista de sugeridos) para los usuarios. Soporta varios formatos de datos, tanto del lado cliente como del lado servidor (vía XMLHttpRequest).
Button Archivado el 27 de octubre de 2008 en Wayback Machine.: Permite la creación de botones gráficos que funcionan como un botón tradicional en HTML.
Calendar Archivado el 27 de octubre de 2008 en Wayback Machine.: Un calendario gráfico y de control dinámico.
Charts Archivado el 27 de octubre de 2008 en Wayback Machine.: Permite la creación de diferentes tipos de gráficos (lineales, de barras, etc.).
Color Picker Archivado el 27 de octubre de 2008 en Wayback Machine.: Proporciona una interfaz gráfica para la selección de colores.
Container Archivado el 27 de octubre de 2008 en Wayback Machine.: Proporciona una interfaz gráfica como Tooltip, paneles, cuadros de diálogo, etc.
DataTable Archivado el 27 de octubre de 2008 en Wayback Machine.: Una potente herramienta para mostrar tablas tabulares en una página web. Permite la ordenación de columnas tanto en el lado cliente como en el servidor, paginación, scroll, selección de filas, redimensionado de columnas y edición inline.

A continuación se muestra un ejemplo de declaración con el uso del componente DataTable:

//Declaración del conector al DataTable
var myDataSource = new YAHOO.util.DataSource(myHugeDataSet);
//Tipo de respuesta del DataSource
myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSARRAY;
//Definiendo la estructura del DataSource
myDataSource.responseSchema = { fields : [ "id","nombre","edad" ] };
//Definición de cada columna del DataTable que debe ser igual a la del DataSource
var myColumnDefs = [ {key:"id"}, {key:"nombre"}, {key:"edad"} ];
//Cantidad de Registros en la variable de configuración del DataTable
var myTableConfig = { renderLoopSize : 20 };
/*
Creación del DataTable pasándole como parámetros el nombre, la definición de las 
columnas, el datasource o recurso de donde se obtienen los datos, y por último 
la configuración general del DataTable
*/
var myDataTable = new YAHOO.widget.DataTable('tbl', myColumnDefs, myDataSource, myTableConfig);

ImageCropper Archivado el 27 de octubre de 2008 en Wayback Machine.: Proporciona una interfaz gráfica para recortar una imagen desde el lado cliente.
Layout Manager Archivado el 28 de octubre de 2008 en Wayback Machine..
Menú Archivado el 27 de octubre de 2008 en Wayback Machine.: Proporciona una API para la creación de menús flotantes, barras de menú y menús de contexto.
Rich Text Editor Archivado el 28 de octubre de 2008 en Wayback Machine.: Es un sofisticado editor de texto rico modular del lado cliente y muy configurable.
Slider Archivado el 27 de octubre de 2008 en Wayback Machine.: Proporciona un elemento genérico que permite al usuario elegir entre un rango de valores.
TabView Archivado el 27 de octubre de 2008 en Wayback Machine.: Permite la navegación entre pestañas, soportando la carga dinámica de contenido vía XMLHttpRequest.
TreeView Archivado el 27 de octubre de 2008 en Wayback Machine.: Añade un árbol de contenido con nodos que se pueden contraer y expandir para navegar por los elementos.
Uploader Archivado el 27 de octubre de 2008 en Wayback Machine.: Permite la carga de varios archivos mostrando una barra de progreso.

Recursos CSS

CSS Base Archivado el 27 de octubre de 2008 en Wayback Machine.: Utilidades para la manipulación de la hoja de estilos de la forma clásica.
CSS Grids.
CSS Fonts.
CSS Reset.

Herramientas de desarrollo

Logger Archivado el 28 de octubre de 2008 en Wayback Machine.: Permite escribir mensajes de log en una consola, o utilizar las que proporcionan la extensión Firebug para el navegador Mozilla Firefox o la consola JavaScript del navegador Safari.
Profiler Archivado el 2 de noviembre de 2008 en Wayback Machine.: Para perfilar el código JavaScript.
ProfilerViewer Archivado el 28 de octubre de 2008 en Wayback Machine.: Usado con el anterior componente (Profiler) proporciona un perfilado visual.
YUI Test Archivado el 28 de octubre de 2008 en Wayback Machine.: Permite añadir unidades de testeo al código JavaScript.

Herramientas de construcción

YUI Compressor Archivado el 27 de octubre de 2008 en Wayback Machine.: Es un compresor de código JavaScript y CSS diseñado para proporcionar un resultado 100% seguro.

Véase también

Referencias

↑ Important Announcement Regarding YUI, Yahoo Engineering, 29 de agosto de 2014.

Enlaces externos

Datos: Q2300096
Multimedia: YUI Library / Q2300096

[1] Important Announcement Regarding YUI, Yahoo Engineering, 29 de agosto de 2014.

[1]