11

¿Empezar con SwiftUI o con Storyboards?

52138Puntos

hace 2 años

Si estás por iniciarte en el desarrollo de aplicaciones para dispositivos iOS, una duda que seguro tendrás es: ¿Qué debo de usar? ¿SwiftUI o Storyboards?

La respuesta más rápida sería aprender directamente lo más nuevo y novedoso, que en este caso es SwiftUI. Sin embargo, la respuesta a esta pregunta es un gran “depende”.

Es por eso que en este blog vamos a repasar algunos de los diferentes pros y contras de cada uno de estos métodos de interfaz de usuario, para que al final puedas contestar esta pregunta por ti misma.

Primero, un poco de historia sobre Storyboards y SwiftUI

La posibilidad de construir interfaces con Storyboards fue incluida a partir de Xcode 4, el cual fue lanzado en marzo del 2011. La idea de tener un builder para construir las interfaces era facilitar a los desarrolladores su creación con la funcionalidad de arrastrar y soltar.

Este mismo builder recibió críticas a lo largo de los años porque los cambios eran difíciles de gestionar, ya que las interfaces se guardan en un formato de archivo que no es legible para las personas, lo cual dificulta el seguimiento de las modificaciones a lo largo del tiempo. Esto puede ser un inconveniente para los desarrolladores que trabajan en equipo.

Las críticas hacia la creación de interfaces por medio de un builder suscitó debates sobre si la construcción de la interfaz de usuario debería ser mediante guiones gráficos o usando código.

Los patrones de interfaz de usuario se desarrollaron y maduraron con rapidez en el mundo del desarrollo web, resultando en frameworks como React y Vue que siguen patrones declarativos y basados en componentes. Esto dio lugar a que en la Conferencia Mundial de Desarrolladores (WWDC) de 2019 Apple anunciara SwiftUI. Lo cual dio como resultado un framework de interfaz de usuario declarativo a Xcode.

¿Por qué elegir SwiftUI?

Una de las ventajas principales de elegir SwiftUI es que su sintaxis es fácil de leer y natural a la hora de escribir. Ya he mencionado que SwiftUI es un framework de usuario declarativo, ¿pero qué significa esto?

Significa que los desarrolladores simplemente tienen que declarar lo que quieren que haga su interfaz de usuario, de forma muy similar a como funciona en los frameworks de desarrollo web.

¿Cuál es la diferencia entre un framework imperativo y uno declarativo?

El mejor ejemplo que se me ocurre para explicar las diferencias entre ambos es utilizar el ejemplo de la WWDC de Apple: la tostada de aguacate.

La forma imperativa de hacer las cosas es algo así:

  1. Preparar los ingredientes: aguacate, pan, mantequilla, sal marina, pimienta
  2. Reunir el equipo: tostadora, plato, cuchillo para la mantequilla.
  3. Tostar ligeramente una rebanada de pan.
  4. Colocar la tostada en un plato.
  5. Extender una fina capa de mantequilla sobre la tostada.
  6. Cortar el aguacate por la mitad en su eje más largo.
  7. Retirar la semilla del aguacate.
  8. Cortar cada mitad de aguacate en rodajas de medio centímetro.
  9. Colocar las rodajas de aguacate con una superposición del 50% sobre la tostada.
  10. Agregar tres pizcas de sal.
  11. Agregar cinco pizcas de pimienta.
  12. Limpiar la tostadora y el cuchillo de la mantequilla.
  13. Comer la tostada de aguacate.

La forma declarativa de hacerlo, o sea, con SwiftUI es algo así:

  1. “Me gustaría una tostada de aguacate con mantequilla, sal y pimienta”.
  2. “Ah, y córtalo en diagonal”.

¿Ves la diferencia? En lugar de construir la vista pieza por pieza, SwiftUI te permite describir la vista y el framework se encarga de las instrucciones. Esto hace que el código sea más fácil de leer y escribir. También tiene la ventaja de un mejor rendimiento, ya que SwiftUI creará una vista de la manera más eficiente posible.

En resumen, SwiftUI es el camino más corto hacia una gran interfaz de usuario.

Hot reloading

El hot reloading o recarga en caliente es uno de los mejores beneficios de SwiftUI.

Normalmente, cuando construyes interfaces de usuario en Xcode utilizando Storyboards (o código sin SwiftUI) tienes que compilar y ejecutar tu aplicación para ver los cambios. Este proceso puede llegar a tardar un par de segundos o minutos dependiendo de la complejidad de tu aplicación.

Dado que la interfaz de usuario se puede cambiar varias veces a lo largo de la vida del proyecto, esto puede resultar en horas de tiempo perdido. También dificulta la colaboración en tiempo real con tu diseñador, ya que los cambios se tardan más en aparecer en pantalla.

Por ello, resulta positivo contar con hot reloading a la hora de trabajar con la interfaz gráfica de tu aplicación.

Gestión de estados y binding

