Contenido

Notificaciones de escritorio con WebKit

22 abr

+ 13

Las últimas versiones de WebKit integran una característica realmente interesante. La capacidad de enviar notificaciones al escritorio desde una aplicación web.

Picture 4
(Ver Imagen)

Estas notificaciones están disponibles mediante Javascript y nos permiten informar al usuario de que algún proceso en la página web ha terminado o se requiere cierta atención sobre ella.

function Notifier() {}

// Devuelve "true" si el navegador dispone del soporte
Notifier.prototype.HasSupport = function() {
  retun (window.webkitNotifications);
}

// Petición de permisos para enviar notificaciones desde esa URL.
Notifier.prototype.RequestPermission = function(cb) {
  window.webkitNotifications.requestPermission(function() {
    if (cb) { cb(window.webkitNotifications.checkPermission() == 0); }
  });
}

// Mostramos la notificación indicando icono, título y cuerpo
Notifier.prototype.Notify = function(icon, title, body) {
  if (window.webkitNotifications.checkPermission() == 0) {
    var popup = window.webkitNotifications.createNotification(
      icon, title, body);
    popup.show();
    return true;
  }
  return false;
}

Podemos ver un ejemplo funcionando (desde Chrome o versiones de Webkit más modernas)  (código fuente).

Me suena haber leído algo acerca de una propuesta de estándar para cambiar los odiosos alert() que te llevan a la página que lo provoca automáticamente. Algo realmente molesto. Pero no encuentro donde lo leí, así que si alguien sabe de lo que hablo agradecería me hicieran llegar el artículo.

Via

Lawnchair, almacenamiento DOM mediante JSON

12 dic

+ 3

Lawnchair es un librería que nos permite almacenar en el clientes datos en formato JSON, ideal para navegadores móviles basados en Webkit que nos permitirá aligerar el peso de una forma simple y elegante.

var people = new Lawnchair('people');

/* GRABAMOS */

// Grabamos un elemento
var me = {name:'brian'};
people.save(me);

// Grabamos un elemento de forma asíncrona
people.save({name:'frank'}, function(r) {
 console.log(r);
});

// Especificamos nuestra propia clave a nuestro elemento
people.save({key:'whatever', name:'dracula'});

/* CARGAMOS */

// Recogemos el elemento
people.get(me.key, function(r){
 console.log(r);
});

// Recupera todos los elementos en forma array
people.all(function(r){
 console.log(r);
});

// Sintaxis corto para recuperar todos los elementos
people.all('console.log(r)');

Como podemos ver la sintaxis es realmente sencilla de usar, ideal para deshacernos de esas cookies anticuadas de nuestras aplicaciones.

Ver código fuente. / Descargar

Compatibilidad con WebKit

13 oct

+ 3

En Ajaxian nos muestra una gráfica que muestra la compatibilidad con WebKit de los diferentes navegadores que lo usan como motor de renderizado.

webkitcompattests
(Ver Imagen)

En la imagen, vemos que Safari 4.0 está a la cabeza con casi el 100% de compatibilidad(94,4%), seguido de la última versión de Google Chrome (la 3.0) (88,8%).

Llama la atención lo lejos que están los navegadores móviles en esta gráfica, ya que el primero que nos encontramos es Ozone, un navegador que aún no ha salido oficialmente y que estará disponible para sistemas Symbian, que implementa el 85% de las funcionalidades de WebKit.

En segunda posición nos encontramos el navegador del iPhone 3.1 con tan solo el 79,6% de funcionalidades. Y el primer navegador disponible en Android (G2 en Donut (Android 1.6)) tan solo implementa un 66’6% de las funcionalidades.

Sin duda, esto ha de verse como un toque de atención a los desarrolladores móviles que implementan WebKit para ponerse las pilas e incorporar nuevas funcionalidades a los navegadores y ponerlas en nuestras manos (y nunca mejor dicho :D)

El navegador del HTC Magic

4 may

+ 22

Hace dos días que tengo el HTC Magic y ya puedo decir que es el mejor móvil que he tenido nunca. Cumple con todo lo que tenía en mente que podría conseguir con él. Incluso el navegador es una sorprendente versión actual de WebKit que nos permite visualizar un 93/100 en el Acid3 Test.

WebKit y la personalización de los scrollbars

20 mar

+ 1

La última versión de WebKit ya dispone de la posibilidad de dar le estilos a los scrollbars de los elementos con overflow. Esto abre un abanico de posibilidades y elimina la necesidad de usar técnicas basadas en Javascript para conseguirlo. [Demo]

element.getBoundingClientRect() tambien en WebKit

12 feb

+ 0

Michael Smith, nos cuenta que la última versión de WebKit soportará esta propiedad, una propiedad que Internet Explorer 5 fué el primero en incorporar y que hace casi un año  John Resig explicó como lo habían integrado en Firefox 3.

