Sürekli değişen teknoloji çağında akıllı telefon kullanımı artıyor ve yaygınlaşıyor. Bu noktada, tüm işletmelerin gelişen trendlere ayak uydurması zorunluydu. Gelecekteki başarının sırrı, akıllı özelliklerin ve görsel olarak çekici arayüzlerin bir araya getirilmesiydi. Birçoğunuz hala React Native ve Tiki’nin kararının ardındaki mantığı merak ediyor, hadi öğrenelim!
React Native Nedir?
Facebook, React Native olarak bilinen açık kaynaklı çerçeveyi geliştirdi. Bununla birlikte Web, UWP, Android ve iOS için mobil uygulamaların geliştirilmesinde kullanılmaktadır. Ayrıca geliştiricilerin React Natives ile yerel uygulamalar oluşturmasına olanak tanır.
React Native’in Avantajları ve Dezavantajları
Avantajı:
- kullanıcılara uygulama geliştirmede para ve zaman tasarrufu sağlar
- İnsan kaynaklarını sonuna kadar kullanabilen
- kodun daha az kusuru ve daha az sürdürülebilirliği
- büyük bir kullanıcı kitlesine sahip
- optimize eder ve stabilite sağlar
- Tüm verileri analiz etme sürecini basitleştirin.
- Çeşitli İşletim Sistemi Ortamları için Yerel Kod Oluşturun
- Kullanıcılara ek deneyimler sunun
Kusur:
- Yerel kod ve daha fazlasını gerektirir.
- Native App ile karşılaştırıldığında performans gerçekten eksik.
- Güvenlik işlevi ciddi şekilde tehlikeye girmiştir ve ağır bir şekilde etkilenmiştir.
- Çok sayıda hesaplama gerektiren durumlar için uygun değildir
Tiki Neden React Native’I Seçti?
Tiki, Yeniden Kullanılabilirlik temelinde React Native’i seçti
Groove Technology Software’e (En İyi Yazılım Dış Kaynak Kullanımı Şirketi) göre, hem iOS hem de Android platformlarıyla çalışan tek tip kod satırı, React Native’in bir başka güçlü yönüdür. Örneğin, React’ın Native switch bileşenini kullanmak, Android cihazlarda Native Switch bileşenini gösterir ve iOS cihazlarda bir UISwitch buna mükemmel bir örnektir. iOS ve Android için Tiki uygulamalarında JavaScript’in %80’i kullanılıyor.
Sürekli entegrasyon
Jenkins, Tiki tarafından yerel uygulamaları dağıtmak için kullanılıyor. Umarız React Native uygulamaları da aynı anda aynı şekilde benimsenir. Jenkins testi gerçekleştirecek ve hazırlama şubesi aracılığıyla içe aktarılan her taahhüt için en yeni JS paketini CodePush sunucusuna yükleyecektir. Tiki daha sonra Slack kanalı üzerinden bilgilendirilecek.
“Code-Push Release-React “TikiHome-ios” ios -d “Staging” – des “Jenkins konuşlandırması” – dev true -m false -t” işlemlerini yürütmek için Tiki, bu örneğe dayanarak özel bir CLI aracı geliştirdi. Kod, geliştirme dalını geçtikten sonra ana dalın içine aktarılacaktır. Jenkins, bir üretim hedefi oluşturmanın ve programı en son dağıtım paketini kullanarak dağıtmanın yanı sıra, her testi gerçekleştirecek ve bir sürüm etiketi sağlayacaktır.
Performans sorunlarıyla ilgili
Redux, “Dzut Co Hon”un orijinal temeliydi. Tiki, ağ aramasının ardından anında değişen durumla, tıklama üzerine ürünün ilerlemesini ve durumunu görüntülemeyi hedefliyor.
Ancak gerçekte daha fazla şeyin seçilmesi yalnızca birkaç saniye sürer. Tiki, “Redüktör”ün Ürün Bileşeninden önceden tanımlanmış eylemi almasının uzun zaman aldığını gördü. Tiki, Redux’u “Ürün Listesi Bileşeni”nden çıkarma ve “Ürün Bileşeni”nde “setState”i kullanma kararı aldı.
ListView’in Tiki’nin RN 0.42 kullanan yeni uygulamasında hâlâ sorunları var. Bunun nedeni, kaydırmayı son derece zorlaştıran çok sayıda sekme ve karmaşık görünümdür. Bu nedenle Tiki, nasıl göründüğünü kontrol etmek için “FlatList”e dönüşecektir.
ViewPager kullanılarak bir sekme birden fazla sekme için yüklendiğinde, ListView’in tamamı ve Mağazanın tamamı önbelleğe alınacaktır. Bunun nedeni, düşük kaliteli cihazlarda yaygın olan yetersiz bellek olmasıdır. Bu nedenle Tiki’nin aktif kart için gerekli verileri “Hafıza”ya geri yüklemesi yeterlidir. Diğer etiketlerin verileri “LocalStorage”da saklanacaktır. Yani bu sekmelerde sadece yükleme ekranı görüntülenecektir.
Tiki yalnızca disk önbelleğinden bilgi almak için zaman harcıyor ve kullanıcılar bu sekmelere döndüğünde “shouldComponentUpdate()” ve “Pure Component” görüntülüyor ki bu oldukça kullanışlı. Kullanıcı başarılı bir banner ticareti gerçekleştirirse gösterge daha sonra güncellenecektir. Bunun sonucunda “ana” bileşende veya bileşenin tamamında değişiklik ve performansta düşüş meydana gelecektir. İlgisiz bileşenlerin değiştirilmesini önlemek için Tiki, “shouldComponentShouldUpdate” işlevini kullanır.
Düzen sekmesi
En yaygın kullanılan kütüphanelerden biri olan React-native-scrollable-tab-view artık Tiki tarafından da kullanılıyor. Geniş bir yelpazede aksesuarların kullanımı çok kolaydır ve materyal tasarım moduna çok benzer bir çalışma tekniği ile temel olarak saf JavaScript olabilir.
Ancak Tiki kullanıcı arayüzünün karmaşıklığı kütüphane için performans sorunlarına neden olmaya başladı. Saf bir JavaScript uygulaması olduğundan, kullanıcının girişi ile program arasında bir gecikme vardır. Sonuç olarak RNTabLayout’un Javascript sürümünü kendimiz oluşturmaya karar verdik.
Sayfa geçişleri hâlâ yavaş
Giriş butonuna tıkladıktan sonra etkinliğe ait saat ve ürünler ekranda gösterilecektir. Gezginin yolunu yeniden yönlendirdiğimizde, JavaScript’in bu yeni ekranın her yönünü göstermesi gerekecektir. Bu iki görevi aynı anda tamamlaması gerektiğinden, bu JS zincirinde bir sayfa geçişi de gerçekleştirmesi gerekiyor, bu da sayfa geçişini son derece yavaş hale getiriyor.
Sonuç olarak, her etkinliği InteractionManager.runAfterInteraction() kullanarak planlamamız gerekir. Bu nedenle “Kayıt Ol” ekranındaki ürün listesi, dönüştürme işleminden önce tüm sekme verilerine önceden yüklenecektir. Geriye kalan tek şey, dönüşüm tamamlandıktan sonra içerik sunumuna odaklanmaktır. Sonuç olarak kullanıcı deneyimi gelişir.
Her platform için ayrı ayrı kod
QA ekibi geri sayım özelliğini denediğinde Tiki tuhaf bir hata buldu: iOS, Android’den daha hızlı sayıyordu. Tiki sorunu çözmek için aşağıdakilere baktı:
et currentTime1
geri sayım(10000)
currentTime2’ye izin ver
Her iki platformda da sonuç currentTime2 — currentTime1 = 10000 olacaktır. Ancak yalnızca iOS doğrudur. Ayrıca iOS, yukarıdaki ürün listesini Android’den daha hızlı oluşturur. Bu yüzden birkaç hile kullandık.
Güncellemeler çok sık yayınlanıyor
React Native’in birçok sürümü sürekli olarak geliştirilmekte, çok sayıda özellik ve hata düzeltilmektedir. Bununla birlikte, her uygulama güncellemesinde çökme olasılığını artıran bazı önemli değişiklikler de içerirler. Yukarıda belirtilen işlevlerin birçoğu React Native’e dayandığından, yeni sürüme yapılan her yükseltmenin onarılması uzun zaman alacaktır.
Sıcak yeniden yükleme ve Canlı yeniden yükleme
O zamana kadar pek çok kişi React Native’de canlı yeniden yükleme yapmaktan mutluluk duyacaktır. Ancak programlama dillerinde durum böyle değildir; derleme işlemi bittikten sonra çıktının görünmesi 120 saniye kadar sürebilir.
React Native ise yeniden derleme gerektirmeden düzenleme yapmanıza olanak tanır. Ayrıca uygulama programlanırken JavaScript kodu diğer kaynaklarla birleştirilecek ve yerel sunuculardan yüklenecektir. Bu, kullanıcı arayüzü yinelemeleri için gereken süreyi azalttı.
Ek olarak React Native, Android Native Hizmet sağlayıcıları sayesinde Hot Reloading gibi çeşitli yeni yetenekleri de bünyesinde barındırıyor. Eş zamanlı olarak güncelleme yapacak veya ayarlamalar ekleyecek ve uygulamanın daha normal bir şekilde çalışmasını sağlayacaktır.
Hızlı Yeniden Yükleme, benzersiz durumlarda bile şu anda kusursuz değildir, ancak uygulamayı yeniden yüklediğinizde sorunu çözmenize yardımcı olacaktır.
React Native’in aşamalı olarak benimsenmesi
İlk başta bunu, ürün aramaya yönelik belirli işlevler de dahil olmak üzere yeni özellikler oluşturmak için kullandık. Ancak tamamen React Native’e geçmek oldukça maliyetli olabilir ve bazı işlevler için yerel programlama dillerini kullanmak gerekli olabilir. Sonuç olarak Tiki hibrit bir uygulama geliştirmeye karar verdi.
Şirketin her yıl düzenlediği “Dzut Co Hon” etkinliği sırasında müşterilere Tiki’nin web sitesi aracılığıyla hoş bir mesaj verildi. Ancak bu etkinlik geçen yılın temmuz ayında mobil platforma da genişletildi. Vietnam’daki herkes yedinci ayın en şanssız ay olduğunun farkındadır. Ölülerin ruhlarının insanların hayatlarına, işlerine, işlerine karışmasını önlemek için insanlar sıklıkla para harcar ve bu eşyaları onlara hediye ederler. Tiki konusunda hiçbir şey sağlamadılar ancak diğer çevrimiçi perakendecilerin saygı duyması gereken başka bir şey yaptılar: özel durum için fiyatlarını %80 oranında düşürdüler. Gerisi, bu ürünleri herkesten önce satın almak için hızlı hareket etmenize bağlıdır.
Sonuçlandırmak
Yazılım ve uygulamalar oluşturmak için en iyi çerçevelerden biri React Native’dir. Tiki’nin React Native kullanma kararının detayları yukarıda verilmiştir. Tamindir.net.tr‘nin bu yazıda sunduğu bilgi ve bilgilere büyük değer bulacağınızı umuyoruz.
