Skia: mohiyati, arxitekturasi va Flutter grafik muharrikidagi roli

Skia nima?

Skia — Google tomonidan ishlab chiqilgan va BSD litsenziyasi ostida mavjud bo'lgan ko'p platformali 2D grafik kutubxonasidir. U geometrik shakllar, matn, tasvirlar va soyalarni chizish uchun yagona API ta'minlaydi, quyi grafik backenddan abstraksiya qiladi. Skia C++ da yozilgan va mobil telefonlardan tortib serverlargacha bo'lgan keng qurilmalar spektrida ishlash uchun optimallashtirilgan.

Skia tarixi 2005 yilda Skia Inc. kompaniyasining yopiq kutubxonasi sifatida boshlangan. 2007 yilda Google uni sotib oldi, manba kodini ochdi va o'z mahsulotlarida ishlata boshladi. Bugungi kunda Skia Google Chrome (Chrome OS ni o'z ichiga oladi), Android (4.0 versiyasidan boshlab) va albatta Flutter-ning asosiy grafik muharrikidir. Kutubxona Google jamoasi tomonidan qo'llab-quvvatlanadi va doimiy ravishda takomillashtiriladi: yangi backendlar, unumdorlik optimallashtirishlari va zamonaviy grafik API-larni qo'llab-quvvatlash qo'shiladi.

Skia-ning asosiy xususiyati shundaki, u faqat primitivlarni chizish uchun funksiyalar to'plami emas. Bu egri chiziqlarni (yo'llarni) rastrlashtirish, tekislash (anti-aliasing), maskalarni qo'llash, shaffoflikni qayta ishlash va rang tuzatishni o'z ichiga olgan to'liq grafik konveyerdir. Skia PNG, JPEG, WebP va GIF tasvir formatlarini qo'llab-quvvatlaydi, shuningdek, gliflarni shakllantirish uchun HarfBuzz muharriki orqali matn renderlashi mumkin.

Skia boshqa grafik kutubxonalarga qarshi

Cairo (GTK da ishlatiladi) yoki Quartz 2D (macOS da ishlatiladi) dan farqli o'laroq, Skia boshidanoq turli grafik API-lari bo'lgan bir nechta platformalarda ishlash uchun loyihalashtirilgan. Bu unga Flutter kabi ko'p platformali freymvorklarda ustunlik beradi. Cairo dasturiy renderlashga yo'naltirilgan, Skia esa boshidanoq GPU tezlashtirishni qo'llab-quvvatlagan, bu interfeys animatsiyalari uchun juda muhimdir.

Skia arxitekturasi

Skia arxitekturasi ko'p qatlamli konveyer sifatida qurilgan bo'lib, har bir qatlam grafik buyruqlarini piksellarga aylantirishning ma'lum bir bosqichi uchun javobgardir. Bunday tuzilma yuqori qatlamlarning quyi grafik API dan mustaqil ravishda qayta ishlatilishiga imkon beradi.

Yuqori qatlam — Canvas API — dasturchiga chizish uchun abstraksiya taqdim etadi. drawRect, drawCircle, drawPath, drawText metodlari geometrik parametrlar va uslublarni (rang, shaffoflik, transformatsiyalar) qabul qiladi. Canvas bu buyruqlarni bajarishdan oldin optimallashtiriladigan ichki buyruqlar grafi bo'lgan Skia Pipeline qatlamiga uzatiladigan operatsiyalar ketma-ketligiga aylantiradi.

O'rta qatlam — Surface va Device — renderlash sodir bo'ladigan maqsadli buferni boshqaradi. Surface o'lcham, rang fazosi va backend turi ko'rsatilgan holda yaratiladi. Device aniq renderlash backendini amalga oshiradi: CPU rastrlashtirgichi (Raster), OpenGL (GL), Vulkan (Vk) yoki Metal (Mt). Device muayyan backend uchun har bir chizish operatsiyasining optimallashtirilgan tatbiqlarini o'z ichiga oladi.

