Desde la creación del copyright nadie había tenido problema alguno al reclamar un objeto, pero actualmente la disputa por proteger éste mediante Digital Rights Management (DRM) y evitar abusos ha sido muy debatida.

Pese a todos los enfrentamientos, se ha propuesto integrar DRM en HTML5 como un estándar en el World Wide Web Consortium (W3C), con el nombre de “Encrypted Media Extensions” (EME).

Ante este anuncio la Electronic Frontier Foundation (EFF) dijo: “Su adopción sería un desarrollo calamitoso, y debe ser detenido”.

Por otro lado y al igual que la EFF, más de 26.700 personas han firmado para impedir tal cosa estándar.

Ya sabemos que la unión hace la fuerza y anteriormente muchos usuarios internautas se unieron y derrotaron SOPA y PIPA. ¿Por qué no tratar de hacer lo mismo? Es por ello que La EFF ha publicado un artículo donde expone un llamado a la W3C y las organizaciones que apoyan la propuesta a no dar soporte y mucho menos implementar DRM en HTML5 y llama a todo aquel opositor a firmar en pro de abolir el estándar.

Hacemos un llamado a la World Wide Web Consortium (W3C) y a los miembros de sus organizaciones para rechazar la propuesta llamada Extensiones Multimedia Cifradas (EME), que incorporaría soporte para la Gestión Digital de Restricciones (DRM) en HTML.

EME sería un paso atrás irreversible por la libertad en Internet. Sería respaldar y permitir modelos de negocio sin ética y restringir a los usuarios, sometiéndolos a determinadas empresas de comunicación a ciertas condiciones previsa para toda la ciudadanía Web. Así como Flash y Silverlight finalmente están muriendo, no hay que sustituirlos por una última fantasía de control de los gigantes de los medios de comunicación.

Además, EME contradice los valores fundamentales de la W3C. Sería obstaculizar la interoperabilidad mediante el fomento de la proliferación de plugins de DRM. Sería ir en contra del principio de la W3C de mantener la web libre de regalías – esto es simplemente una puerta trasera para las compañías de medios para requerir software propio. Es la ignorancia deliberada de fingir lo contrario sólo porqué la propuesta no menciona determinadas tecnologías o sistemas DRM por su nombre.

Las grandes empresas aliadas a la W3E en pro de DRM son Google, Microsoft y Netflix, éstas saben que DRM es rechazado, y aún así insisten en que EME no es DRM pero lo peor del caso es que a nivel técnico EME no es DRM pero sí define un marco para instalar un sistema de DRM o “contenido protegido” en la web.

 Manu Sporny, miembro del grupo de trabajo de HTML, también rechaza la propuesta y menciona que la especificación EME explica la arquitectura para instalar un mecanismo de plug-ins de DRM.

Los plugins son algo perjudicial para la interoperabilidad, es inevitable que los creadores de estos no sean capaces de dar soporte a todas las plataformas todo el tiempo. Algunas personas podrán ver el contenido, y otras no.

La analogía que utilizó fue que es como cuando se requiere descargar e instalar Flash, Silverlight o algún otro sistema para visualizar un contenido, si ese plugin no está disponible para tu dispositivo, no puedes acceder al material.

La EFF menciona que EME se deslinda de toda responsabilidad en cuanto de compatibilidad se hable, haciendo que los sitios web deban adquirir software o incluso hardware propietario para operaciones especiales; afirmando lo siguiente:

Esto es exactamente el opuesto a la razón por la que el W3C existe. W3C es un lugar para crear estándares comprensivos y públicos que garanticen interoperabilidad, no facilitar una explosión de nuevo software mutuamente incompatibles y de sitios y servicios que sólo pueden ser vistos desde dispositivos particulares o aplicaciones. Pero EME es una propuesta para llevar exactamente esta dinámica disfuncional a HTML5.

Los servicios que brinda Netflix dependen actualmente de plug-ins y software aparte para emitir sus contenidos a través de internet y poder protegerlos y cumplir con los contratos con los estudios. Estos servicios no pueden optar por HTML5, porque éste no ofrece ningún sistema para transmitir video de esta manera, con lo que se espera cambiar con DRM.

Según la idea no es crear un estándar de DRM, sino entregar herramientas necesarias para un sistema genérico de cifrado.

Creemos que el gran problema sería la implementación nula en un navegador de código abierto. ¿Por qué?

• Nos aseguran que gente cercana no obtendrá el código y mucho menos pueda lucrar con él.
• Burlar la seguridad. Siempre de una u otra forma se encuentra la manera de saltarnos la barda.
• ¿Y si navegadores como Firefox no pueden tener acceso a Netflix o YouTube posteriormente?
• Protección en el hardware (disponible solo para móviles) ¿Y las PC’s?

En fin!.. La propuesta se sigue discutiendo, ya sabremos a futuro que pasará con esta.

¿Quieres ir a CPMX4? HTML5Fácil te regalan cupón del 50% de descuento

Hola chicos!

Como ya saben y ha sido confirmado, Campus Party México se celebrará del 30 de Julio al 4 de Agosto. Como comunidad realmente queremos compartir personalmente con nuestros seguidores una semana geek increíble, llena de dinámicas, experiencias, pláticas, anécdotas y más.

