Todavía espero mejores transiciones de páginas nativas.

Sería bueno poder animar la transición entre páginas si queremos hacerlo en la web sin recurrir a hacks o opciones de arquitectura completas para lograrlo. Me imagino una API que ejecutaría cosas, tal vez integrándose con WAAPI, antes de que se descargue la página, y otras cosas después de que se cargue la página siguiente. Esto, con enlaces de anclaje y cargas de página habituales.

Tenemos una onbeforeunloadAPI, pero no estoy seguro de qué tipo de equipaje tiene. Técnicamente podemos crear transiciones de página ahora, incluso sin una arquitectura de aplicación de una sola página, pero lo que quiero son API especialmente diseñadas que nos ayuden a hacerlo de forma limpia (funciones comprensibles) y con rendimiento (funcionando tan rápido como normalmente lo hace hacer clic en enlaces). y accesibilidad (como el manejo del enfoque) en mente.

Si de todos modos estás creando una aplicación de una sola página, tienes la libertad de animar entre vistas porque la página nunca se recarga. El peligro aquí es que podrías elegir una aplicación de una sola página solo para esta capacidad, que es lo que quiero decir con tener que comprar una arquitectura de sitio solo para lograr esto. Esto parece una compensación desafortunada, ya que las aplicaciones de una sola página conllevan una gran cantidad de gastos generales, como problemas de herramientas y accesibilidad, que de otro modo no habría necesitado.

Sin una aplicación de una sola página, podrías usar algo como Turbo y animate.css como este. El nuevo estilo de transición de Adam, un clip-path()homenaje basado en la obra maestra de Daniel Edan. Quizás si ese enfoque se combinara con instant.page sería tan rápido como cualquier otro clic en un enlace interno.

Hay otros jugadores que intentan resolver esto, como smoothState.js y Swup. El truco es: interceptar la acción para pasar a la página siguiente, ejecutar la animación primero, luego cargar la página siguiente y animar la nueva página. Técnicamente, ralentiza un poco las cosas, pero puedes hacerlo de manera bastante eficiente y el movimiento añade suficiente distracción como para que el rendimiento percibido pueda incluso ser mejor.

Lo ideal sería no tener que animar toda la página pero podríamos tener control total para realizar transiciones más interesantes. Diablos, estaba haciendo eso hace una década con una página para un músico donde al hacer clic en el sitio simplemente se movían las cosas para que el audio siguiera reproduciéndose (y fue divertido).

Este sería un gran lugar para que intervenga la plataforma web. Recuerdo que Jake presionó para esto hace años, pero no estoy seguro de si eso llegó a alguna parte. Luego tenemos portales que son… ¿vale? Son como si cargas un iframe en la página y luego lo animas para que se apodere de toda la página (y actualice la URL). No es posible hacer muchos matices de animación allí, pero ciertamente puedes deslizar algunas páginas o atenuarlas (oye, aquí hay otra: Highway), como lo hacía jQuery Mobile en la antigüedad.