質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Firebase

Firebaseは、Googleが提供するBasSサービスの一つ。リアルタイム通知可能、並びにアクセス制御ができるオブジェクトデータベース機能を備えます。さらに認証機能、アプリケーションのログ解析機能などの利用も可能です。

iOS

iOSとは、Apple製のスマートフォンであるiPhoneやタブレット端末のiPadに搭載しているオペレーションシステム(OS)です。その他にもiPod touch・Apple TVにも搭載されています。

UI

UIはUser Interfaceの略であり、人間がコンピュータとやりとりをするためのシステムです。

タブ

コンテンツの上下左右に参照用のメニューを設けることで、複数の要素やページの表示を可能にするユーザーインターフェイスパターンのこと。メニューをクリックすると、一つの要素が可視化され、他の要素は見えなくなる。

Swift

Swiftは、アップルのiOSおよびOS Xのためのプログラミング言語で、Objective-CやObjective-C++と共存することが意図されています

Q&A

解決済

2回答

2489閲覧

【Swift】ニュースアプリの快適なタブめくりを実現するためには?

HNSZ

総合スコア33

Firebase

Firebaseは、Googleが提供するBasSサービスの一つ。リアルタイム通知可能、並びにアクセス制御ができるオブジェクトデータベース機能を備えます。さらに認証機能、アプリケーションのログ解析機能などの利用も可能です。

iOS

iOSとは、Apple製のスマートフォンであるiPhoneやタブレット端末のiPadに搭載しているオペレーションシステム(OS)です。その他にもiPod touch・Apple TVにも搭載されています。

UI

UIはUser Interfaceの略であり、人間がコンピュータとやりとりをするためのシステムです。

タブ

コンテンツの上下左右に参照用のメニューを設けることで、複数の要素やページの表示を可能にするユーザーインターフェイスパターンのこと。メニューをクリックすると、一つの要素が可視化され、他の要素は見えなくなる。

Swift

Swiftは、アップルのiOSおよびOS Xのためのプログラミング言語で、Objective-CやObjective-C++と共存することが意図されています

0グッド

0クリップ

投稿2018/10/30 12:35

編集2018/11/01 13:17

こんばんわ
Swift+Firebase+XLPagerTabStripを利用して、ニュースアプリを作成しています。

基本部分は完成したのですが、画面表示が遅い問題があります。
立ち上げの際もそうですし、タブめくりした際の表示はより遅い状況です・・・・

有名なグノシー他、ニュースアプリですと
タブ切り替えの際はなんのストレスもなく、即時表示されていますが、
どのような仕組みかご存知でないでしょうか?
曖昧な依頼で恐縮ですが、快適に表示されるコツや参考サイト、参考コードをご存知でしたら
お力添えいただけると幸いです。

■基本情報
・画面イメージイメージ説明
・構造イメージ説明

  • タブ毎にストーリーボード、swiftがあります。
  • 表示、切り替え時に、表示された画面のviewdidloadでfirebaseのタブに該当する箇所より情報を取得後、tableviewをリロードして表示

■検討していること
1タブ目表示時に、3タブ目までの情報をfirebaseより取得しておくことで解決できるのかなと思いましたが、
表示されないかもしれないタブの情報を取得するのは無駄なのかなとも思っています。
世間一般的にはどうなのかご存知でないでしょうか。

