ottijp blog

SwiftUIのプレビューで"Updating took more than 5 seconds"とエラーが発生する原因

2021-07-27AppleSwiftUIiOS

環境

  • macOS: 10.15 (Catalina)
  • Xcode: 12.4

問題

XcodeでSwiftUIのコードを書く際に,プレビューを表示できます. しかし,このプレビュー機能がどうにもダメダメで,エラーの原因がわからず無駄に時間を浪費することがあります. (昔よりは良くなってると思いますが,Xcode 12.4でもまだダメダメですね・・・.)

よく遭遇するのが以下のエラーです.

swiftui problem01

Updating took more than 5 seconds

Updating a preview from HogeView_Previews SwiftUIProblem.app (28374) took more than 5 seconds.

プレビューに時間がかかった,みたいなエラーですが,原因が全くわかりません. エラーメッセージを検索すると色々な原因があるようですが,1つの原因としてランタイムエラーが発生している場合があります. コードサンプルとともに,実例を書いておきます.

問題が起きる例

例えば,以下のようなSwiftUIのビューを書いてみました.

HogeView.swift
import SwiftUI

struct HogeView: View {
  @State var idx = 0
  var cats = ["Tama", "Mike", "Kuro"]

  var body: some View {
    Text(cats[idx])
  }
}

struct HogeView_Previews: PreviewProvider {
  static var previews: some View {
    HogeView(idx: 0)
  }
}

@State var idx のインデックスの猫名を表示するだけです. プレビューすると以下のように表示されます.

swiftui problem02

ここで,HogeView_Previewsを次のように変更してみます.(配列の要素より大きいインデックスを指定する.)

struct HogeView_Previews: PreviewProvider {
  static var previews: some View {
    HogeView(idx: 3)
  }
}

すると冒頭のUpdating took more than 5 secondsというエラーが表示され,プレビューが表示されなくなりました.

プレビューエリアのDiagnosticsを押すと,次の画面が表示されます.

swiftui problem03

今回はわざとやったので,インデックスの指定が悪いのはわかっていますが,これらのエラーメッセージが表示されても,何が原因でプレビューが失敗しているのか原因がわかりません. せめてHogeView(idx: 3)の行にエラーが出てくれれば気付けるんですけどね・・・.

まとめ

ということで,Updating took more than 5 secondsのエラーが表示された場合は,プレビュー用のstructがランタイムエラーが起きるコードになっている可能性があるので,そうなっていないか確認すると良いと思います.

ビューのコード(今回の例だとHogeView)も,少し複雑になると,エラー行が特定できないエラー表示になったりするので,まだまだSwiftUIでコードを書くと辛みが多いな・・・と感じます.

まだ試していませんが,今ベータ版が出ているXcode13では改善されているとよいですね.


ottijp
Satoshi SAKAO (@ottijp)

都内でアプリケーションエンジニアをしています

...