Quyi qatlam — Ganesha (GPU backend) — apparat tezlashtirilgan renderlashni amalga oshiradi. Ganesha yo'llarni rastrlashtirish, gradientlarni to'ldirish va effektlarni qo'llash uchun GPU dan foydalanadi. U buyruqlarni to'playdi va GPU holatini almashtirishni minimallashtiradi. Har bir grafik API uchun Ganesha-ning o'z tatbiqi mavjud: OpenGL uchun Skia GL, Vulkan uchun Skia Vulkan, Metal uchun Skia Metal.

Oraliq ko'rinish — SkSL

Skia effektlarni tavsiflash uchun o'zining shader tili SkSL (Skia Shading Language) dan foydalanadi. SkSL kodi SPIR-V (oraliq ko'rinish) ga kompilyatsiya qilinadi, so'ngra backend uchun xos shader formatiga (GLSL, HLSL, MSL) tarjima qilinadi. Bu platformadan mustaqil ravishda grafik effektlarni tavsiflashning yagona usulini ta'minlaydi.

Skia Flutter-da qanday ishlaydi

Flutter Skia-dan barcha platformalarda asosiy renderlash muharriki sifatida foydalanadi: Android, iOS, Web, Windows, macOS va Linux. Flutter ilovasi kadrni renderlaganda, vidjetlar RenderObject daraxtiga aylantiriladi, so'ngra Engine qatlamiga (C++ da) uzatiladi va Engine yakuniy renderlash uchun Skia-dan foydalanadi.

Kadrni renderlash jarayoni bir necha bosqichni o'z ichiga oladi. Avval Flutter Engine operatsiyalar ro'yxatini (Display List) tuzadi — nimani va qanday chizishni tavsiflovchi Canvas API chaqiruvlari ketma-ketligi. Keyin bu ro'yxat Skia-ga uzatiladi, u operatsiyalarni qismlarga (ekran sohalari) ajratadi, ularni chuqurlik bo'yicha saralaydi va tegishli renderlash backendiga uzatadi. GPU tezlashtirish Skia mavjud grafik API ni aniqlasa avtomatik ravishda yoqiladi.

Skia-ning Flutter-dagi asosiy afzalliklaridan biri bu Flutter Impeller Preview — shaderlarni oldindan ko'rish imkoniyatidir. Skia shaderlarni birinchi foydalanish paytida kompilyatsiya qiladi, bu esa kechikishlarga (shader jank) sabab bo'lishi mumkin. Ushbu muammoni hal qilish uchun Flutter Impeller-ga o'tmoqda — yangi renderlash muharriki, ammo Skia Flutter-ning barqaror versiyalari uchun asosiy tanlov bo'lib qolmoqda.

Layer Tree va Paint

Flutter Layer Tree tushunchasidan foydalanadi — har biri UI ning bir qismini ifodalovchi qatlamlar daraxti. Skia har bir qatlam uchun chizish buyruqlarini oladi va bir nechta qatlamlarni bitta renderlash o'tishida birlashtirish mumkinligini aniqlaydi. Qatlamlarni aralashtirish (layer compositing) murakkab vazifadir, chunki har bir piksel uchun Skia GPU shaderlari orqali amalga oshiradigan shaffoflik va aralashtirish rejimlari (blend modes) hisobga olinishi kerak.

Skia orqali matn renderlash

Skia matnni HarfBuzz (shakllantirish) va icu (unicode) kutubxonalari bilan integratsiya orqali renderlaydi. Flutter-da har bir matn vidjeti matnni gliflarni chizish uchun Skia buyruqlari seriyasiga aylantiradigan Paragraph obyektini yaratadi. Skia subpiksel tekislash (subpixel anti-aliasing), shrift hintingi va SkUnicode kutubxonasi orqali emoji bilan ishlashni qo'llab-quvvatlaydi.

Skia unumdorligi

