Cómo llevamos Google Earth a la Web

Mejora el acceso a Google Earth entre navegadores con WebAssembly.

Jordon Mears
Jordon Mears

En un mundo ideal, todas las aplicaciones que creen los desarrolladores, independientemente de la tecnología, estarían disponibles en el navegador. Sin embargo, existen obstáculos para llevar los proyectos a la Web, según la tecnología con la que se crearon y la eficacia con la que esa tecnología sea compatible con los diversos proveedores de navegadores. WebAssembly (Wasm) es un objetivo de compilación estandarizado por el W3C que nos ayuda a resolver este problema, ya que nos permite ejecutar bases de código en lenguajes que no sean JavaScript en la Web.

Hemos logrado eso con Google Earth, que hoy está disponible en la versión beta de la vista previa en WebAssembly. Ten en cuenta que esta versión aún es una versión beta de Google Earth y es posible que no sea tan fluida como de costumbre (prueba la versión normal de Earth para la Web). Puedes experimentar con esta versión beta en Chrome y otros navegadores basados en Chromium, como Edge (versión Canary) y Opera, así como en Firefox. Considera esta versión beta tu inspiración si también estás buscando una mejor compatibilidad entre navegadores para tus aplicaciones específicas de la plataforma.

Por qué elegimos WebAssembly para Google Earth

Originalmente, escribimos la mayor parte de Google Earth en C++ porque era una aplicación de escritorio destinada a instalarse. Luego, pudimos trasladarlo a Android e iOS, ya que los smartphones se encontraban en funcionamiento, lo que retuvo la mayor parte de nuestra base de código C++ con NDK y Objective-C++. En 2017, cuando incorporamos Earth a la Web, usamos Native Client (NaCl) para compilar el código C++ y ejecutarlo en el navegador Chrome.

En ese momento, NaCl era la única tecnología de navegador que nos permitía portar nuestro código C++ al navegador y brindarnos el tipo de rendimiento que Earth necesitaba. Lamentablemente, NaCl era una tecnología solo de Chrome que nunca se adoptó en todos los navegadores. Ahora estamos empezando a cambiar a WebAssembly, que nos permite tomar ese mismo código y ejecutarlo en todos los navegadores. Esto significa que Earth estará disponible para más personas en la Web.

Captura de pantalla de la Tierra que muestra la Torre Eiffel

Un subproceso sobre los subprocesos

WebAssembly sigue evolucionando como estándar, y los navegadores se siguen expandiendo con más características y funciones. Desde la perspectiva de Earth, la diferencia más significativa en la compatibilidad de WebAssembly entre navegadores es la compatibilidad con los subprocesos. Algunos navegadores admiten varios subprocesos y otros no. Piensa en la Tierra como un enorme videojuego en 3D del mundo real. Por lo tanto, transmitimos datos constantemente al navegador, los descomprimemos y los preparamos para renderizarlos en la pantalla. Se demostró una clara mejora en el rendimiento de Earth en el navegador al poder realizar este trabajo en un subproceso en segundo plano.

WebAssembly de subprocesos múltiples se basa en una función del navegador llamada SharedArrayBuffer, que se extrajo de los navegadores después de que se revelaron las vulnerabilidades de seguridad Spectre y Meltdown. Para mitigar posibles daños de ataques, el equipo de seguridad de Chrome presentó el aislamiento de sitios en Chrome para todos los sistemas operativos de escritorio. El aislamiento de sitios limita cada proceso del renderizador a los documentos de un solo sitio. Al implementar esta función de seguridad, Chrome volvió a habilitar SharedArrayBuffer para computadoras de escritorio, lo que nos permitió usar WebAssembly multiproceso con Earth para Chrome.

Otros navegadores están trabajando en el aislamiento de sitios y otras mitigaciones para volver a habilitar SharedArrayBuffer. Mientras tanto, Earth ejecuta un subproceso único en esos navegadores.

Cómo funciona WebAssembly con diferentes navegadores

Aprendimos mucho sobre el estado de la compatibilidad con WebAssembly en los navegadores que portan Earth. Si vas a desarrollar aplicaciones con WebAssembly, es importante comprender el estado actual de cómo funciona WebAssembly con diferentes navegadores.

Perimetrales

Edge está a punto de convertirse en dos experiencias de desarrollo distintas basadas en la elección de Microsoft de pasar del procesador EdgeHTML a un procesador basado en Chromium. Por el momento, la versión beta de Google Earth en WebAssembly no se ejecutará en la versión pública actual de Edge debido a la falta de compatibilidad con WebGL2. Este problema se solucionará cuando se lance próximamente la nueva versión de Edge, basada en Chromium. Mientras tanto, puedes descargar la versión Canary de Edge y ver que Earth funciona bastante bien.

Chrome

Chrome tiene una gran compatibilidad con WebAssembly, que incluye varios subprocesos en computadoras de escritorio, por lo que puedes esperar que Earth funcione con mayor fluidez. Sin embargo, esperamos que Chrome agregue compatibilidad con la asignación de memoria dinámica con varios subprocesos en WebAssembly. Hasta entonces, es posible que Earth no se inicie en dispositivos con memoria limitada (como máquinas de 32 bits).

Firefox

Firefox ofrece una buena compatibilidad con WebAssembly, pero inhabilitó la compatibilidad con varios subprocesos. Como resultado, puedes esperar una experiencia más lenta con Earth. Esperamos que Mozilla vuelva a admitir varios subprocesos en futuras versiones. La ventaja es que Firefox sí admite la asignación de memoria dinámica.

Ópera

Opera se basa en Chromium al igual que Chrome, junto con las próximas versiones de Edge. Sin embargo, la versión actual de Opera solo ofrece compatibilidad con un subproceso de WebAssembly. Earth funciona en Opera, pero en una experiencia algo degradada. Esperamos que las versiones más nuevas de Opera admitan varios subprocesos y una mayor compatibilidad con WebAssembly.

Safari

Safari tiene una implementación sólida de WebAssembly, pero carece de compatibilidad total con WebGL2. Por lo tanto, Earth con WebAssembly no se ejecuta en Safari. Específicamente, algunos de nuestros sombreadores requieren GLSL 1.2. Esperamos que Earth también esté disponible en Safari cuando se agregue una mejor compatibilidad con WebGL2.

Espero adoptar más las funciones de WebAssembly.

Ha sido un largo camino que Earth esté disponible en la Web. Hace aproximadamente seis años, comenzamos con una demostración interna inicial basada en asm.js que se mantuvo y expandió a lo largo de los años. Luego, se convirtió en una compilación WebAssembly de Earth, que se convirtió en el estándar adoptado por el W3C.

Todavía nos quedan cosas por recorrer para WebAssembly y Earth. Específicamente, nos gustaría pasar al backend de LLVM usando Emscripten (la cadena de herramientas para generar WebAssembly a partir de código C++). Este cambio habilitará la compatibilidad con SIMD en el futuro, además de herramientas de depuración más sólidas, como los mapas de origen para el código de idioma fuente. Esperamos ver también la adopción de OffscreenCanvas y la compatibilidad completa con la asignación de memoria dinámica en WebAssembly. Sin embargo, sabemos que estamos en el camino correcto: WebAssembly es el futuro a largo plazo de Earth en la Web.

Tómate un momento para probar nuestra versión beta. Déjanos tus comentarios directamente en Earth para contarnos cómo funciona.