Ya que Campus Party es el mayor festival tecnológico donde se une innovación, creatividad, ciencia y entretenimiento digital creemos que es una buena plataforma para difundir aún más el conocimiento, conocer gente interesante, hacer nuevos amigos y hasta tener colaboradores de trabajo.

Son por todas estas razones que #CPMx4 y HTML5Fácil te regalan un cupón de descuento del 50% para que asistas al evento tecnológico del año y no te quedes fuera. Recalcamos que aparte de todas las actividades que se realizan dentro del evento, como comunidad tendremos sorpresas y dinámicas para compartir y pasar un rato más que agradable.

Tan solo pedimos un Tweet para que demás personas puedan enterarse como el siguiente:

Gracias a @html5facil, @ninjacodetv  y #CPmx4 tengo 50% de descuento en la compra de mi entrada.

El código para obtenerlo es:

cpmx4comunidadesmayo

También puedes participar para ganar un pase totalmente gratis, aprovecha, tan solo tienes que dar click al siguiente enlace “Ganar un pase gratis“.

No te quedes fuera, invita a todos tus amigos y nos vemos en Campus Party edición Latinoamérica.  ;)

Este es uno de esos post que nos gustaría publicar todos los dias, pues los sponsors alargan la vida de los proyectos y permite que el contenido llegue a mas personas. Estando reunidos y buscando alguna solución de VPS pues por la cantidad de usuarios, que agradecemos a todos y cada uno de ustedes, que frecuentan HTML5 Fácil necesitábamos una buena opción y que se acomodara a la inversión del fundador. Pues en el camino nos encontramos con ServeGrove un equipo de trabajo muy profesional, efectivo y dispuesto a colaborar. Por esto, y no por motivos publicitarios, queremos mostrar otra opción de tantas, pero confiable y con gran soporte para PHP y con una plataforma propia para este fin.

¡Pero!, ¿Qué es ServerGrove?

Empresa de hosting que aunque no es la más grande trabaja para ser la mejor; muchas empresas pierden calidad a medida que se agrandan.

Servicios que ofrecen

ServerGrove cuenta con oficinas centrales en Coral Gables, Florida, Estados Unidos. Son muy activos en su comunidad, y apoyan innumerables iniciativas y proyectos open source. Todos los empleados en la empresa dedican 10% de su tiempo haciendo contribuciones en tecnologías y proyectos en los que se encuentran relacionados.

Orgullosos de sus servidores optimizados, una red segura y redundante, así como los backups que realizan diaria y gratuitamente, servidores virtuales seguros, escalables y fáciles de usar para desarrolladores, diseñadores, y emprendedores. Y ni que hablar del panel de control, el cual combina la facilidad de uso de hosting compartido con el poder de un VPS.

Pinche aquí para ver el vídeo

Servicios, planes y costos

Conectividad

A raíz de malas experiencias de conectividad con un solo proveedor, deciden en el año 2010 utilizar un modelo de conexión diferente y que al día de hoy no han tenido ningún problema gracias a la máxima redundancia que hay en todo momento. Tales proveedores son:

• Verizon
• Level 3
• AT&T

Algunos datos interesantes:

• Acceso directo al backbone de Internet gracias a la ubicación de nuestro datacenter.
• Acceso a una red de más de 100 proveedores.
• La mejor conexión disponible en el mercado, muy superior a la conexión ofrecida por la mayoría de los proveedores de hosting.

Servidores

Los mejores servidores para el mejor funcionamiento; utilizan:

• Servidores de marca especialmente configurados para máxima velocidad y potencia.
• El mejor hardware disponible para servicio de hosting.
• Los servidores son sacados de circulación en rotación permanente.
• Todos los servidores incluyen doble fuente de alimentación conectados a circuitos separados.

Energía y Medio ambiente

El NAP de las Américas está diseñado para soportar huracanes de categoría 5, incluye los sistemas más confiables y avanzados en el mundo. Tanto que los técnicos pueden realizar mantenimiento en cualquier parte sin impactar las operaciones normales. El diseño ofrece 100% de disponibilidad en los sistemas de energía y refrigeración.

Contacto

ServerGrove Networks Inc.
1390 S. Dixie Hwy
Suite 2218
Coral Gables, FL. 33146

Llamadas sin cargo (dentro USA): (800) 511-1855
Para llamadas internacionales: (786) 999-6585
En las redes sociales como Twitter y Facebook

Agradecimiento

Finalmente nos queda agradecer inmensamente a ServerGrove por ser patrocinador oficial de hosting para HTML5Fácil y NinjaCodeTv. Como comunidad los recomendamos ampliamente ya que el trato que nos han dado ha sido excepcional y como usuario de un servicio lo único que pedimos es el mejor soporte y atención, es por ello que realizamos este post en honor a todo su equipo de trabajo y el trato que amablemente brindan.

Resumen: PHP Day el primer evento dedicado a PHP en Puebla

¿Qué fue el #PHPDayPuebla?

Fue un evento gratuito organizado por CESoLMX, Hackers & Founders Puebla y Comunidad PHP Puebla con el apoyo del Hub Emprendedor. Cuyo objetivo es dar a conocer las mejores prácticas, Frameworks y aplicaciones del lenguaje de programación más usado en Internet y otras herramientas utilizadas en el día a día de todo desarrollador Web.

La experiencia

Como conferencista en el evento, puedo asegurar que fue muy grata la experiencia; la cantidad de personas que asistieron a mis 2 conferencias fue mucho más de lo que pensé. Tener el honor de haber sido el primer conferencista suponía dar lo mejor y el feedback que he recibido en Twitter es estupendo.

