Desconecta una página completa con la API del sistema de archivos HTML5

Seamos sinceros: AppCache es molesto y tiene problemas [1, 2, 3]. Una gran limitación es el hecho de que no es posible almacenar recursos en caché de forma dinámica a pedido. Básicamente, esto hace que sea una cuestión o nada a la hora de dejar una app sin conexión. Todo el manifiesto se almacena en caché al principio o no se almacena nada en caché.

La API de FileSystem de HTML5 se convierte en una solución atractiva para las deficiencias de AppCache. Se pueden almacenar de forma programática jerarquías de archivos y carpetas en el sistema de archivos local (con zona de pruebas) y, luego, agregar, actualizar o quitar recursos individuales según sea necesario. Mi colega, Boris Smus, incluso escribió una buena biblioteca para administrar este tipo de almacenamiento en caché sin conexión en el contexto de los juegos. La misma idea se puede extrapolar para que funcione con cualquier tipo de aplicación web.

crbug.com/89271 es una corrección importante para la API de FileSystem que hace que las rutas de acceso del sistema de archivos: relativas funcionen como un encanto.

Por ejemplo, supongamos que guardé index.html en la carpeta raíz del sistema de archivos (fs.root), creé una carpeta img y guardé "test.png" en ella. La URL de filesystem: de esos dos archivos sería filesystem:http://example.com/temporary/index.html y filesystem:http://example.com/temporary/img/test.png, respectivamente. Luego, si quería usar "test.png" para un img.src, necesitaba usar su ruta de acceso absoluta completa: <img src="filesystem:http://example.com/temporary/img/test.png">. Eso implicó reescribir todas las URLs relativas en index.html para que apunten a la URL filesystem: del archivo correspondiente. Eso no es bueno. Ahora, con esta corrección de errores, puedo conservar la ruta de acceso relativa al archivo (<img src="img/test.png">), ya que se resolverá de forma correcta en un origen del sistema de archivos.

Esta función simplifica desplegar una página y guardar todos sus recursos sin conexión, a la vez que mantiene la misma estructura de carpetas que la versión en línea.