Araçlar

Önizlemeler, kaydedince yeniden derleme, betikle ekran görüntüleri, profil çıkarma ve çalışırken işe yarayan ortam değişkenleri.

#Önizlemeler

Compose'un @Preview'ı gibi, bir önizleme tek bir composable'ı uygulamanın geri kalanı olmadan, seçtiğiniz boyutta bir çerçevede tek başına gösterir. Onu composable'ın yanına, uygulamanızın kaynaklarına yazın:

KOMPOZ_PREVIEW(CounterCardPreview, .width = 400, .height = 220) {
MaterialTheme(lightColorScheme(), [] { CounterCard(); });
}

KOMPOZ_PREVIEW(CounterCardDarkPreview, .width = 400, .height = 220, .darkTheme = true) {
MaterialTheme(darkColorScheme(), [] { CounterCard(); });
}

Uygulamayı KOMPOZ_PREVIEW'ı bir önizlemenin adına ayarlayarak başlatın; penceresi yalnızca o önizlemeyi, o boyutta gösterir:

KOMPOZ_PREVIEW=CounterCardPreview ./build/myapp

KOMPOZ_PREVIEW='*' ya da hiçbir önizlemenin taşımadığı bir ad, hepsini adı ve boyutuyla birlikte alt alta gösterir.

Addan sonraki seçenekler bir PreviewSpec'tir:

Yazı ölçeği önizlemenin kendisinin değil, pencerenindir (KOMPOZ_FONT_SCALE). Bir önizleme program başlarken kendini kaydeder; bu yüzden uygulamaya bağlanan bir kaynak dosyada olmalıdır.

#Kaydedince yeniden derleme ve başlatma

scripts/dev.sh

dev.sh vitrini derler, başlatır ve bir kaynak dosya her değiştiğinde yeniden derleyip yeniden başlatır. Uygulama kaldığı yere döner: bulunduğu ekran, kaydırma konumları ve rememberSaveable değerleri, Android'in süreci sonlanan bir uygulamayı geri getirdiği gibi, KOMPOZ_STATE_FILE aracılığıyla kapanırken yazılır ve açılırken okunur. Başarısız bir derleme çalışan uygulamaya dokunmaz. Pencereyi kapatmak ya da Ctrl+C'ye basmak onu sonlandırır.

Argümanları; hedef, derleme dizini ve uygulamanın neyle başlatılacağıdır:

scripts/dev.sh showcase build kompoz://components

Bir önizlemeyle birlikte, her kaydedişten birkaç saniye sonra geri gelen, tek başına bir bileşen elde edersiniz:

KOMPOZ_PREVIEW=CounterCardPreview scripts/dev.sh

dev.sh Kompoz'un kendi klasörlerini (include, src, platform, examples) izler. Kendi uygulamanız için onu kopyalayın; izlediği klasörleri ve derlediği hedefi değiştirin.

#Betikli çalıştırmalar ve ekran görüntüleri

KOMPOZ_SCRIPT uygulamayı bir kullanıcı olmadan sürer: tıklamalar, yazma, kaydırmalar ve ekran görüntüleri, koordinatlar dp cinsinden. Betik çalışırken zaman sanaldır, böylece animasyonlar her çalıştırmada aynıdır; betik bitince gerçek zaman devralır ve uygulamayı kaldığı yerden kullanmaya devam edebilirsiniz. realtime'dan sonra betiğin geri kalanı gerçek zamanda çalışır, kareleri bir insanın göreceği gibi ekranın hızına göre bekletilir: KOMPOZ_PROFILE ile ölçmek için.

SDL_VIDEODRIVER=offscreen KOMPOZ_SCRIPT="click 160 263; wait 30; shot out.png; quit" ./build/showcase

SDL_VIDEODRIVER=offscreen pencere olmadan çalıştırır; bu, bir derleme sunucusunda işe yarar (macOS'ta çizim software renderer ile yapılır: ekransızken SDL'in OpenGL'i orada EGL ister, macOS'ta EGL yoktur). Bir önizleme de aynı yolla resme dönüşür:

SDL_VIDEODRIVER=offscreen KOMPOZ_PREVIEW=CounterCardPreview KOMPOZ_SCRIPT="wait 10; shot preview.png; quit" ./build/myapp

; ile ayrılan komutlar:

