TikTok, geniş kullanıcı tabanı ve yenilikçi özellikleriyle bilinen küresel bir kısa video platformudur. Ekip, kullanıcıları için sürekli olarak güncellemeler, denemeler ve yeni özellikler yayınlamaktadır. TikTok Android ekibi, teknik borcu yönetirken hızı koruma zorluğuyla karşılaştığında Jetpack Compose'u kullanmaya başladı.

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

Geliştiricilerin üretkenliğini artırmak için karmaşık kullanıcı arayüzünü kolaylaştırma

TikTok sayfaları genellikle göründüğünden daha karmaşıktır ve çok sayıda katmanlı koşullu şart içerir. Bu karmaşıklık genellikle bakımı zor, alt düzeyde yapılandırılmış görünüm hiyerarşileri ve aşırı görünüm yerleştirmeyle sonuçlanıyordu. Bu durum, ölçü geçişlerinin sayısının artması nedeniyle performans düşüşüne neden oluyordu.

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

Ayrıca, Compose'un ölçüm stratejisi, çifte vergilendirmeyi azaltarak performansı ölçmeyi ve optimize etmeyi kolaylaştırır. 

TikTok'un merkezi tasarım sistemi ekibi, geliştiricilerin verimliliğini artırmak için farklı uygulama özellikleri üzerinde çalışan ekiplere bir bileşen kitaplığı sunar. Ekip, Compose'da geliştirmenin basit olduğunu gözlemledi. Küçük composable'lardan yararlanmak oldukça etkili olurken koşullu mantık içeren büyük kullanıcı arayüzü bloklarını dahil etmek hem kolay hem de minimum ek yükle gerçekleşiyor.

Stratejik taşıma yoluyla ilerleme

TikTok, Jetpack Compose'u stratejik olarak benimseyerek teknik borç konusunda güncel kalmayı başardı ve aynı zamanda kullanıcıları için harika deneyimler oluşturmaya odaklanmaya devam etti. Compose'un koşullu mantığı sorunsuz bir şekilde ele alabilmesi ve kompozisyonu kolaylaştırması, ekibin yeni veya tamamen yeniden yazılmış sayfalarda sayfa yükleme süresini% 78'e kadar azaltmasını sağladı. Bu iyileştirme, daha küçük durumlarda% 20-30, tam yeniden yazma ve yeni özelliklerde ise% 70-80 oranında olmuştur. Ayrıca,aynı özelliğin Views'da oluşturulan sürümüyle karşılaştırıldığında kod boyutunu%58 oranında azaltmayı da başardılar.  Ekip, birkaç önemli bilgiyi daha paylaştı:  

TikTok ekibinin genel stratejisi, belirli kullanıcı yolculuklarını kademeli olarak taşımaktı. Bu sayede, geçiş yapma, ölçülebilir avantajları onaylama ve 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şmeleri gördüler. Ekip daha sonra taşıma işlemini giriş ve kayıt deneyimlerini de kapsayacak şekilde genişletti. 

Ekip, bazı ek bilgiler 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 kompozisyon yüküne neden olduğunu tespit etti. Taşıma işlemini genişleterek tüm ViewHolder için tek bir ComposeView kullanıp daha iyi sonuçlar elde ettiler.

ViewPager içinde bir Fragment'ı taşırken (özel yükseklik mantığına ve denemelere göre kullanıcı arayüzünü gizlemek ve göstermek için koşullu mantığa sahip), performans etkilenmedi. Bu durumda, ViewPager'ı Composable'a taşıma işlemi, Fragment'ı taşımaya kıyasla 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ırmayı ve uzun vadede tercih ettiği çerçeve haline getirmeyi planlıyor. Jetpack Compose, hem geliştirici deneyimlerini hem de üretim metriklerini büyük ö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.