Skia unumdorligi ko'p yillik optimallashtirish va bir nechta texnikalarning kombinatsiyasi natijasidir: buyruqlarni to'plash, teksturalarni keshlash va GPU kontekstini almashtirishni minimallashtirish. Flutter uchun bu juda muhim, chunki har bir kadr 16 ms (60 FPS) yoki 8 ms (120 FPS) ichida renderlanishi kerak.

Flutter Team benchmarklariga ko'ra, o'rta sinf qurilmalarida (Qualcomm Snapdragon 700 series) GPU tezlashtirish bilan Skia dan foydalanish ekranda 30+ vidjet bilan murakkab interfeyslarni renderlashda barqaror 60 FPS ni ta'minlaydi. Dasturiy renderlashda (CPU) unumdorlik 40–60% ga tushadi, ammo oddiy ekranlar uchun maqbul bo'lib qoladi.

Shader Jank — Skia-ning asosiy muammosi

Skia-ning Flutter-dagi asosiy unumdorlik muammosi bu shader jank (shader kechikishlari) dir. Ekranda ilgari noma'lum effektlar kombinatsiyasiga ega yangi vizual element paydo bo'lganda, Skia yangi shaderni joyida kompilyatsiya qiladi. Kompilyatsiya 50–200 ms davom etishi mumkin, bu vaqt davomida ilova kadrlarni o'tkazib yuboradi. Bu, ayniqsa, moslashtirilgan dekoratsiyali uzun ro'yxatlarni aylantirishda seziladi. Google bu muammoni shaderlarni oldindan kompilyatsiya qiladigan yangi renderlash muharriki Impeller-da hal qilmoqda.

Skia turli platformalarda

Skia keng platformalar spektrini qo'llab-quvvatlaydi, ularning har biri o'z renderlash backendidan foydalanadi. Backend tanlash Flutter Engine ni qurish bosqichida maqsadli platforma va mavjud grafik API-lar asosida aniqlanadi.

Android

Android-da Skia OpenGL ES (barcha qurilmalarda) va Vulkan (Android 7.0+ Vulkan qo'llab-quvvatlovchi qurilmalarda) orqali ishlaydi. Backend tanlash avtomatik ravishda amalga oshiriladi: Vulkan afzalroq, chunki u drayver kechikishini kamaytiradi. Android shuningdek, tizim UI sini HWUI (Hardware Accelerated UI) orqali renderlash uchun Skia-dan foydalanadi, bu Skia-ni nafaqat Flutter-ning, balki operatsion tizimning bir qismiga aylantiradi.

iOS

iOS da Skia Apple-ning xususiy grafik API si Metal-dan foydalanadi. Metal GPU-ga past darajadagi kirish va minimal qo'shimcha yukni ta'minlaydi. Metal paydo bo'lishidan oldin (2014) iOS da Skia OpenGL ES dan foydalangan, ammo Flutter-ning joriy versiyalarida Metal iOS uchun yagona GPU backendidir, bu OpenGL bilan solishtirganda 30% gacha unumdorlik o'sishini beradi.

Desktop (Windows, macOS, Linux)

Desktopda Skia OpenGL (macOS, Linux) va Direct3D 12 (Windows) dan foydalanadi. Windows uchun Direct3D 12 qo'llab-quvvatlashi Flutter 3.13 da qo'shilgan va Windows-da OpenGL bilan solishtirganda sezilarli unumdorlik yaxshilanishini beradi. Skia shuningdek, Windows-da eski grafik drayverlar bilan orqaga qarab muvofiqlik uchun ANGLE (Direct3D ustida OpenGL) orqali dasturiy renderlashni qo'llab-quvvatlaydi.

Web

Flutter for Web da Skia WebAssembly ga (Emscripten orqali) kompilyatsiya qilinadi va WebGL orqali renderlaydi. Ushbu rejimda Skia to'liq brauzerda ishlaydi, mahalliy koddan foydalanmaydi. WebGL versiyasining unumdorligi mahalliy backendlardan past, ammo ko'pchilik veb ilovalar uchun zamonaviy brauzerlarda WebGL apparat tezlashtirishi bilan 60 FPS ga erishish mumkin.