En el pasado JSConf de Europa, Ryan Seddon realizó una excelente charla sobre todo el proceso de un navegador web (como Firefox, Chrome, Edge o Safari) para visualizar una página web.
Este proceso me parece un tema esencial para todo desarrollador web (tanto frontend como backend), sin embargo, he notado que son pocos quienes saben el proceso de dibujado de la página web y al momento de crear sitios web, no lo hacen de forma correcta o muy deficiente, causando problemas de rendimiento en equipos con poca capacidad de cómputo.
Ryan Seddon: So how does the browser actually render a website | JSConf EU 2015
Por los momentos solo está en inglés, pero pueden activar la traducción de subtítulos de Youtube a español y disfrutar un poco del video si no entienden el idioma original del vídeo.
Si quieres seguir investigando sobre este tema, les recomiendo lee este largo pero interesante artículo titulado How browsers works (Cómo funcionan los navegadores), espero que les sea de gran utilidad para futuros desarrollos.
Ayer salió la primera beta pública del navegador de Google Chrome para los dispositivos con Android 4.0, y decidí probarlo en mi Nexus S porque el navegador por defecto de Ice Cream Sandwish no me gusta y Firefox Mobile es pesado por los momentos.
Primera impresión
Una vez instalado es que abre a la misma velocidad del navegador integrado, pero la apariencia es mas simple y se conecta a mi cuenta de google para sincronizar los marcadores, datos formularios y pestañas abiertas en otros dispositivos. Como nunca uso Chrome para el día a día, no sincronizó nada. Lo primero que hice fue abrir la versión de Twitter para dispositivos móviles, abrió mas rápido que el navegador oficial y el código javascript me pareció que se ejecutó mas fluido, luego abrí facebook para móviles y observé lo bien que se manejan las pestañas en Chrome para Android.
Navegación múltiple
En la esquina superior derecha, se puede ver un boton cuadrado que permite acceder a las pestañas abiertas, las cuales muestran todo el contenido de cada página abierta y podemos cambiar entre ellas fácilmente, al hacer clic en cerrar se deslizara la pestaña hasta un lado y desaperece con una gran animación. Otra manera de intercambiar entre pestañas, es tocando el borde del navegador y deslizando el dedo hacia un lado, de nuevo me sorprende la velocidad de cambio entre las páginas a diferencia de cualquier otro navegador para Android.
Cambio de páginas entre pestañas
Vista de las pestañas abiertas
Skatox.com en Chrome para Android
Marcadores
Sincronización de datos
Prueba de acid test
Para los desarrolladores
Leyendo la documentación, este navegador soporta Request Animation Frame (solo realiza animaciones mientras tengamos la pestaña de ella abierta), FullScreen API (páginas a pantalla completa), Page Visibility API e IndexedDB (Base de datos de HTML5). Además permite realizar debugging remoto, excelente para depurar las páginas web diseñadas para verse bien en nuestro dispositivo móvil. Algo único para un navegador de un sistema móvil, además la mayoría de las páginas detecta sin problema como móvil debido a la poca modificación de los encabezados (user agent).
Realmente es el mejor navegador para Android, a pesar de ser BETA es muy estable. Lamentablemente solo está para Android 4.0 así que muy pocos podemos disfrutarlo, lo único que me preocupa es el hecho de que los sitios móviles se están adaptando solo a navegadores Webkit y no a todos los móviles, por eso al usar Firefox no veremos las páginas tan complejas como al usar el navegador de Android o el del iPhone.
Para usar el navegador, simplemente descárguenlo del market.
Hace unos años (18 años) salió Doom para PC, un juego revolucionario por su gran motor gráfico, altos requerimientos de hardware y un alto nivel de violencia. Luego de su gran popularidad, id Software liberó su código fuente bajo GPL en 1997 haciendo que el juego fuese migrado literalmente a casi todo lo que corra software (podemos ver Doom en teléfonos, consolas nuevas y antiguas, emuladores, etc).
Pues anoché vi un experimento en MDN (Mozilla Developer Network) de Doom corriendo nativamente en un navegador gracias a un desarrollador que logró migrar Doom a Javascript, realmente me impresionó la calidad del trabajo pues a pesar de ser su primer release se puede jugar muy bien. Utiliza la tecnología Canvas de HTML5 y Javascript, utiliza los .wads del demo por cuestiones de licencia, por ahora no permite grabar partidas pero el creador prometió usar las base de datos de HTML5 para guardar información e ir agregando nuevas características.
Doom corriendo en Firefox gracias a Javascript
Solo lo probé en firefox y encontre unos detalles como la desaparición de algunos sprites (de enemigos sobre todo) y la ausencia de la música original del juego. Realmente me sorprende como hemos avanzado en la tecnología, es como decir que veremos a Rage corriendo en un navegador usando WebGL en unos años. Ahora espero ver Quake 3 corriendo en WebGL y demás tecnologías, por ahora está QuakeLive pero no es nativo en el navegador sino utiliza unos complementos para permitir jugar con el navegador.