Conocer nuevas personas

Algo que siempre sucede en eventos de tecnología, es que siempre conoces nuevas personas con las cuales puedes crear una amistad y red de contactos para futuros proyectos o tener a quien preguntar dudas. Esta actividad socialista no solo es para ponentes o talleristas, sino también para los mismos asistentes, los cuales podrían conocer al siguiente amigo con quien podrían lograr un proyecto sustentable a futuro.

Fotografias del evento

¿Qué es Bayeux?

Bayeux es un protocolo de transporte de mensajes asíncronos (principalmente a través de HTTP), con baja latencia entre un servidor y un cliente web. Los mensajes se enrutan a través de canales nombrados y pueden ser entregados en 3 formas:

• servidor al cliente
• cliente al servidor
• cliente a cliente (a través del servidor)

Objetivo

El principal objetivo es apoyar las interacciones bidireccionales entre las respuestas de los clientes web. Por ejemplo, con el uso de Ajax y el servidor web.

Bayeux busca reducir la complejidad del desarrollo de aplicaciones web Comet, al permitir a los ejecutores interoperar más fácilmente, para resolver la distribución de mensajes comunes y problemas de enrutamiento, y proporcionar mecanismos de mejoras incrementales y extensiones.

Faye

Faye es un sistema de mensajería de publicación y suscripción basado en el protocolo Bayeux, el cual proporciona servidores de mensajes para Node.js, Rubí y clientes para su uso en el servidor y en los principales navegadores web.

Primeros pasos en Faye

Iniciando el servidor

var Faye   = require('faye'),
server = new Faye.NodeAdapter({mount: '/'});

server.listen(8000);

Enviando mensajes

client.publish('/messages', {
text: 'Hello world'
});

Descarga Faye

Faye es software de código abierto y puedes seguir el desarrollo del mismo en la página GitHub .

Descarga de Node.js y navegadores web

La versión Node.js está disponible a través de la NGP. Este paquete contiene una copia del cliente de navegador, mediante el servidor Faye cuando se ejecuta.

npm instalación faye

El Paquete de la Versión 0.8.9 JavaScript contiene:

• nodo / faye-Node.js
• navegador / faye-browser.js
• navegador / faye-browser-min.js
• navegador / faye-browser-min.js.map

Para utilizar Faye como Node.js, sólo hay que poner estos dos archivos en un directorio, y cargar el componente del lado del servidor usando require ('. / ruta / al / faye-node'). El archivo faye-browser-min.js contiene el cliente del explorador web, en Faye servirá automáticamente.

El cliente de navegador puede utilizarse de forma independiente con otros servidores de Bayeux como CometD (inclyendo faye-browser-min.js en su página web para usarlo).

Descarga de Rubí

Para las plataformas de Ruby, Faye es fácilmente instalable a través RubyGems.

gem install faye

Este paquete también incluye el cliente de navegador mediante el servidor Faye cuando se ejecuta.

¿Qué es Barley?

Barley  comenzó como un producto offshot de Plain, una empresa fundada por Colin Devroe, Jeff Johns y Kyle Ruane; la idea era permitir la edición en línea a través de cualquier sitio web.

Devroe dice que la inspiración para crear Barley surgió cuando él y Ruane se dieron cuenta de que un vendedor fue capaz de hacer el cambio en su sitio sin necesidad de utilizar una forma definida con un editor WYSIWYG. El título, las fotos, el cuerpo del texto, y cualquier otra cosa podían ser editados con un solo toque y además funciona en cualquier plataforma (PC, Smartphone y tableta).

Estructura

La plantilla de Barley se creó utilizando sólo HTML, JS y CSS como normalmente se desarrolla para trabajar en el navegador. La estructura es la siguiente:

- /styles
-/javascripts
-/images
- index.html
- about.html
- blog.html
- post.html
- favicon.ico

Frameworks

Puedes sentirte libre de usar o no un framework para tus plantillas, ya que Barley no limita a nadie con los Frameworks  que te gustaría utilizar.

Editando con Barley

Vamos a ver un ejemplo de cómo pueden editar en tu plantilla, ya que puedes elegir que parte editar y que parte no. Barley lee atributos HTML en todos los elementos para decidir dos cosas principales:

1) ¿Es el elemento capaz de ser editado?

2) ¿Qué herramientas puede utilizar el autor para editar esos elementos?

Aquí está el código HTML que utilizamos para determinar que muestra un ejemplo de etiquetas H1.

h1 data-barley="main_title" data-barley-editor="mini"

Vemos que Barley está mostrando que la etiqueta H1 en esta página puede ser editable por el autor utilizando la propiedad data-barley-editor y el valor mini. El valor main_title en el atributo se utiliza para registrar los cambios a esa etiqueta para un dominio específico, es decir, todas las etiquetas capaces de ser editadas en la plantilla deben tener un ID único.

Tipos de edición en Barley

Ya vimos un tipo de edición que podemos utilizar con Barley pero hay varios más que se encuentran disponibles actualmente; próximamente se espera ampliar la lista debido a necesidades que clientes y diseñadores de plantillas requieren.

