Saturday, September 8, 2018

Displaying & Caching Image Using Kingfisher

Image atau gambar adalah hal yang tidak bisa dihindari dan pasti selalu digunakan dalam setiap front-end software development tidak peduli platform apa yang digunakan, baik itu mobile, desktop, ataupun web. Pada kesempatan kali ini saya akan membahas dalam platform mobile, khususnya iOS. 

Dalam pembuatan aplikasi mobile pasti kita akan membutuhkan image untuk mempercantik sekaligus menjelaskan sesuatu, misalnya untuk melakukan send email kita menggunakan button bergambar amlop. Salah satu hal penting yang tidak terlihat dalam software development mobile adalah memperhatikan jumlah data yang digunakan. Tentunya yang banyak memakan data adalah jika kita menggunakan image yang tidak disimpan di dalam installer (.ipa). Tentu saja jika user menyadari bahwa aplikasi kita menggunakan banyak sekali data, maka bukan tidak mungkin user akan berhenti menggunakan aplikasi tersebut.

Solusi dari permasalahan ini adalah menggukan cache. Apa itu cache? Cache adalah suatu cara untuk menyimpan data yang sudah diproses oleh user. Data ini suatu waktu bisa saja digunakan lagi tanpa perlu melakukan proses komputasi ulang. Untuk lebih jelasnya bisa dibaca di dewaweb dan techtarget.

Salah satu library yang populer di iOS (Swift) development adalah Kingfisher. Kingfisher merupakan library yang bisa membantu kita menampilkan image melalui URL dan sekaligus melakukan caching pada image tersebut, sehingga jika akan digunakan lagi maka aplikasi tidak akan me-load ulang gambar itu melalui URL-nya.

Install Kingfisher
Jika menggunakan CocoaPods, maka cukup dengan menambahkan line berikut di Podfile :

pod 'Kingfisher', '~> 4.0'


Jika menggunakan Carthage, maka tambahkan line berikut di Cartfile :

github "onevcat/Kingfisher" ~> 4.0

Jika menggunakan Swift-Package-Manager, maka tambahkan liner berikut di Package.swift :

import PackageDescription

let package = Package(
    name: "YourAwesomeSoftware",
    dependencies: [
        .Package(url: "https://github.com/onevcat/Kingfisher.git",
                 majorVersion: 4)
    ]
)

Fitur-fitur dari Kingfisher
  1. Unduhan gambar dan caching tidak sinkron.
  2. Jaringan berbasis URLSession. Prosesor dan filter gambar dasar disediakan.
  3. Cache multi-layer untuk memori dan disk.
  4. Tugas mengunduh dan memproses yang tidak dapat dibatalkan untuk meningkatkan kinerja.
  5. Komponen independen. Gunakan sistem pengunduh atau caching secara terpisah sesuai kebutuhan Anda.
  6. Mengambil gambar terlebih dahulu dan menampilkannya dari cache nanti bila diperlukan.
  7. Ekstensi untuk UIImageView, NSImage dan UIButton untuk langsung mengatur gambar dari URL.
  8. Animasi transisi internal saat mengatur gambar.
  9. Placeholder yang dapat disesuaikan saat memuat gambar.
  10. Pemrosesan gambar yang dapat diperluas dan dukungan format gambar.
Cara menggunakan
Cara paling dasar dalam menggunakan Kingfisher adalah menggunakannya di ImageView.
let url = URL(string: "url_of_your_image")
imageView.kf.setImage(with: url)
Tentu saja kingfisher tidak hanya bisa digunakan di ImageView saja, anda juga bisa menggunakannya pada komponen lain, misalnya UIButton, custom-made-view, dan lainnya menggunakan cara yang sama.

Sekian informasi yang dapat saya bagikan, jika ada kesalahan, masukan, ataupun pertanyaan silakan tinggalkan di komentar atau kirim email

Sharing is Caring

References :
https://github.com/onevcat/Kingfisher
https://github.com/onevcat/Kingfisher/wiki/Installation-Guide
https://searchstorage.techtarget.com/definition/cache
https://www.dewaweb.com/blog/penjelasan-cache-dan-jenis-jenisnya/

No comments:

Post a Comment