TikTok, Jetpack Compose ile kod boyutunu% 58 küçülttü ve yeni özellikler için uygulama performansını artırdı

TikTok, devasa kullanıcı tabanı ve yenilikçi özellikleriyle tanınan küresel bir kısa video platformudur. Ekip, kullanıcıları için sürekli olarak güncellemeler, denemeler ve yeni özellikler yayınlıyor. Teknik borçları yönetirken hızı koruma zorluğuyla karşılaşan TikTok Android ekibi, Jetpack Compose'u kullanmaya başladı.

Ekip, ürün gereksinimlerinin daha hızlı ve daha yüksek kaliteli bir şekilde yinelenmesini sağlamak istiyordu. Ekip, Compose'u kullanarak daha az kod yazıp bilişsel yükü azaltarak mühendislik verimliliğini artırmayı, aynı zamanda daha iyi performans ve kararlılık elde etmeyi amaçladı. 

Geliştirici üretkenliğini artırmak için karmaşık kullanıcı arayüzünü basitleştirme

TikTok sayfaları genellikle göründüklerinden daha karmaşıktır ve çok sayıda katmanlı koşullu şart içerir. Bu karmaşıklık genellikle bakımı zor, optimum düzeyde yapılandırılmamış görünüm hiyerarşilerine ve aşırı görünüm iç içe yerleştirmesine neden oluyordu. Bu da ölçüm geçişlerinin sayısının artması nedeniyle performansın düşmesine yol açıyordu.

Compose, bu yapısal soruna doğrudan bir çözüm sundu. 

Ayrıca Compose'un ölçüm stratejisi, çifte vergilendirmeyi azaltmaya yardımcı olarak ölçüm performansının optimize edilmesini kolaylaştırır. 

TikTok'un merkezi tasarım sistemi ekibi, geliştirici üretkenliğini artırmak için farklı uygulama özellikleri üzerinde çalışan ekiplere bir bileşen kitaplığı sunuyor. Ekip, Compose'da geliştirme yapmanın basit olduğunu, küçük composable'lardan yararlanmanın son derece etkili olduğunu, koşullu mantık içeren büyük kullanıcı arayüzü bloklarını dahil etmenin hem kolay olduğunu hem de minimum ek yük getirdiğini gözlemledi.

Stratejik taşıma ile geleceğe yönelik bir yol oluşturma

TikTok, Jetpack Compose'u stratejik olarak benimseyerek teknik borçları kontrol altında tutarken kullanıcıları için mükemmel deneyimler oluşturmaya odaklanmaya devam etti. Compose'un koşullu mantığı sorunsuz bir şekilde işleyebilmesi ve oluşturma sürecini kolaylaştırması sayesinde ekip, yeni veya tamamen yeniden yazılmış sayfalarda sayfa yükleme süresini% 78'e varan oranda azaltmayı başardı. Bu iyileşme, daha küçük vakalarda% 20-30, tam yeniden yazma ve yeni özelliklerde ise% 70-80 oranında oldu. Ayrıca,Views'da oluşturulan aynı özelliğe kıyasla kod boyutunu%58 oranında azaltmayı başardılar. Ekip ayrıca birkaç bilgi daha paylaştı:  

TikTok ekibinin genel stratejisi, belirli kullanıcı yolculuklarını kademeli olarak taşımaktı. Bu sayede geçiş yapma, ölçülebilir avantajları doğrulama ve ardından daha fazla ekrana ölçeklendirme fırsatı elde ettiler. QR kodu özelliğindeki genel yapıyı basitleştirmek için Compose'u kullanmaya başladılar ve iyileştirmeleri gördüler. Ekip daha sonra geçişi Giriş ve Kayıt deneyimlerini de kapsayacak şekilde genişletti. 

Ekip, öğrendikleri diğer bilgileri de paylaştı:  

TikTok ekibi, taşıma sırasında performansı kontrol ederken tek bir ViewHolder içindeki öğeleri değiştirmek için çok sayıda küçük ComposeView kullanmanın oluşturma ek yüküne neden olduğunu fark etti. Taşıma işlemini tüm ViewHolder için tek bir ComposeView kullanacak şekilde genişleterek daha iyi sonuçlar elde ettiler.

Özel yükseklik mantığına ve denemelere göre kullanıcı arayüzünü gizleyip göstermek için koşullu mantığa sahip olan ViewPager içindeki bir Fragment taşınırken performans etkilenmedi. Bu durumda, ViewPager'ı Composable'a taşımak, Fragment'ı taşımaktan daha iyi performans gösterdi. 

Jun Shen, Compose'un "özellik geliştirme için gereken kod miktarını azaltmasını, test edilebilirliği artırmasını ve teslimatı hızlandırmasını" çok beğeniyor. Ekip, Compose'un kullanımını istikrarlı bir şekilde artırarak uzun vadede tercih edilen çerçeve haline getirmeyi planlıyor. Jetpack Compose, hem geliştirici deneyimini hem de üretim metriklerini geniş ölçekte iyileştirmek için güçlü bir çözüm olduğunu kanıtladı.

Jetpack Compose'u kullanmaya başlama

Jetpack Compose 'un ekibinize nasıl yardımcı olabileceği hakkında daha fazla bilgi edinin.