Objective-Cで外部ホスト画像の読み込みを非同期で行う

UIImageViewで外部ホストの画像を読み込むことってかなり頻繁にあると思いますが、何も考えずに書きみたいなコードを書くと、画像読み込み時にアプリケーションがフリーズしたかのような挙動になります。要は同期的に読み込み処理が走って、描画や操作の処理がストップするわけです。APIとか通信の非同期化はちゃんとしてても、ここはしてないっていうケースがあるのでメモ。

何も考えずにUIImageViewで画像読み込み

NSString *imageURL = @"http://www.example.com/hoge.jpg";
UIImageView *iv = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
UIImage *img = [UIImage imageWithData:[NSData dataWithContentsOfURL: [NSURL URLWithString: imageURL]]];
iv.image = img;
[self addSubview:iv];

表示はされます。だけど、重い画像や、こんなUIImageViewが何個もあると確実に表示&操作がもたつきます。

dispatch_async使って非同期で画像を読み込む

NSString *imageURL = @"http://www.example.com/hoge.jpg";
UIImageView *iv = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];

dispatch_queue_t q_global = dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0);
dispatch_queue_t q_main = dispatch_get_main_queue();
dispatch_async(q_global, ^{
    UIImage *img = [UIImage imageWithData:[NSData dataWithContentsOfURL: [NSURL URLWithString: imageURL]]];
    
    // UI操作はメインスレッドで行う
    dispatch_async(q_main, ^{
        iv.image = image;
        [self addSubview:iv];
    });
});

画像の通信部分は非同期で、描画する部分はメインスレッドで行う感じです。これだけでUIImageViewが何個あっても操作が邪魔されるようなことはなくなります。

Feed

最新記事

開発フローを独自進化させ続けている開発チームの話

こんにちは CTO の [@zaru](https://twitter.com/zaru) です。 スクラム開発をしている開発チームが、開発フローを独自進化させていて、それが良い取り組みだったので紹介しようと思います。 #...

235650?v=4
zaru
2017年11月20日

退職者を招いたLTイベントを開催した

こんにちは、ベーシック CTO [@zaru](https://twitter.com/zaru) です。 ベーシック開発部では毎月月末の金曜日にTGIFと称して、 ~~飲み会 + アナログゲームなイベント~~ 技術 LT 大会...

235650?v=4
zaru
2017年10月12日

山形ラボ、TGIFはじめました

こんにちは。株式会社ベーシック山形ラボの長谷川です。 いろんなところで書いたりなんだりしてますが、弊社には山形に「山形ラボ」というリモート拠点がありまして、そこで4人のエンジニアが働いております。 今回は その山形ラボで、...

10917612?v=4
roki1801
2017年10月10日