• mini – Sin herramientas en absoluto. El texto se puede cambiar.
• simple – El texto se puede cambiar. El énfasis se puede agregar usando negritas y cursivas al texto.
• plus – Además de lo anterior se puede agregar enlaces, texto de alineación (centro, izquierda, derecha) y listas.
• advanced – Además… Subir una imagen.
• blog – Todas las herramientas anteriores se cargan.

Y para que tengas una idea más clara de cómo funciona Barley, te dejo 2 teaser’s:

Pinche aquí para ver el vídeo

Pinche aquí para ver el vídeo

Para más información sobre Barley visita la página oficial, así como para obtener más datos sobre la documentación.

Sin duda Alguna Ruby on Rails (RoR) es uno de los Frameworks  back-end más reconocidos por ciertas y especificas ventajas al programar en él. Ya que con gran facilidad podemos crear aplicaciones muy complejas de manera rápida y en cuestión de minutos lo que ningún otro lenguaje de programación o Framework ofrece.

Ruby

Ruby es un lenguaje de programación totalmente orientado a objetos multiplataforma (lenguaje interpretado y de scripts), en el que RoR fue basado para su creación.

Ruby es totalmente software libre y fue creado por Yukihiro Matsumoto también conocido como Matz; la primera versión liberada al público fue en 1995, su sintaxis es muy parecida a lenguajes como Perl y Python.

RoR

Es un Framework del lado del servidor qué nos facilita la construcción de grandes aplicaciónes web y que a su vez estas son de código abierto; creado por David Heinemeier Hansson liberando la primera versión en Julio del 2004.

Rails maneja el paradigma del MVC (Model-View-Controller) mejor conocido como modelo vista controlador que nos permite dar ciertas configuraciones de manera libre en el controlador para darle lógica a nuestras vistas y permitirnos manejar información de una base de datos mediante consultas al activerecord en base a los atributos o campos de nuestro modelo ya creado.

Su Filosofía: Don´t Repeat yourself. Nos indica que lo que ya está hecho no tiene porqué volver a hacerse.

Una de las cosas más interesantes de este Framework, es que nos permite combinar lenguaje de Ruby con HTML o HTML5 mediante archivos con la extensión .html.erb en las vistas del controlador, lo que nos facilita el manejo de distintas funciones, variables o métodos dentro de nuestra aplicación.

Al igual que muchos otros Frameworks, Rails nos permite instalar librerías y bibliotecas (llamadas Gemas) desde la consola de Rails o desde el mismo símbolo del sistema (en Windows). Ejecutando una simple instrucción como esta:

gem install rails

Descargará e instalará las Gemas necesarias para nuestra aplicación. Puedes encontrar los códigos para la instalación de diversas y múltiples tipos de Gemas para tus aplicaciones gracias a la comunidad de programadores de Ruby & Ruby on Rails.

Volviendo al tema, una de las cosas que más le encantó a la comunidad de programadores de Ruby; es su bella sintaxis, ya que es legible y parecida al pseudo-código.

Muy bien, se habrán dado cuenta que al hablar de RoR no solo estamos hablando del Framework sino también de Ruby; menciono esto ya que es de gran importancia saberlo, puesto que debemos tener conocimientos básicos de Ruby o en su caso conocer muy bien la sintaxis para poder comprender el Framework.

Dejemos aún lado los Conceptos básicos de Ruby y RoR, pasemos a ver un poco de código.

Instalación de RoR

Antes que nada debemos instalar Rails y eso lo pueden hacer de manera muy fácil (usuario de Windows) y descargándote el Paquete que viene con las versiones más actuales de Ruby, Rails, Bundler, Git, SQL Server Support y MySQLite.

La instalación es muy sencilla simplemente aceptan términos y condiciones y dan siguiente para instalar todos los complementos de Rails; por último hacen clic en el botón finalizar para concluir la instalación.

Ahora nos vamos a la consola y tecleamos el siguiente código:

rails –v

Luego:

         ruby –v

Si la instalación es correcta estos códigos nos darán en pantalla las versiones que instalamos de Rails y Ruby en nuestro ordenador, si no es así vuelve a instalar el paquete de Rails ya que algo se te pudo haber escapado en la instalación.

Mi primera App en RoR

Ahora vamos a crear nuestra primera aplicación, para ello primero nos posicionaremos en la carpeta donde queremos que se creen todos los archivos necesarios para nuestra aplicación. Ejemplo:

C:\CursoRuby>

C:\CursoRuby>   cd  Proyecto01

C:\CursoRuby\Proyecto01>

Y ahora colocamos lo siguiente:

rails new MiPrimerApp

Esto nos puede tomar unos segundos para que genere todos los archivos necesarios para nuestra aplicación.

Una vez listo abrimos nuestro editor de texto (sugiero usar Sublime Text 2) para examinar todas las carpetas y archivos que nos ha creado Rails, esto con el de darnos una idea de cómo es la jerarquía de los ficheros, archivos y/o carpetas que maneja RoR en nuestras aplicaciones.

Volvemos a la Consola y tecleamos lo siguiente:

rails s

O también podemos escribir el comando así:

rails server

Lo que hará este comando así de sencillo será cargar nuestra aplicación para poder visualizarla en el navegador, generalmente la carga en el puerto 3000 de nuestro localhost, Ejemplo:

localhost:3000

Una vez visualizada la aplicación en el navegador nos podremos dar cuenta que por defecto Rails genero una vista con la portada de RoR, en donde nos indica que esta vista o archivo debe ser borrada y reemplazada por la vista index del controlador welcome.