Arayüzü hiç pencere açmadan kontrol eden testler için Test sayfasına bakın.

#Recomposition'ı görmek

Modifier().recomposeHighlighter(), Compose snippet'lerindeki highlighter gibi, bir düğümün çevresine onu oluşturan composable'ın kaç kez çalıştığını gösteren bir çerçeve çizer: olması gerekenden sık yeniden kompoze olan şeyi bulmak için kullanın.

void Row1(const std::string& title) {
Text(title, Modifier().recomposeHighlighter());
}

KOMPOZ_TRACE=1, her recomposition için kaç scope'un çalıştığını ve kaçının atlandığını günlüğe yazar.

#Karelerin profilini çıkarmak

KOMPOZ_PROFILE=1 kare sürelerini günlüğe yazar. İşi ekranın yenileme süresinden uzun süren ya da bir öncekinden iki yenileme süresinden fazla sonra gelen kare yavaştır; her yavaş kare için girdiye, kompozisyon ve yerleşime, GPU'nun daha önceki bir kareyi bitirmesini beklemeye (wait), çizime ve sunuma harcanan süreyi, çizdiği ekran dışı katmanlarla rasterleştirdiği glifleri yazar. Her saniye bir özet gelir: kareler, kaçının gösterildiği ve arka arkaya gösterilen iki kare arasında ekranın kaç yenilemesinin karesiz geçtiği, işin ve beklemenin ortalamaları, Kompoz'un GPU renderer'ında da bir karenin GPU'daki kendi süresi. GPU'da bir yenileme süresinden uzun süren kare, en pahalı geçişleriyle yazılır; her biri çizdiği yerle (window, 1080x2400, 2048x2048 R16F) ya da copy WxH olarak adlandırılır:

kompoz: GPU frame 12.2 ms: 1080x2400 10.5, window 1.6, 2048x2402 R16F 0.1

GPU süresi Vulkan'ın ve WebGPU'nun zaman damgalarıyla (WebGPU'da adaptörde timestamp-query varsa) ve OpenGL ES'in zamanlayıcı sorgularıyla (EXT_disjoint_timer_query, WebGL 2'de _webgl2 olanı) ölçülür; Metal'de yalnızca karenin tamamınınki, komut tamponlarından. Hiçbirinin olmadığı yerde profil bunu söyler.

Android'de ortam değişkeni yoktur; orada profil aracı uygulamanın depolamasında bir dosya arar ve çıktısı adb logcat -s SDL/APP'a gider:

adb shell run-as dev.kompoz.showcase touch files/kompoz-profile

run-as'in reddedildiği yerde (SELinux: örneğin bir LineageOS derlemesi) bu dosyalar (kompoz-profile, kompoz-script, kompoz-gpu) uygulamanın harici dosyalarına da konabilir: adb shell touch /sdcard/Android/data/dev.kompoz.showcase/files/kompoz-profile.

Bir betik de oradaki bir dosyadan gelir (aynı komutlar; bir kare ölçümü her cihazda aynı tekrarlanır):

adb shell run-as dev.kompoz.showcase sh -c "'echo \"realtime; wait 60; swipe 200 600 200 200 12; wait 120\" > files/kompoz-script'"

Kompoz her kareyi önce kaydeder ve yalnızca bir önceki kareden beri değişeni yeniden çizer; ekranda hiçbir şeyin değişmediği bir kare ne çizilir ne sunulur. Bunu görmek ya da kontrol etmek için:

• KOMPOZ_DAMAGE_SHOW=1 her karede yeniden çizilenin çevresini çizer.
• KOMPOZ_DAMAGE_CHECK=1 her kareyi ayrıca sıfırdan çizer ve farklı çıkan her pikseli günlüğe yazar.
• KOMPOZ_FULL_REDRAW=1 her kareyi sıfırdan çizer.

#Ortam değişkenleri

Web'de onları sayfanın sorgusu belirler: showcase.html?KOMPOZ_GPU=gles&KOMPOZ_PROFILE=1.

#Paketleme

scripts/package.sh vitrini araç zincirini bulduğu her platform için paketler; Kurulum sayfasına bakın.

#Ayrıca bakın

• Test: pencere olmadan çalışan arayüz testleri.
• Aşamalar: kompozisyonun, yerleşimin ve çizimin maliyeti ve her birini nasıl ucuz tutacağınız.