Otra ventaja de SwiftUI es la gestión de estados que lleva incorporada. Anteriormente, se utilizaban frameworks como RxSwift o ReSwift para conseguir resultados similares.

SwiftUI viene por defecto con herramientas para facilitar el flujo de datos, como lo son:

  • Property
  • @Environment
  • BindableObject
  • @State
  • @Binding

Con esto SwiftUI pretende facilitar que tu aplicación tenga una única fuente de verdad.

Funciones integradas

Existen varias características incorporadas que solían ser engorrosas de desarrollar manualmente. Esto incluye tipado dinámico, modo oscuro, soporte de idiomas y más, que son creadas automáticamente.

SwiftUI fue diseñado pensando en que los desarrolladores pasen menos tiempo construyendo características básicas y más tiempo construyendo características personalizadas.

Aprende una vez, aplica en cualquier lugar

SwiftUI fue diseñado para funcionar en múltiples plataformas de Apple. Esto significa que puedes aplicar SwiftUI no solo en iOS, sino también en tvOS, macOS y watchOS.

Incluso hay un proyecto para llevar SwiftUI a la web y se llama SwiftWebUI.

¿Por qué NO elegir SwiftUI?

SwiftUI a pesar de todas sus ventajas tampoco es perfecto, todavía se presentan algunos errores por aquí o por allá.

La principal desventaja de SwiftUI es que aún es muy nuevo, por lo que la cantidad de recursos disponibles puede llegar a ser menor. Sin embargo, este no es un gran problema, es una comunidad que se está desarrollando.

Otras de las desventajas que tiene son:

  1. Solo es compatible con iOS 13+ y Xcode 11+, por lo que no se pueden crear aplicaciones de versiones inferiores utilizando SwiftUI.
  2. Puede llegar a ser difícil para alguien cambiar de Storyboard a SwiftUI, ya que es difícil visualizar la jerarquía de vistas en forma de código.
  3. No hay una manera directa de migrar de Storyboard a SwiftUI. Esto obliga a quien desarrolla a seguir utilizando Storyboard para las aplicaciones existentes en versiones inferiores.

Y Storyboard, ¿por qué elegirlo?

El Storyboard es una parte del constructor de interfaces que ha sido la forma más común de crear UI para aplicaciones iOS después de su lanzamiento con iOS 5. Cualquier proyecto nuevo de iOS tiene un archivo Main.storyboard por defecto.

Diagram1.png

En Xcode, el Storyboard es un archivo que contiene una pantalla vacía tipo canvas. Sobre esta pantalla puedes arrastrar y soltar todo tipo de objetos disponibles en la librería de objetos de Xcode. Esta librería permite crear casi todo, desde controladores hasta campos de texto, pasando por imágenes, tablas y hasta botones sin escribir ni una sola línea de código.

Las principales ventajas de los Storyboards son:

  1. Los Storyboards son una manera fácil de sumergirse en el desarrollo de iOS.
  2. Puedes crear un prototipo de una aplicación en un par de horas, lo que facilita la visualización de la aplicación sin tener que escribir cientos de miles de líneas de código.
  3. La biblioteca de objetos tiene una amplia colección.
  4. Presta un amplio soporte por parte de la comunidad.

¿Por qué NO elegir Storyboards?

Así como SwiftUI, los Storyboards también tienen algunas desventajas como:

  1. El control de la fuente es difícil, ya que el código del storyboard está en un formato de tipo XML, lo cual a la hora de resolver conflictos no es lo ideal, ya que no se puede entender completamente el código.
  2. Al crear la interfaz de usuario de la aplicación se deben tener en cuenta los problemas de autolayout, debido a que las interfaces no se ajustan automáticamente y es necesario revisar y hacer ajustes para cada una de las vistas.
  3. Entre más pantallas de Storyboards, la gestión de estos puede llegar a ser caótica y tener una estructura muy compleja.

Entonces, ¿cuál debería elegir?

Después de conocer las ventajas y desventajas de los Storyboards y SwiftUI, puedo decir que trabajar con Storyboards es la forma más sencilla de empezar con Swift para los principiantes, ya que la curva de aprendizaje es menor a la hora de construir interfaces.

La decisión final es tuya, ten en cuenta las ventajas y desventajas de cada uno de estos frameworks y elige el que se adecúe mejor a las necesidades de tu proyecto.

Por último, déjame recomendarte el Curso de Introducción a Swift para que empieces a dar tus primeros pasos en el desarrollo de aplicaciones móviles con Swift y elijas el framework de interfaces que prefieras, con base en todo lo aprendido en este curso.

Recuerda nunca parar de aprender 💚

Alex
Alex
alexcamachogz

52138Puntos

hace 2 años

Todas sus entradas
Escribe tu comentario
+ 2
1
27305Puntos
2 años

Hola, tengo una duda … ¿Qué es UI KIT, y cuál es la diferencia entre Storybords y Swift UI? 🍏