Muy bien ahora regresamos de nuevo a la consola y nos salimos del servidor mediante la combinación de teclas Ctrl+C.

Después tecleamos lo siguiente:

rails g controller welcome index

Lo que hará este comando es crearnos el Controlador “Welcome” con la Vista “Index”.

Una vez creados los ficheros, procedemos a borrar el archivo index.html  en la Carpeta /Public de nuestra aplicación.

Luego nos vamos a la carpeta /config y abrimos en nuestro editor de texto el archivo routers.rb  en el cual borraremos el “#” de la línea 53 (que nos sirve para comentar algún texto o código en Ruby), y nos quedará una línea de comandos de Ruby así:

root :to => ‘welcome#index’

Y ahora para Finalizar nuestra pequeña aplicación de RoR , abrimos el archivo “index.html.erb” que es la Vista “index” de nuestro controlador “Welcome” y colocamos lo siguiente:

<h1> Esta es mi Primer Aplicación en Ruby on Rails </h1>

<p> By: Michael Serrato </p>

Por último vamos a cargar nuestra aplicación:

rails s

Qué abrirá un servidor con nuestra app en el puerto 3000 (que ya viene así por defecto).

Abrimos nuestro navegador y visualizamos nuestra aplicación, en:

http://localhost:3000/welcome/index

Les debe aparecer la Vista en la que creamos la página de HTML5:

<h1> Esta es mi Primer Aplicación en Ruby on Rails </h1>

<p> By: Michael Serrato </p>

Por último te dejo el video de la presentación en ninjacode.tv del tema; en la primera parte resolvemos dudas en general para posteriormente pasar al código:

Pinche aquí para ver el vídeo

Y listo ahí tendrán un pequeño ejemplo de cómo es que se trabaja en el Framework Ruby on Rails y cómo utilizar la consola y los comandos de Rails.

Espero que les sea de gran ayuda este Post. Recuerden dejar sus dudas o comentarios.

Muchas interrogantes han surgido a raíz del lanzamiento de Unreal Engine 3 para Asm.js, ¿Cómo funciona en los navegadores?, ¿por qué es importante?, ¿debe ser mi pan de cada día?, ¿funciona en todos los navegadores, hay alguna excepción?, en fin todo lo relacionado al tema.

¿Qué es Asm.js?

Se define como un subconjunto estricto de JavaScript que se puede utilizar como un nivel bajo, el idioma de destino eficiente para los compiladores. Este sublenguaje eficazmente describe una máquina virtual segura para lenguajes de memoria que no lo son, como en el caso de C o C++.

Una combinación de validación estática y dinámica que permiten a los motores de JavaScript emplear un ahead-of-time (AOT) la estrategia de optimización de compilación de código asm.js válida.

Asm.js proviene de una nueva categoría de aplicaciones de JavaScript, un género completamente innovador creado por Emscripten, un proyecto visionario de Mozilla.

La web 3D más cerca que nunca con asm.js

¿Cómo funciona Emscripten?

Lo primero que hace es tomar el código en C/C++, lo pasa a través de LLVM, convirtiéndolo en un bytecode generado en JavaScript (específicamente Asm.js, un subconjunto de JavaScript).

Si el código compilado Asm.js está siendo renderizado es más probable que sea manejado por WebGL (e interpretado usando OpenGL). De esta manera el conjunto de procesos lineales está técnicamente haciendo uso de JavaScript y el navegador. Esto se hace para que el código compilado Asm.js pueda correr tan rápido como sea posible. Como Asm.js es un subconjunto de JavaScript está muy limitado en lo que puede hacer y cómo se puede operar.

Objetivo de Asm.js

Según David Herman (Senior Researcher de Mozilla Research) es hacer de la web abierta una máquina virtual convincente, compilar otros lenguajes y plataformas. Por ahora enfocándose en la compilación de código de bajo nivel como C y C++. A largo plazo, esperan añadir soporte para un mayor nivel de construcciones con objetos estructurados y recolección de basura; plataformas como la JVM y NET.

Como mencionamos anteriormente Asm.js es sólo JavaScript, no hay complementos especiales en el navegador o características necesarias para hacer que funcione (un navegador que es capaz de detectar y optimizar el código Asm.js obviamente se ejecutará más rápido).

Funcionamiento de Asm.js

Vamos a ver como funciona y cuales son las limitantes de Asm.js con una función extraída de un módulo compilado (versión parcial de BananaBread).

