Glide: ano ito, library ng mga imahe at aplikasyon sa Android

Ano ang Glide?

Glide — ay isang library para sa mabilis at mahusay na pag-load ng mga imahe, animated na GIF at video frame sa Android applications. Ang proyekto ay binuo ng Bumptech sa ilalim ng pamamahala ng Google at malawakang ginagamit sa mga opisyal na aplikasyon ng Google.

Ang panloob na arkitektura ng Glide ay binuo sa isang component-based approach: Engine ang namamahala sa pagpapatupad ng mga kahilingan, DecodeJob ang responsable para sa decoding, at ResourceDecoder ang nagko-convert ng raw data sa Bitmap o Drawable. Ang bawat yugto ay maaaring i-customize sa pamamagitan ng modules at registers, na ginagawang lubos na flexible ang Glide para sa mga hindi standard na format ng imahe.

Hindi tulad ng maraming kakumpitensya, ang Glide ay dinisenyo mula pa sa simula na isinasaalang-alang ang mga katangian ng Android: lifecycle ng Activity at Fragment, pag-ikot ng screen, pagbabago ng configuration. Awtomatikong pinipigilan at pinagpapatuloy ng library ang pag-load depende sa estado ng component.

Ayon sa Android Developers, ang Glide ay inirerekomendang library para sa pag-load ng mga imahe sa opisyal na dokumentasyon ng Google. Ito ay ginagamit sa Google Play, Google Maps at iba pang produkto ng kumpanya, na nagpapatunay ng pagiging maaasahan at performance nito.

Ang pangunahing pagkakaiba ng Glide sa mga alternatibo — awtomatikong pag-scale ng mga imahe sa laki ng ImageView. Kung ang Picasso ay naglo-load ng imahe sa buong resolution at pagkatapos ay nagse-scale, ang Glide ay nagde-decode ng file diretso sa kinakailangang laki. Binabawasan nito ang peak memory consumption at pinapabilis ang pagpapakita sa mga listahan na may iba't ibang laki ng cell.

Mga pangunahing kakayahan ng Glide

Glide ay nagbibigay ng malawak na hanay ng mga function para sa pagtatrabaho sa mga imahe, na sumasaklaw sa parehong simple at kumplikadong mga sitwasyon ng pag-load ng nilalaman.

Suporta para sa GIF at animated na WebP

GIF at animated na WebP ay nilo-load at ipinapakita ng Glide na kasing simple ng mga static na imahe. Awtomatikong nakikita ng library ang format batay sa MIME type at nade-decode ang animation, na nagpapakita ng mga frame sa background thread. Para sa pamamahala ng playback, available ang mga asGif at asBitmap method.

Integrasyon sa lifecycle

Glide ay awtomatikong nagbubuklod sa lifecycle ng Activity, Fragment at View. Kapag nag-pause ang Activity, ang pag-load ay hihinto, kapag na-destroy — kakanselahin. Pinipigilan nito ang memory leaks at pag-load ng mga imahe para sa mga sarado nang screen. Ang integrasyon ay gumagana sa pamamagitan ng suporta sa LifecycleOwner.

Pag-load ng video frame

Glide ay maaaring mag-extract ng mga frame mula sa video sa pamamagitan ng URL o lokal na path. Para dito, ginagamit ang asBitmap() method kasama ng load() para sa video URI. Awtomatikong pinipili ng Glide ang key frame o frame batay sa tinukoy na timestamp. Ito ay kapaki-pakinabang para sa pagpapakita ng preview ng video.

Pag-generate at configuration ng GlideApp

GlideApp — ay isang generated na klase na nagbibigay ng extended API batay sa configuration ng AppGlideModule. Sa tulong nito, maaaring gamitin ang mga method na hindi available sa standard na Glide.with: pag-load na may custom na default options, integrasyon sa mga library at pre-set na transformations. Para sa pag-generate, kinakailangan ang @GlideModule annotation sa klase na nagmamana ng AppGlideModule.

