Eğer eski bir IoT cihazı entegre ettiyseniz, donanım sensörleriyle çalıştıysanız veya farklı uluslararası ofislerde tasarlanmış veritabanı şemalarını yönettiyseniz, karışık ölçü birimleriyle uğraşmanın ne kadar can sıkıcı olduğunu bilirsiniz. Birkaç hafta önce, uzaktaki bir hava durumu izleme istasyonundan gelen bir webhook yükünü hata ayıklıyordum. Bir servis sıcaklıkları Fahrenheit cinsinden raporlarken, diğeri rüzgar hızını knot olarak bildiriyordu ve yeni merkezi analiz motorumuz Celsius ve metre/saniye bekliyordu.
Yazılım geliştirmenin büyük resminde küçük bir sorun olsa da, bu durum zihinsel akışınızı bozuyor. Her dönüştürme mantığını kontrol etmem gerektiğinde, kendimi formülü Google'da ararken veya birim dönüştürme sitelerinde kaybolurken buluyordum. Bu sitelerin çoğu çerez bildirimleri, otomatik oynayan video reklamlar ve yazarken sayfanın atlamasına neden olan düzen değişimleriyle doluydu. Basit bir araç olması gereken şey için inanılmaz sinir bozucuydu.
Bu hayal kırıklığı beni ConvertEase'i geliştirmeye itti. Uzunluk, ağırlık, sıcaklık, hacim, hız, alan, veri, zaman ve para birimi arasında anlık dönüşüm ızgaraları sunan hızlı, sıfır reklamlı, tek sayfalık bir yardımcı program istedim. Hiçbir karmaşa, açılır pencere yok; sadece ihtiyacınız olan sayılar.
Detaylar ve Etkileri
Teknoloji yığını olarak neden Vanilla seçtim? Anında yüklenmesi ve her cihazda çalışması gereken bir araç için ağır bir modern JavaScript framework'ü kullanmak gereksizdi. Hafif, standart bir yığın tercih ettim: HTML5 & Vanilla CSS yapısal basitlik ve hızlı işleme için; Vanilla JavaScript tüm dönüştürme mantığı istemci tarafında çalışıyor, yani dönüştürmeler için sıfır ağ gecikmesi; Harici para birimi API'si ise yalnızca para birimi sekmesi aktif olduğunda asenkron olarak veri çekiyor, API çağrılarını en aza indirmek için sonuçları yerel depolamada önbelleğe alıyor. Framework yükünden ve derleme adımı şişkinliğinden kaçınarak, tüm uygulama 50KB'nin altında kalıyor ve yavaş mobil ağlarda veya eski donanımlarda bile milisaniyeler içinde yükleniyor.
Teknik Analiz
Teknik zorluk: Kayan nokta matematiği ve dinamik ızgaralar. Bir birim dönüştürücü oluşturmak, JavaScript'in yerel kayan nokta aritmetiğiyle başa çıkmaya başlayana kadar önemsiz görünür. 0.1 + 0.2'yi dönüştürürseniz, JavaScript bunu 0.30000000000000004 olarak değerlendirir. Mühendislik hesaplamalarında veya döviz bozdurmada küçük yuvarlama hataları hızla birikebilir ve hata takibinde kabusa dönüşebilir. Bunu çözmek için, girişin büyüklüğüne bağlı olarak duyarlılığı dinamik olarak işleyen özel bir yuvarlama yardımcısı oluşturdum. Günlük ölçümler için temiz bir ondalık basamağa kırpar, ancak çok küçük bilimsel değerler için anlamlı basamakları koruyarak, ekranda gereksiz sıfırlar olmadan doğruluğu sağlar.
Önemli Gelişmeler
Bir diğer zorluk ise dönüşüm ızgarasını oluşturmaktı. Kullanıcının her seferinde 'Kimden' ve 'Kime' açılır menülerini seçmesi yerine, bir değeri bir kez yazıp tüm ilgili birimlere anında dönüştürülmüş görmesini istedim. Düzinelerce dinamik güncellemeyi büyük tarayıcı yeniden boyamalarına neden olmadan işleyen oldukça duyarlı bir ızgara düzeni oluşturmak, dikkatli DOM manipülasyonu ve CSS Grid optimizasyonu gerektirdi. Para birimi listeleri ve bilimsel birimler arasında geçiş yaparken bile düzenin sabit kalmasını sağlamak zorundaydım.
Çıkarılan dersler: Mümkün olduğunda istemci tarafında hesaplama yapın; kullanıcı için daha hızlıdır, API gecikmesini ortadan kaldırır ve barındırmayı basit ve ucuz hale getirir. Giriş akışına öncelik verin: Kullanıcı bir sayı yazmaya başlamadan önce üç kez tıklamak zorundaysa, arayüz başarısız olmuştur. Odak hemen aktif giriş alanına gitmelidir. Yardımcı uygulamalar için reklamlara hayır deyin: Modern web şu anda reklamlarla dolu. Temiz ve ücretsiz bir şey oluşturmak, gerçek kullanıcı güveni oluşturan bir farklılaştırıcıdır. CSS değişkenleri güçlüdür: CSS değişkenlerini kullanarak, minimum JavaScript müdahalesiyle tema değiştirme ve duyarlı düzen ayarlamaları yapabildim.
Gelecekte Ne Bekleniyor?
Eğer sık sık metrikler arasında geçiş yapan bir geliştirici, öğrenci veya mühendisseniz, aracı https://convertease.getinfotoyou.com adresinde deneyebilirsiniz. Günlük iş akışınızda daha da faydalı hale getirmek için geri bildirimlerinizi veya eklenmesini istediğiniz birim kategorilerini duymayı çok isterim.
Kaynak: dev.to
