21.08.2020 / Insights

Switching to Swift UI

SwiftUI is the new user interface toolkit from Apple that lets us design apps in a declarative way across all Apple operating systems. Since it was announced in 2019, with MacOS Catalina and iOS 13, our development team has been excited! It might just solve a very real problem for us.

It’s important to provide some background on our excitement. Our front-end applications are always built as Progressive Web Apps (PWA) in a JavaScript framework like Vue or React. This means that with Google’s support for PWA’s and TWA’s (Trusted Web Apps) in the Google Play Store, we never have to write and support separate code bases for Android. This is great!

Enter iOS and the Apple ecosystem.

One of our biggest problems has always been the lack of real support for PWA’s on iOS devices. You can save an app to the home screen and use service workers for offline mode, but features such as push notifications require an Xcode packaged and signed app in the Apple App Store. In the past we have solved this issue by using either Ionic or React Native for cross platform mobile apps. Whilst we were still writing Javascript and our front-end team could work cross platform, there was very little code reusability and we were still maintaining multiple code bases.

With the announcement of SwiftUI we decided to take another look at the native iOS ecosystem and see if this could solve at least some of our issues. We would still be writing and supporting two code bases for our application but we would solve a few problems inherent with hybrid mobile apps. For example with React Native we spent countless hours upgrading minor versions as the native APIs changed. With Ionic we spent countless hours debugging issues with Cordova libraries. Not to mention performance issues on lower end devices.

Why Swift UI

One of the major reasons for the choice to switch to SwiftUI was the simplicity. We could write iOS apps almost like we wrote Javascript apps. We could also start to explore new technology such as Augmented Reality. The Apple Glasses surely can’t be too far away!

Some Pros

This is by no means an exhaustive list of advantages, these are just some of the reasons we love SwiftUI.

  • We no longer need to create complex storyboards and UIKit code.
  • With the standard SwiftUI elements like TextField, HStack and Spacer() we have a very
    simple method to create the same components as the Vue applications.
  • Easy to learn with simple syntax.
  • It allows us to easily manage themes and the popular “Dark Mode”
  • SwiftUI provides really easy to use state management with @State, @Binding,
    @ObservedObject and @EnvironmentObject.
  • Live Preview allows much easier work with the visual elements.
  • SwiftUI will always produce a valid layout.
  • Because we are writing a truly native application we no we shouldn’t run into any major
    performance or stability issues.

Some Cons

Whilst SwiftUI is a major improvement over the standard UIKit and storyboard approach, there are still some major disadvantages. These are just a few of the issues we have:

  • It supports only iOS 13 and Xcode 11.
  • It’s still very young, so there isn’t much community help on Stack Overflow and other
    platforms.
  • It doesn’t allow you to examine the view hierarchy in Xcode Previews which has meant
    we end up building on the simulator.
  • Working with Rest API’s can sometimes generate a ton of complex code.

Our Final Thoughts

Hopefully the above info has given you some insight into SwiftUI and where it may fit into your stack. Whilst it may seem like quite a challenge to get started, once you understand a few basics the development process does become fun! Right now we are planning to stick with SwiftUI as our Vue companion on iOS devices. Apple are looking to support PWA's more in the Safari browser but it’s likely to be some way off.