Sentido Web

HTML5 a parte de añadir nuevas etiquetas, también incluye otras posibilidades javascript, como los Web Workers, los cuales permiten ejecutar scripts en paralelo (background). Por ejemplo, tenemos un proceso costoso en recursos que no es interrumpible, podemos utilizar un Worker y evitar que el navegador se nos colapse.

Su uso es bastante sencillo, se instancia un Worker que estará en un fichero javascript independiente, se indica qué hacer cuando se reciba un mensaje y ya solo queda que el javascript y el Worker se comuniquen mandándose mensajes.

El script que instancia el Worker sería así:

// Crea el Web Worker
var worker = new Worker("worker.js");
 
// Envía un mensaje al worker
worker.postMessage(0);
 
// Recibe los mensajes del Worker
worker.onmessage = function (evt) {
	// evt.data es el valor devuelto por el Worker
	alert(evt.data);
}
 
// Trata los errores
worker.onerror = function (evt) {
	alert(evt.data);
}

Y el worker.js sería el siguiente:

// Ejemplo de Worker
onmessage = function (evt) {
    // evt.data es el valor enviado desde el javascript
    for (var i=evt.data, il=1000001; i<il; i++) {
        // Envía datos continuamente
        postMessage(i);
    }
}

Los Workers también admiten el evento onconnect, aunque tan sólo he visto que funcione en Webkit:

onconnect = function(evt) {
  postMessage('Hola, acabas de conectarte al Worker');
}

Using HTML5 Web Workers to have background computational power

El que los navegadores antiguos o IE no acepten etiquetas HTML5 no suele ser un problema a la hora de mostrarlas, el problema viene a la hora de aplicar estilos e IE que no le aplica los estilos, ya que IE ignora las etiquetas.

header { /* sus estilos */ }
section { /* sus estilos */ }
footer  { /* sus estilos */ }

Para ponerle solución, se puede crear un elemento dinamicamente antes de aplicar los estilos, y por arte de magia (o desesperación) tendrá los estilos al elemento.

<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

html5shiv

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