Paano gumagana ang Glide?

Glide ay gumagamit ng multi-layered architecture na may engine, decoders, transformations at cache. Ang bawat kahilingan ay dumadaan sa chain ng handlers na nag-o-optimize ng pag-load para sa isang partikular na ImageView.

Arkitektura at pipeline

Sa pagtawag ng into(view), sinusuri ng Glide ang cache: aktibong resources, cache sa RAM, disk cache at pagkatapos lamang ang network. Ang imahe ay awtomatikong nase-scale sa laki ng target na ImageView na isinasaalang-alang ang screen density at scaleType. Binabawasan nito ang paggamit ng memorya — pangunahing bentahe ng Glide.

Glide.with(context)
    .load("https://example.com/image.jpg")
    .placeholder(R.drawable.loading)
    .error(R.drawable.error)
    .override(400, 300)
    .centerCrop()
    .into(imageView)

Pag-install at configuration ng Glide

Pag-install ng Glide ay ginagawa sa pamamagitan ng Gradle. Ang library ay nangangailangan ng configuration sa pamamagitan ng AppGlideModule para sa pag-generate ng API. Minimum na bersyon ng Android API — 21.

Pagdaragdag ng dependencies

Sa build.gradle idagdag ang Glide na may kapt annotation processor para sa pag-generate ng GlideApp API. Para sa Kotlin gamitin ang kapt sa halip na annotationProcessor. Ang bersyon ng Glide 4.16+ ay stable na gumagana sa Android Gradle Plugin 8.x.

dependencies {
    implementation "com.github.bumptech.glide:glide:4.16.0"
    annotationProcessor "com.github.bumptech.glide:compiler:4.16.0"
}

// Para sa Kotlin gamitin ang kapt
// kapt "com.github.bumptech.glide:compiler:4.16.0"

Paglikha ng AppGlideModule

AppGlideModule — mandatoryong component para sa pag-configure ng Glide. Pinapayagan nitong itakda ang laki ng cache, custom na HttpStack at magrehistro ng sariling decoders. Ang module ay ini-scan ng Glide sa pagsisimula ng aplikasyon. Ang @GlideModule annotation ay awtomatikong nagrerehistro nito.

@GlideModule
public class MyGlideModule extends AppGlideModule {
    @Override
    public void applyOptions(Context context, GlideBuilder builder) {
        int diskCacheSize = 250 * 1024 * 1024;
        builder.setDiskCache(
            new DiskLruCacheFactory(cacheDir.getPath(), diskCacheSize)
        );
    }
}

Mga halimbawa ng paggamit ng Glide

Mga halimbawa sa ibaba ay nagpapakita ng tipikal na sitwasyon: pag-load ng imahe, pagtatrabaho sa GIF at pag-extract ng video frame.

Pag-load ng imahe na may placeholder

Basic na pag-load sa pamamagitan ng Glide.with().load().into() — minimal na code para sa pagpapakita ng imahe mula sa network. Awtomatikong inaayos ng Glide ang laki ng ImageView. Ang placeholder ay ipinapakita habang naglo-load, at error — kapag may error.

Glide.with(fragment)
    .load("https://example.com/photo.jpg")
    .placeholder(R.drawable.placeholder)
    .error(R.drawable.error)
    .skipMemoryCache(true)
    .diskCacheStrategy(DiskCacheStrategy.NONE)
    .into(imageView)

Pag-load ng GIF image

GIF ay nilo-load tulad ng static na imahe — awtomatikong nakikita ng Glide ang format batay sa uri ng nilalaman. Para sa sapilitang pag-load bilang static na imahe gamitin ang asBitmap(), para sa GIF — asGif(). Mahusay na dine-decode ng Glide ang mga visible frame lamang.

Glide.with(context)
    .asGif()
    .load("https://example.com/animation.gif")
    .into(imageView)