element.getBoundingClienteRect() es una propiedad que devuelve un cuadrado, un objeto TextRectangle compuesto por la unión de rectángulos de texto devueltos por getClientRects() ideal para conocer las 4 esquinas de cualquier elemento, similar a las border-XXX del CSS.

Ejemplo

document.getElementById("pageText").getBoundingClientRect();
// --> ClientRect left = "45.5" top = "108.16667175292969" bottom = "1237.2666015625" right = "1215.5"

Descargar

Changeset 40837

Extiende las posibilidad de Inspector de WebKit

5 ene

+ 2

Inspector es el Firebug de WebKit/Safari y hace ya tiempo que vamos viendo su evolución y la adquisición de nuevas mejoras que completaban esta herramienta del navegador

Alvaro Videla ha extendido las posibilidades añadiendole un juego que ha portado de uno hecho en ActionScript del concurso de 25lines.com

fun_panel

El resultado, poco útil, permite ver las posibilidades y la facilidad de extender esta herramienta para ofrecernos ayudas y mejoras propias con el fin de personalizar y facilitar nuestra tarea.

Via

SquirrelFish Extreme entre en el juego de los motores JS

19 sep

+ 4

La aparición de Google Chrome ha hecho mover ficha a los demás navegadores para poder competir con los resultados obtenidos con V8 en el procesamiento de Javascript.

Después de la aparición de Chrome, TraceMonkey se ha visto obligado a formar parte por defecto de las última versiones de Firefox 3.1 (recordemos que antes había que activarlo manualmente). Tras muchas pruebas y muchas líneas explicando las maravillas de ambos se demostró que los resultados de uno y de otro son prácticamente similares y que mejoran sustancialmente lo que actualmente procesa el Javascript en los navegadores actuales.

SquirrelFish Extreme es una modificación de SquirrelFish, el motor de procesamiento de Javascript usado en WebKit. Esta versión promete destronar a los actuales reyes del Javascript (V8 y TraceMonkey) mostrando unos resultados realmente espectaculares.

  • SquirrelFish Extreme:    943.3 ms
  • V8:    1280.6 ms
  • TraceMonkey:    1464.6 ms

Estos valores, sacados de Summer of Javascript Core, nos muestran la mejoría de un 36% sobre V8 de Chrome y un 55% sobre TraceMonkey de Firefox.

Partiendo de que SquirrelFish era un gran motor de Javascript, esta nueva versión duplica en velocidad de procesamiento a su predecesor. El gráfico es bastánte ilustrativo.

sfx-perf

Como con todas las mejoras que WebKit anuncia, están disponibles desde este mismo momento.

WebKit añade nuevas mejoras al Inspector

8 sep

+ 0

Hace ya más de un año WebKit incluyó en su navegador un inspector web de lo más vistoso. El Firebug de WebKit se ha convertido en la mejor herramienta preferida por los desarrolladores a la hora de depurar y refinar sus diseños en Safari/WebKit (y ahora Google Chrome).

dom-editing

Hoy anunciaban una serie de mejoras que podemos disfrutar en la última nighty versión.

  1. Propiedades DOM y variables local pueden editarse, por fin podremos alterar las propiedades DOM de los elementos de nuestra página.
  2. Console.count, permite controlar el número de veces que se ejecuta un código.
  3. Tab Metrics editable, posibilidad de editar las medidas de nuestros elementos desde el tab metrics.
  4. Canvas Text, implementación necesaria para disponer de texto Canvas en 2D.

SquirrelFish acelerando el Javascript de Webkit/Safari

3 jun

+ 5

Los chicos de WebKit, anuncian hoy SquirrelFish, una implementación completamente nueva y revolucionaria del interprete de javascript para el motor de WebKit/Safari.

squirrelfish-webkit-graph

Desde su salida, apenas unas 12 horas ya se han comparado los resultados con las principales promesas en cuanto a navegadores web se refiere, dejándolos a la altura del betún.

WebKit r34318: 2248.0 ms

Firefox 3.0 RC1: 3288.0 ms

Opera Snapshot 4844: 6012.2 ms

La diferencia es significativa, siendo más rápido que Firefox 1,46 veces y 2,67 veces más rápido que Opera. Todo ello sobre un MacBook Pro 2.16 GHz Core 2 Duo sobre Mac OS X 10.5.3.

Esto es una gran noticia para como van evolucionando las cosas con respecto al javascript, que cada vez más se está consolidando como un lenguaje necesario para mejorar la experiencia del usuario. Mientras más velocidad, más posibles funcionalidades podrán ser implementadas para ayudar al usuario.

Como curiosidad os dejo estas comparaciones con Safari 3.0 y Safari 3.1, en las que podemos ver la mejoría entre la versión 3.0 y la 3.1 de este navegador.

Como nos tienen acostumbrados podemos testearlo nosotros mismos desde la última revisión disponible.