Javascript

JsLoad: carga de librerías remota

ByLuis April 2, 2009

JsLoad permite cargar librerías Javascript desde los servidores de Google, no tienes que preocuparte por las dependencias de otras librerías, ya que JsLoad se encarga de cargar las dependencias automáticamente.

Además se pueden cargar diferentes versiones de una misma librería, no necesariamente la última versión. Entre las librerías que se pueden cargar nos encontramos: ExplorerCanvas, Facebox, JavaScript-XPath, jQuery, JSDeferred, Lightbox, MooCanvas, MooTools, Processing.js, Prototype, script.aculo.us, Taffy DB y textMonster.
JsLoad
Vía / meme

Javascript

Hacer drag & drop de ficheros fuera del navegador con Chrome

ByLuis August 18, 2010

Hace tiempo comenté cómo hacer drag & drop directamente sobre el navegador, lo cual nos venía muy bien para subir ficheros (por ejemplo para un correo, galería de fotos, …). Esta vez se trata de descargar ficheros directamente desde el navegador, algo que permite GMail desde Chrome.

El autor de este post lo ha tenido difícil para poder ver cómo lo hace Google, pero al final el código es bastante sencillo:

var file = document.getElementById("dragout");
 
file.addEventListener("dragstart",function(evt){
    evt.dataTransfer.setData("DownloadURL",fileDetails);
},false);

Sólo disponible en Chrome

Drag out files like Gmail

Javascript

SoundManager 2: controla el sonido desde Javascript

ByLuis July 8, 2008

SoundManager 2 es un API de Javascript que permite controlar el sonido ofrecido por un control Flash. Disponible para la mayoría de los navegadores, es necesario tener instalado el plugin para Flash (logicamente) y no intrusivo.

Un ejemplo de uso sería:

soundManager.createSound({
id: 'mySound',
url: '/path/to/some.mp3',
autoPlay: true,
pan: -75,
volume: 50
});

La verdad es que los ejemplos que ofrecen son increíbles:

SoundManager 2

SEO

Protocolo para Sitemaps de Google adoptado por Yahoo y Microsoft

ByLuis November 16, 2006

Yahoo y Microsoft han adoptado el protocolo que Google sacÃ³ en el 2005 para que los administradores de sitios web puedan incluir sus pÃ¡ginas en Google y saber si han sido indexadas por este. AsÃ, las tres compaÃ±ias adoptarÃ¡n el Sitemaps 0.90 para que esta labor sea Ãºnica y mÃ¡s sencilla.
Para los usuarios, permite gran calidad de servicio y resultados actualizados. Al menos los usuarios ganamos con todo esto, lo cual no es poco, esperamos que sigan con este tipo de iniciativas conjuntas.
VÃa / CNET News.com

Javascript

Boomerang: medición de rendimiento desde la perspectiva del usuario

ByLuis July 28, 2010

Boomerang es una librería desarrollada por Yahoo que permite medir diferentes aspectos de rendimiento de nuestra web desde la perspectiva del usuario final. Añadiendo un script y distintas funciones, podemos comprobar diversos aspectos de nuestra web como:

El tiempo que el usuario cree que tarda en cargarse la web
El tiempo de carga de contenido dinámico
El ancho de banda durante la carga de la página
Tiempo de carga de diferentes módulos, por ejemplo módulos de Twitter o Facebook
Latencia HTTP
Latencia DNS

BOOMR.init({
  user_ip: "",
  beacon_url: "http://yoursite.com/path/to/beacon.php",
  BW: {
    base_url: 'http://yoursite.com/path/to/bandwidth/images/"
  }
});

Además permite etiquetar páginas para realizar distintos tests y poder compararlos, realizar tests a usuarios aleatorios y evitar abusos de uso

Boomerang

Vía / WebAppers

Javascript | Yahoo

YSlow: añadido de Firebug de Yahoo

ByLuis July 25, 2007

YSlow es un plugin para Firefox que aÃ±ade una nueva pestaÃ±a a Firebug, la cual realiza informes de las pÃ¡ginas que visitamos y nos indica por quÃ© es lenta segÃºn algunas reglas de rendimiento.

Muestra una evaluaciÃ³n de cada posible regla de rendimiento, mostrando estadÃsticas de ellas. AdemÃ¡s indica que componentes estÃ¡n instalados y hace una comparativa entre la pÃ¡gina visitada con cachÃ© o sin cachÃ©.
Una extensiÃ³n muy a tener en cuenta.
YSlow
VÃa / OpenSourceCommunity.org

Javascript

Coverflow: visualización de imágenes estilo iPhone

ByLuis September 2, 2008

Muy buena librería javascript que nos permite visualizar imágenes como la galería de carátulas que ofrece el iPhone. La transición entre imágenes será mediante una rotación en 3D (un lado es más alto que otro mientras se va colocando en la posición correcta).

Muestra etiquetas y efecto de reflejo, y su uso es muy sencillo: tan solo habría que ejecutar un script similar a este:

code lang="javascript">Coverflow.init(
[
{src: 'img/img-0-lo.jpg', label: {album: 'All That I Am', artist: 'Santana'}},
{src: 'img/img-1-lo.jpg', label: {album: 'August & Everything After', artist: 'Counting Crows'}},
/* ... */
{src: 'img/img-10-lo.jpg', label: {album: 'Viva la Vida', artist: 'Coldplay'}},
{src: 'img/img-11-lo.jpg', label: {album: 'We Were Here', artist: 'Joshua Radin'}}
],
{
createLabel: function(item)
{
return item.label.album +'
'+ item.label.artist;
},
onSelectCenter: function(item, id)
{
var img = new Image();
img.onload = function()
{
Lightbox.show(this.src, id);
};
img.src = item.src.replace('-lo.jpg', '-hi.jpg');
}
});

JS Coverflow

Similar Posts