// I-load ang unang frame ng GIF bilang static na imahe
Glide.with(context)
    .asBitmap()
    .load("https://example.com/animation.gif")
    .into(imageView)

Pag-load ng video frame

Video frame ay ini-extract ng Glide batay sa URI ng lokal o remote na video. Bilang default, nilo-load ng Glide ang key frame. Para sa pagtukoy ng partikular na timestamp, ginagamit ang frameMillis. Ito ay maginhawa para sa pagpapakita ng preview sa gallery ng video.

String videoUrl = "https://example.com/video.mp4";

Glide.with(context)
    .asBitmap()
    .load(videoUrl)
    .override(200, 200)
    .into(imageView)

Pag-optimize ng Glide para sa malalaking listahan

Pag-optimize ng Glide para sa RecyclerView — kritikal na kasanayan sa pag-develop ng mga aplikasyon na may maraming imahe. Ang tamang configuration ay pumipigil sa lag at OOM errors.

Isa sa mga pangunahing kakayahan ng Glide — integrasyon sa RecyclerView sa pamamagitan ng RecyclerViewPreloader. Ang component na ito ay nagsusuri ng bilis ng pag-scroll at direksyon ng paggalaw, naglo-load nang maaga ng mga imaheng lalabas sa screen pagkatapos ng ilang elemento. Para sa pagtatrabaho sa preloader, kailangang i-implement ang PreloadSizeProvider interface at ipasa ito sa constructor kasama ng target na ImageView.

Ang paggamit ng override() method na may eksaktong sukat ng ImageView ay makabuluhang nagpapabilis ng pag-load. Kapag alam ng Glide ang eksaktong sukat ng target, maaari nitong i-decode ang imahe diretso sa kinakailangang resolution, na lalaktawan ang scaling stage. Pinapaikli nito ang oras ng decoding at binabawasan ang peak memory consumption ng 30–40%.

Para sa mga feed na may heterogenous na nilalaman, gumamit ng iba't ibang RequestOptions para sa bawat uri ng elemento. Halimbawa, para sa malalaking banner image ay maaaring itakda ang override(1200, 600) at RGB_565 quality, at para sa avatar — override(200, 200) at pag-round sa pamamagitan ng transform. Ang ganitong approach ay nagbibigay-daan sa optimal na paggamit ng resources para sa bawat uri ng nilalaman.

Paghawak ng mga error sa pag-load

Glide ay nagbibigay ng flexible na mga kakayahan para sa paghawak ng error sa pamamagitan ng error images at custom na RequestListener. Pinapayagan ng RequestListener na mag-react sa matagumpay na pag-load o error, mag-log ng mga failure o magpadala ng analytics. Maaari ring i-configure ang fallback — image na ipinapakita kapag ang load() ay nakatanggap ng null sa halip na link.

Gamitin ang RecyclerViewPreloader para sa pre-loading ng mga imahe bago mag-scroll ang user sa kanila. Sinusuportahan ng Glide ang integrasyon sa RecyclerView sa pamamagitan ng preloader na nagsusuri ng bilis ng pag-scroll at naglo-load ng mga imahe nang maaga.

Thumbnail multiplication ay nagpapahintulot na unang magpakita ng pinababang bersyon ng imahe, pagkatapos ay i-load ang buong imahe. Ang pagtawag ng thumbnail(0.25f) ay naglo-load ng bersyon na 25% ng laki, na agad na ipinapakita, habang ang full-size na imahe ay nilo-load mamaya. Lumilikha ito ng pakiramdam ng instant loading.

Para sa list adapter gamitin ang .override() na may eksaktong sukat ng ImageView upang hindi i-scale ng Glide ang imahe sa bawat pagkakataon. Binabawasan nito ang CPU load at memory consumption. Ang laki ng cache ay pinipili nang experimentally, ngunit ang 250 MB para sa disk at 20% ng available na memorya ay magandang panimulang punto.