AsyncImage in SwiftUI

Gabriel Theodoropoulos
6 min readJun 10, 2021
A woman hand holding an iPhone and taking picture of the table right under. On the table there is an open book, with eye glasses, coffee, a small decorative plant and decorative table cloth. On top of the image the AsyncImage in SwiftUI title is written, and SerialCoder.dev with small letters at the bottom.
Credits: Photo by Ylanite Koppens from Pexels

At the time of writing this post, WWDC21 is still in progress. And as it turns out, this year’s announcements reveal really great and exciting news for developers. Among them, SwiftUI seems that has been equipped well with new APIs, views and tools that will undoubtedly make building apps with it an even more easier and fun task.

A new and quite interesting view introduced in this, third release of SwiftUI, is the AsyncImage. As the name makes it pretty obvious, this view displays images after having fetched them from a remote URL. Doing so has been traditionally a manual task, but now AsyncImage does all the work behind the scenes until the image has been presented in the view. The AsyncImage API is simple, yet flexible enough; it provides options to display a placeholder image while waiting for the remote one, deal with potential errors, show the downloaded image animated, and of course, style the image as we like using view modifiers.

There is only one downside, and that is that fetched images are not cached for future use. AsyncImage view downloads the remote image whenever it’s about to be displayed. That’s okay for images that will be shown to users just a few times. But for remote images that an app presents often, it’s not recommended to always fetch them in real time. A manual implementation to fetch and cache images is still necessary.

--

--

Gabriel Theodoropoulos

An iOS & macOS app maker writing code in Swift. Author of countless programming tutorials. Content creator. https://serialcoder.dev