function Vb(d) {

d = d | 0;

var e = 0, f = 0, h = 0, j = 0, k = 0, l = 0, m = 0, n = 0,

o = 0, p = 0, q = 0, r = 0, s = 0;

e = i;

i = i + 12 | 0;

f = e | 0;

h = d + 12 | 0;

j = c[h >> 2] | 0;

if ((j | 0) > 0) {

c[h >> 2] = 0;

k = 0

} else {

k = j

}

j = d + 24 | 0;

if ((c[j >> 2] | 0) > 0) {

c[j >> 2] = 0

}

l = d + 28 | 0;

c[l >> 2] = 0;

c[l + 4 >> 2] = 0;

l = (c[1384465] | 0) + 3 | 0;

do {

if (l >>> 0 < 26) {

if ((4980736 >>> (l >>> 0) & 1 | 0) == 0) {

break

}

if ((c[1356579] | 0) > 0) {

m = d + 4 | 0;

n = 0;

while (1) {

o = c[(c[1356577] | 0) + (n << 2) >> 2] | 0;

do {

if (a[o + 22 | 0] << 24 >> 24 == 24) {

if (!(Vp(d, o | 0) | 0)) {

break

}

p = (c[m >> 2] | 0) + (((c[h >> 2] | 0) - 1 | 0) * 40 & -1) + 12 | 0;

q = o + 28 | 0;

c[p >> 2] = c[q >> 2] | 0;

c[p + 4 >> 2] = c[q + 4 >> 2] | 0;

c[p + 8 >> 2] = c[q + 8 >> 2] | 0;

c[p + 12 >> 2] = c[q + 12 >> 2] | 0;

c[p + 16 >> 2] = c[q + 16 >> 2] | 0;

c[p + 20 >> 2] = c[q + 20 >> 2] | 0;

c[p + 24 >> 2] = c[q + 24 >> 2] | 0

}

} while (0);

o = n + 1 | 0;

if ((o | 0) < (c[1356579] | 0)) {

n = o

} else {

break

}

}

r = c[h >> 2] | 0

} else {

r = k

} if ((r | 0) == 0) {

i = e;

return

}

n = c[j >> 2] | 0;

if ((n | 0) >= 1) {

i = e;

return

}

m = f | 0;

o = f + 4 | 0;

q = f + 8 | 0;

p = n;

while (1) {

g[m >> 2] = 0.0;

g[o >> 2] = 0.0;

g[q >> 2] = 0.0;

Vq(d, p, f, 0, -1e3);

n = c[j >> 2] | 0;

if ((n | 0) < 1) {

p = n

} else {

break

}

}

i = e;

return

}

} while (0);

if ((c[1356579] | 0) <= 0) {

i = e;

return

}

f = d + 16 | 0;

r = 0;

while (1) {

k = c[(c[1356577] | 0) + (r << 2) >> 2] | 0;

do {

if (a[k + 22 | 0] << 24 >> 24 == 30) {

h = b[k + 14 >> 1] | 0;

if ((h - 1 & 65535) > 1) {

break

}

l = c[j >> 2] | 0;

p = (c[1384465] | 0) + 3 | 0;

if (p >>> 0 < 26) {

s = (2293760 >>> (p >>> 0) & 1 | 0) != 0 ? 0 : -1e3

} else {

s = -1e3

} if (!(Vq(d, l, k | 0, h << 16 >> 16, s) | 0)) {

break

}

g[(c[f >> 2] | 0) + (l * 112 & -1) + 56 >> 2] = +(b[k + 12 >> 1] << 16 >> 16 | 0);

h = (c[f >> 2] | 0) + (l * 112 & -1) + 60 | 0;

l = k + 28 | 0;

c[h >> 2] = c[l >> 2] | 0;

c[h + 4 >> 2] = c[l + 4 >> 2] | 0;

c[h + 8 >> 2] = c[l + 8 >> 2] | 0;

c[h + 12 >> 2] = c[l + 12 >> 2] | 0;

c[h + 16 >> 2] = c[l + 16 >> 2] | 0;

c[h + 20 >> 2] = c[l + 20 >> 2] | 0;

c[h + 24 >> 2] = c[l + 24 >> 2] | 0

}

} while (0);

k = r + 1 | 0;

if ((k | 0) < (c[1356579] | 0)) {

r = k

} else {

break

}

}

i = e;

return

}

Podrás encontrar el código en el GitHub de BananaBread.

Técnicamente esto es código JavaScript, pero ya podemos ver que esto se parece al uso de DOM en JavaScript. Pero… ¿Qué nos dice el código?

• Asm.js sólo es capaz de manejar una selección de diferentes tipos de números y no otra estructura de datos (esto incluye cadenas, booleanos, o los objetos).
• Todos los datos externos se almacenan y se hace referencia a un solo objeto, llamado heap, reemplazando las variables globales, estructuras de datos, cierres y cualquier otra forma de almacenamiento de datos.
• Al acceder y establecer variables los resultados son constantemente obligados a un tipo específico. Por ejemplo f = e | 0; establece la variable f para igualar el valor de e, también asegura que el resultado será un número entero (|0 hace esto, la conversión de un valor en un entero). También vemos que esto ocurre con datos del tipo float, puedes verlo con el uso de 0,0 y g [...] = + (…).
• En cuanto a los valores que entran y salen de las estructuras de datos aparecen representados por la variable c, un Int32Array (los valores se convierten siempre desde 0 a un número entero usando |0) y g es un Float32Array (los valores son siempre convertidos a un flotador, envolviendo el valor con + (…)).

De esta manera el resultado es altamente optimizado y se puede convertir directamente desde esta sintaxis Asm.js sin tener que interpretar, ya que normalmente se tiene que hacer con el lenguaje Java.

Ejemplo de la especificación Asm.js :

function DiagModule(stdlib, foreign, heap) {

"use asm";

// Variable Declarations

var sqrt = stdlib.Math.sqrt;

// Function Declarations

function square(x) {

x = +x;

return +(x*x);

}

function diag(x, y) {

x = +x;

y = +y;

return +sqrt(square(x) + square(y));

}

return { diag: diag };

}

Podemos observar mejor la estructura de un módulo Asm.js. Un módulo está contenido dentro de una función y comienza con “use asm”. Esto le da al intérprete la insinuación de que todo dentro de la función debe ser manejado como Asm.js y ser compilado para montaje directamente.