■読み込み速度が遅い理由
「 let imageData = try? NSData(contentsOf: url! as URL,options: NSData.ReadingOptions.mappedIfSafe)」の処理に約1秒かかってしまいます。。。

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { let cell = tableView.dequeueReusableCell(withIdentifier: "ContentsTableViewXib") as! ContentsTableViewXib cell.selectionStyle = UITableViewCellSelectionStyle.none let dict = items[(indexPath as NSIndexPath).row] //jsonデータを代入 let contentsTableImage = cell.viewWithTag(3) as! UIImageView imageURL = dict["Image"] as? String //0.000(s) //dictから画像URLを取得 let url = NSURL(string: "(imageURL!)") //0.000(s)  let imageData = try? NSData(contentsOf: url! as URL,options: NSData.ReadingOptions.mappedIfSafe) // 1.179(s) let img = UIImage(data:imageData! as Data) //0.030(s) contentsTableImage.image = img //0.000(s) return cell }

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

ベストアンサー

先読みでよいと思います
大手は先読みしていないところもありますが、あれは色々工夫して速度を上げてるのでアレで良いんだと思います
(問題はpageViewControllerの先読み方法です)

今後のポイントとしてはa
・viewの表示が遅いのか、APIが遅いのかを調べる
・PageViewControllerのデフォルトの先読みはviewDidLoadまでしか呼ばれない

あたりだと思います
私が自分で実装するなら横UICollectionView使っちゃいます。iOS10から先読みが強化されたので(ただ全部合わせて1画面になるので設計に注意が必要ですが)

投稿2018/10/31 05:15

kosanai

総合スコア471

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

HNSZ

2018/11/01 13:19

kosanai様 ご丁寧にありがとうございます! 遅い理由の特定ができておらず、実施してみた結果として、 APIは問題ないのですが、 jsonから取得した画像urlデータをtableviewcellに表示するタイミングで、 1枚毎に約1秒かかってしまっていました。 ソースを本文に追加しておりますので、ご覧いただけないでしょうか。 この時間を短縮するには、画像ローダーの導入で解決されるものでしょうか? あるいは、ソースコード自体に改善の余地がございますでしょうか? もしご存知でしたらご教示いただけると嬉しいです。 宜しくお願いします。 >横UICollectionView使っちゃいます こちらの検討ができていなかったため、速度比較してみたいと思います。 情報ありがとうございます!
kosanai

2018/11/02 01:15 編集

一旦ソース見ずに予想で書きますが、おそらく画像のロードをメインスレッドでやってるのではないでしょうか もしそうならば、画像ダウンロード&反映を非同期処理でやるべきですが 理解するのに少し時間がかかるので一旦便利なライブラリを使って動くか確認するのも手です https://qiita.com/H_Crane/items/422811dfc18ae919f8a4
HNSZ

2018/11/02 15:25

kosanai様 ライブラリの共有ありがとうございます! Kingfisherにて満足行く表示速度になりました。 ありがとうございます。 仕組みは追って理解いたします><
guest

0

何を優先させたいのかによって、対応方法や方針が変わると思います。
今回のあれば、画面の表示速度を優先したいということであれば、それを基準に実装すれば良いと思います。

何の処理に時間がかかり遅いのかは計測すれば、判断出来ると思いますが実施済みでしょうか。
すぐに思いつくのは、以下の要素です。
・画面描画
・データ取得(通信部分、データベースからの読み取り)
・メディアデータなどの容量が大きいものがある

それぞれ、早くする方法としては
・画面描画する量を減らす(不要な部分は描画しない)、そもそものデザインを見直す
・事前にキャッシュしておく。(アプリが起動される前に、事前にサービスなどで読み取っておく)
・読み取り頻度が高いものは、データベースから毎回読むのではなくメモリに一時保存しておく
・メディアデータもキャッシュや小さいデータ(サムネイル画像)などが活用出来ないかを検討する

上記の内容は、特別なアプリではなくとも検討される内容だと思います。
有名どころのアプリは、さらに計測やチューニングをしていると思いますが、それらはまずは計測がしっかり出来ないと検討すら出来ないと思います。

参考になれば幸いです。

投稿2018/10/31 01:16

YasuhiroMiyake

総合スコア1336

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

HNSZ

2018/11/01 13:12

Miyake様 ご丁寧にありがとうございます! 計測ができておらず、、実施いたしました。 結果として、jsonから取得した画像urlデータをtableviewcellに表示するタイミングで、 1枚毎に約1秒かかってしまっていました。。 ソースを本文に追加しておりますので、ご覧いただけないでしょうか。 この時間を短縮するには、画像ローダーの導入で解決されるものでしょうか? あるいは、ソースコード自体に改善の余地がございますでしょうか? もしご存知でしたらご教示いただけると嬉しいです。 宜しくお願いします。
YasuhiroMiyake

2018/11/02 00:45

画像ローダーが何を指しているのかが分かりませんので、それで解決するかどうか不明です。 何を解決したいのかによって、変わります。 表示速度がというのであれば、表示速度はほぼ一瞬で表示されているということで解決済みだと思います。 画像の取得速度を解決したいということであれば、いろいろな考え方が出来ます。 ・取得する画像サイズを小さいものに変える(相対的に取得時間が短くなる) ・並列でダウンロードする。(平均1秒であれば、それが同時に10枚ダウンロードしてもほぼ1秒です) ・ダウンロードするタイミングを変える。(先読みも一つの方法だと思います) ソースコードでこうすれば良い というのを公開するのは簡単ではあるのですが、 このサイトの趣旨に反するので説明だけにさせて頂きます。
HNSZ

2018/11/02 15:27

Miyake様 ご回答ありがとうございます! ひとまず、ライブラリKingfisherにて対処いたしました。 頂いたアドバイス中心に細部はこれから実施して改善します。 画像サイズはすぐにでもできそうです。 ありがとうございました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問