¿Observas los argumentos stdlib, foreign, y heap? El objeto stdlib contiene referencias a una serie de funciones integradas de matemáticas. Foreign da acceso a la funcionalidad definida por el usuario (por ejemplo, dibujar una forma en WebGL). Y heap le da un ArrayBuffer que se puede ver a través de un número de diferentes lentes, como Int32Array y Float32Array.

El resto del módulo se divide en tres partes: declaraciones de variables, declaraciones de función y un objeto que exportan las funciones para exponer al usuario.

La exportación es un punto especialmente importante de entender, ya que permite que todo el código dentro del módulo que se maneja como Asm.js pueda ser utilizable al código normal JavaScript. Como en el siguiente ejemplo:

document.body.onclick = function() {

function DiagModule(stdlib){"use asm"; ... return { ... };}

var diag = DiagModule({ Math: Math }).diag;

alert(diag(10, 100));

};

Esto resultaría de un DiagModule en Asm.js que se ha manejado especialmente por el intérprete de JavaScript, pero aún así sigue estando disponible para otro código JavaScript (en el caso de que quisiéramos acceder a ella y usarla dentro de un controlador de clic, por ejemplo).

Pinche aquí para ver el vídeo

¿Cómo es el rendimiento?

A estas alturas la única implementación que existe es en las versiones nocturnas de Firefox; los primeros números muestran un rendimiento muy bueno. Para aplicaciones complejas (tales como los juegos); el rendimiento es sólo alrededor de 2 veces más lento que normalmente compilado en C++ (comparándolo con otros lenguajes como Java o C#).

Esto es sustancialmente más rápido que el tiempo de ejecución actual del navegador, obteniéndose un rendimiento que es alrededor de 4 a 10 veces más rápido que la última versión de Firefox y Chrome.

Casos de uso

Hay que señalar que casi todas las aplicaciones que se están enfocando en Asm.js ahora son compilados de C/C++ a Asm.js utilizando Emscripten. Con esto en mente el tipo de aplicaciones que se van a Asm.js son los que se beneficiarán de la portabilidad de correr en un navegador, pero que tienen un nivel de complejidad en el que un puerto directo a JavaScript lo haría imposible.

Hasta ahora la mayoría de los casos de uso se han centrado en bases de código donde el desempeño es muy importante: como en el funcionamiento de los gráficos en los juegos, intérpretes de lenguajes de programación y bibliotecas.

Veamos rápidamente la lista de proyectos Emscripten que serán de uso inmediato para muchos desarrolladores.

• Una buena demostración de lo que es posible es el juego FPS BananaBread, que se puede jugar directamente en el navegador y trae consigo características multijugador y bots.
• Un puerto de LaTeX a JavaScript, llamado texlive.js , utilizando Emscripten, lo que le permite compilar archivos PDF totalmente dentro de su navegador.
• Un puerto de SQLite a JavaScript capaz de correr en Node.js.
• NaCl: Una biblioteca de redes y criptografía.

Soporte de Asm.js

Como se mencionó anteriormente la versión nocturna de Firefox es actualmente el único navegador que soporta la optimización de código Asm.js.

Si un navegador no es compatible con arreglos o especialmente al compilar el código Asm.js entonces el rendimiento va a estar mucho peor. Por supuesto, esto no es especial para Asm.js, probablemente cualquier navegador que no tiene esas características, también este sufriendo de otras maneras.

Para más información sobre Asm.js, especificaciones y el proyecto Emscripten de Mozilla visita las respectivas páginas oficiales.

Fuente: John Resig

La Web de hoy es un universo de aplicaciones y páginas web interconectadas llenas de vídeos, fotos y contenido interactivo. Pero lo que no ve el usuario es cómo interactúan los navegadores y las tecnologías web para hacer esto posible.

A lo largo del tiempo, las tecnologías web han evolucionado hasta permitir que los desarrolladores puedan crear nuevas e increíbles experiencias web. La Web actual es el resultado de los continuos esfuerzos de una comunidad abierta que ayuda a definir estas tecnologías y garantizar que todos los navegadores web las admitan.

¿Qué es el desarrollo Web?

Es el conjunto de tecnologías de software del lado del cliente y el servidor, las cuales combinan procesos de base de datos, navegadores e Internet con el fin de realizar determinadas tareas. Lo que significa que sin un equipo de cómputo y las herramientas necesarias, estás tareas no se pueden realizar.

Evolución de las tecnologías.

Imagen tomada de Antonio José Sáenz Albanés.

Con el surgimiento del desarrollo web la venta de computadoras se disparó en los últimos años, sin embargo en la actualidad la competencia entre estas y los teléfonos inteligentes así como las tabletas han sido de gran contención. Mucha de las personas que desarrollan para web ahora también se está enfocando mucho en la portabilidad, usabilidad y requerimientos solicitados por las nuevas plataformas que van surgiendo.

Pero así como van existiendo nuevas plataformas, también los requerimientos suelen ser aún más específicos, tal es el caso del Hardware. Es allí donde más que presumir velocidad o capacidad lo realmente importante es hacer óptimo el equipo; los equipos ensamblados de alguna forma adaptan esos requerimientos a nuestras necesidades.

Especificaciones mínimas para desarrollo web.

• Disco duro de 500GB
• 2Gb de memoria RAM
• Procesador AMD Phenom o superior ó Intel Core 2 Duo
• Tarjeta de video de 1GB

A pesar de ello Chromium utiliza una arquitectura multiproceso diferente a otros navegadores basados ​​en WebKit, el apoyo de éstas durante todo este tiempo ha llevado a la creciente complejidad tanto para WebKit como para proyectos de Chromium. Por lo que el proceso del ritmo de innovación colectiva ha disminuido drásticamente, es allí donde Blink entra en acción.

Blink y Servo los nuevos motores de renderizado de codigo abierto

¿Qué es Blink?

Un nuevo motor de renderización de código abierto basado en WebKit. Se creé que ésta nueva introducción puede llevar a complicaciones intensas para la web, sin embargo tener múltiples motores de renderizado, similar a tener múltiples navegadores, estimulará la innovación y con el tiempo mejorará la salud del ecosistema web abierto.

Visión a corto y largo plazo

Blink traerá a corto plazo pocos cambios para los desarrolladores web. La mayor parte del trabajo inicial se centrará en mejoras en la arquitectura interna y la simplificación de la base de código. En cambio a largo plazo, una base de código más saludable conduce a una mayor estabilidad y un menor número de errores. Durante toda la transición, colaborarán estrechamente con otros fabricantes de navegadores para mover la web hacia adelante y preservar la compatibilidad de un ecosistema exitoso.

Cambios arquitectónicos

Uno de los cambios que planean integrar es “out-of-process iframes” . Los cuales permiten separar las partes individuales de una página en distintos procesos de espacio aislado. La aplicación de esta reestructuración requerirá gran cantidad de iframes cómo se manejan en WebKit. Parte de esta reestructuración es incompatible con otros puertos de WebKit por lo que sigue en construcción.

Por otra parte, el código de red actual en WebKit está limitado por las obligaciones antiguas de Mac WebKit API que no se pueden cambiar. Con Blink, volverán a cargar este código de red sin romper  las obligaciones del API de WebKit de otros consumidores.

Algunos otros cambios considerados:

• Libre de prefijos
• Eliminar el árbol Widget (una restricción Mac WebKit1).
• Divide WebCore en módulos.
• Mover el código para utilizar la Plataforma sandbox API directamente en lugar de WebCore.
• Experimentar moviendo DOM dentro de una pila JS.
• Experimentar con diseño incremental o paralelo.
• Reemplazar WebKitIDL con WebIDL y eliminar código JavaScript, entre otros.

Y hablando de motores de renderizado, les comentamos que después del anuncio de Unreal Engine para la web, Mozilla sigue con la experiencia de mejorar la web y el avance de la misma como una plataforma para todos. Es por ello que en esta ocasión anuncia un proyecto nuevo en colaboración con Samsung para la construcción de un nuevo motor para renderizar páginas web llamado Servo.

¿Qué tienen en mente?

Según Mozilla, el objetivo es crear un nuevo motor con vistas al futuro el cual esté optimizado para dispositivos con varios núcleos y con un enfoque de seguridad por defecto.

Las alianzas

Gracias a las alianzas entre Mozilla y Samsung es que ahora existe Rust (lenguaje de programación) y Servo , el motor del navegador web experimental para Android y ARM. Servo permitirá iniciar una investigación más profunda en los móviles. Samsung ya ha contribuido con un backend ARM y la construcción de infraestructura necesaria para la compilación cruzada para Android, junto con muchas otras mejoras.

Blink y Servo los nuevos motores de renderizado de codigo abierto

¿Qué es Servo?

Servo es un intento de reconstruir el navegador Web desde cero en hardware moderno abordando las causas de las vulnerabilidades de seguridad, mientras que en la parte del diseño de una plataforma se pueda utilizar todo el rendimiento del hardware para permitir nuevas experiencias en la Web.

¿Y Rust?

La construcción de este nuevo motor está basada en Rust, un lenguaje de programación nuevo,  orientado a entornos de multiprogramación y seguridad, sin posibilidad de vulnerabilidades por buffer overflow o por punteros nulos, lo que significa que el valor de null no existe.

Actualmente se encuentra en su versión 0.6 , ha estado en desarrollo durante varios años y se acerca rápidamente a la estabilidad. El objetivo es llenar muchos de los huecos que C++ ha dejado en las últimas décadas.

Algunas de las características más relevantes son:

• Eficiencia de alto nivel.
• Abstracciones multi-paradigma.
• Control preciso sobre los recursos de hardware.
• Prevención de clases enteras de los errores de gestión de memoria que generalmente conducen a los accidentes y vulnerabilidades de seguridad.
• Primitivas de concurrencia ligeras que facilitan a los programadores aprovechar la potencia de los núcleos de CPU disponibles en muchas plataformas informáticas actuales y futuras.

Lo mejor de todo es que Servo es software libre. Puedes descargarlo desde el repositorio de Github, disponible para OS X o Linux ambos de 64 bits.

Lo que viene para Rust

Esperan completar la primera revisión importante de Rust el año que viene, ésta cubre los siguientes puntos:

• Limpieza
• Ampliación
• Documentación de bibliotecas
• Construcción de herramientas para mejorar la experiencia del usuario
• Reforzar el rendimiento.

Al mismo tiempo, esperan poner más recursos a Servo, demostrando que pueden construir un navegador web rápido con paralelismo penetrante, en un lenguaje seguro y divertido.